Restyles — say what a prompt should become · Launch Video Breakdown: Hook, Pacing & Motion Design
Scene-by-scene timeline & spoken transcript
The Hook
Visual Restyling Concept Hook
“What if you could take any high-end website design and completely restyle it in seconds just by describing what you want?”
- On screen
- MEASURED PURITY OYLA DISCOVER + motionsites Restyle NEW
- Camera
- Static screen capture switching to web catalog view with subtle digital zoom
- Motion
- Screen transition from live luxury website to web studio dark dashboard
Problem Agitation
Prompt-to-Site Iteration Limits
“Standard AI website generators give you generic templates that lack art direction, typography finesse, and dynamic motion assets.”
- On screen
- RESTYLE YOUR WEBSITE Your website Style Selected AI Future Studio Prompt
- Camera
- Smooth cursor panning across categorized style cards
- Motion
- Card hover elevation and toggle slider transition
Product Reveal
Deep Dive into Restyle Studio
“Select any template style, type your natural language prompt like 'deep-sea diving expedition', and Restyle generates curated prompts and cut-out assets.”
- On screen
- deep-sea diving expedition Restyle my site DREAMCORE LANDING 3D STORY
- Camera
- Focused capture on input field followed by card grid updates
- Motion
- Real-time keystroke rendering and loading state feedback
Feature Teaser
Deploying Restyles to AI Builders
“Copy the generated prompt alongside custom visual assets and drop it right into Google AI Studio or Bolt to see your fully coded site render live.”
- On screen
- SINK INTO THE DEEP Build your ideas with Gemini Your restyle prompt
- Camera
- Split browser screen interaction panning from prompt modal to live web preview
- Motion
- Window switching and instant live-preview layout pop-in
Call to Action
Gothic Theme Export & Final CTA
“From underwater expeditions to gothic manors, transform your web architecture in seconds on motionsites.ai.”
- On screen
- WHERE THE SHADOWS DWELL IN TIMELESS OPULENCE Wellness Hero Copy full prompt Build in AI Studio
- Camera
- Slow zoom out from finished luxury hero section back to dashboard
- Motion
- Smooth fade-out and click-triggered overlay dismissal
Motion design primitives
Synthesizable in Remotion · key components of the saas-workflow-screencast-showcase template.
ScreenCaptureZoomPan
Dynamic virtual camera pan and scale across high-resolution desktop browser captures.
+ Code construction recipe
Use Remotion interpolate on frame to animate transform origin, scale from 1.0 to 1.35, and translate X/Y coordinates using Easing.out(Easing.cubic).
CursorPathFollower
Procedural cursor overlay mimicking human mouse movement with click ripples.
+ Code construction recipe
Interpolate SVG cursor coordinates across keyframes using spring physics; spawn expanding circle ripple on designated click frames.
AssetGridCardCascade
Staggered reveal of UI thumbnail cards with rounded borders and glow borders on selection.
+ Code construction recipe
Map items with index-based spring delay, modulating opacity from 0 to 1 and translateY from 20px to 0px with an active border tint transition.
PromptTerminalOverlay
Monospace code modal sliding into view over blurred dark background.
+ Code construction recipe
Animate backdrop-filter blur via interpolate while modal container springs in from scale 0.95 to 1.0 with subtle glow stroke.
Style DNA & aesthetic system
Visual aesthetic
Typography
Motion
Special effects
Pacing & rhythm
Conceptual story rhythm
- 1
Initial Contrast Hook
Purpose. Demonstrate the high aesthetic standard achievable before showing the workflow.
Execution. Full-bleed hero banner showcase shifting quickly into the application workspace.
- 2
Curated Style Exploration
Purpose. Showcase system versatility across multiple art directions and design categories.
Execution. Rapid filtering across SaaS, Creative, and 3D categories in the UI grid.
- 3
Prompt Prompting Mechanism
Purpose. Demystify user input simplicity through direct typing demonstration.
Execution. Text input typing animation paired with instant button state transition.
- 4
Output Pipeline & Code Copy
Purpose. Prove real engineering viability with production code export.
Execution. Inspection of structured code prompts and packaged transparent PNGs.
- 5
Live Execution Payoff
Purpose. Validate final output quality inside external web development environments.
Execution. Side-by-side builder compilation resulting in interactive animated websites.
Remix in Animatiq Studio
Master remix prompt · agent-ready
Sample remix
Objective
Launch video for an automated 3D web asset generator.How the recipe adapts
Replace website restyling presets with 3D shader and mesh templates, tracking cursor clicks on model cards and panning into interactive three.js render previews.Remix blueprint · saas-workflow-screencast-showcase
Scene durations (5 scenes, 324s)
Key Remotion components
Related AI & ML Product Launches
Explore all AI & ML launches →
Introducing Griffin, the first AI to pass the video Turing test
The most emotive and controllable TTS model
We just released QVAC TranscribePsy, a speech-to-text model small enough to run inside a phone app. It covers 25 European languages on a laptop and 8 on a phone, and on an iPhone 17 Pro Max's Ne