Make Vercel feel like the shortest path between a Next.js commit and a production URL: cinematic, terminal-first, brutally fast, and specific enough that a frontend lead can see the whole workflow in 20 seconds.

Pacing

20 seconds, five hard-working shots, fast UI transitions, short caption hits, no filler.

Visuals

Black background, white UI cards, monospace terminal text, green checkmarks, blue live links, subtle Vercel triangle glow, close camera moves on real workflow states.

Emotion

Calm technical authority: the product feels inevitable, not loud.

Proof moment

The preview URL appears, then the deployment status becomes Ready in production.

Create a 20-second cinematic developer launch video for Vercel aimed at frontend teams shipping Next.js apps. Format 16:9, dark mode, premium monochrome, crisp UI, no stock footage, no mascots, no futuristic holograms. Use real product concepts only: Vercel dashboard, Vercel CLI, Next.js framework detection, deployment logs, preview URLs, production domain. Do not reference Cursor or copy Cursor’s copy.

0.0–3.0s — Black screen. A soft white glow reveals the Vercel triangle centered, like a quiet loading state. Camera slowly pushes in. A terminal card slides up from the bottom with monospace text: “acme-store / main”. Caption top-left: “Your Next.js app should deploy itself.”

3.0–7.0s — Cut to a dark browser UI representing Vercel’s new project import flow. Show a left column with “Import Git Repository”, repo selected: “acme/acme-store”. Main panel shows detected settings: “Framework Preset: Next.js”, “Build Command: next build”, “Output Directory: .next”, “Environment Variables: optional”. A white “Deploy” button is clicked. Caption: “Connect the repo.” Camera: tight 35mm UI push, fast but readable.

7.0–11.0s — Smash cut to terminal and deployment log. Use exact-style CLI output inspired by Vercel’s site: “▲ vercel deploy”, “✓ Detected Next.js”, “✓ Building”, “✓ Optimizing”, “✓ Deployed”. Then show a blue link: “Preview: https://acme-store-git-main.vercel.app”. Caption: “Vercel detects Next.js.” Add small green checkmarks as each line completes. No fake benchmark numbers.

11.0–15.5s — Cut to a pull request screen in dark mode. PR title: “feat: checkout redesign”. Status checks show “Vercel — Ready”. A preview card displays “Preview URL” with a blue link and a small browser thumbnail of a checkout page. Cursor clicks “Copy link”, then the preview opens in a browser tab. Caption: “Every push gets a preview URL.” Camera pans horizontally from PR status to live preview.

15.5–20.0s — Final split-screen. Left: Vercel deployment detail page with status pill “Ready”, branch “main”, domain “acme-store.vercel.app”, environment “Production”. Right: the live Next.js commerce homepage loads on desktop and mobile frames. Under the Vercel triangle lockup, show final caption: “Ship when the URL is ready.” End card CTA: “Deploy on Vercel” and small secondary text “Sign up free”. Tone: fast, technical, confident, minimal, developer-native.

Tool routing: Shot 1: After Effects + Figma for the Vercel triangle glow and precise terminal typography; this needs brand-accurate motion, not generative guesswork. Shot 2: Screen Studio or Tella for clean browser-style UI capture animation, with Figma recreating the import screen so the Next.js detection fields stay legible. Shot 3: Screen Studio + After Effects for terminal/log timing, status pills, and rapid deploy progress without hallucinated UI. Shot 4: Runway Gen-3 or Veo only for subtle camera parallax over a designed PR/preview composition; use Figma-rendered UI plates to preserve product accuracy. Shot 5: After Effects for final split-screen dashboard, production URL, checkmarks, and CTA lockup; this should be rendered as motion design for crisp developer credibility.

Frontend teams shouldn’t need an infra project to ship a Next.js app. Connect the repo. Vercel detects Next.js. Every push gets a preview URL. Production is one merge away. If you’re evaluating hosting, start with the path from commit to live URL. Deploy on Vercel.