Pagenue v0.6.2
skills/saas-launch-video/SKILL.md8 sectionsProProprietary

SaaS launch video

The agent loads it when

Makes a premium 30-second SaaS launch video built entirely in code: a five-scene story (hook, problem, product, payoff, logo + CTA) animated in Remotion at 1920×1080 and 60 fps, with crisp vector UI instead of screenshots, overshoot entrances, cursors that move on arcs and hesitate like a hand, eased camera push-ins and pull-backs, directional motion blur on whips, a count-up/count-down counter with a glow, staggered cards with a checkmark cascade, a music bed and light click sounds (no voiceover), plus 9:16 and 1:1 cutdowns. Ships the brief and storyboard templates, the motion rules, a pre-render checklist of the fixes first renders always need, a working Remotion project and a stills-QA script. Use this whenever someone wants a SaaS or product launch video, Product Hunt video, website hero video, promo or teaser for X, LinkedIn or paid social, an animated product explainer made from UI, or a launch video for a client, even if they don't name the skill.

npx @codesudee/web-skills -s saas-launch-video
Download .zip

Try it

The film

Pagenue's launch film, made with this skill

30 seconds at 60 fps, built entirely in code: no screen recording, no screenshots. Switch sizes without losing your place.

Jump to a fix or polish

SaaS launch video

A 30-second launch film made only from code: no screen recording, no stock footage, no screenshots. The product’s UI is rebuilt as vector components, so the camera can push in to 130% and every edge stays razor sharp. Everything in assets/remotion is a finished, working film (the example is Pagenue’s own launch film). Copy it, change src/config.ts and the UI components for the new product, and keep the motion system as it is.

Every frame is computed from its frame number alone: no timers, no CSS transitions or animations, nothing that runs in real time. That’s what makes renders frame-exact and repeatable.

  • With a terminal (Claude Code and similar): copy the project, build the scenes, render stills, then render the videos.
  • Without a terminal (a chat): write out the full Remotion project file by file, based on assets/remotion, then give the exact install and render commands to run locally.

What it makes

  • launch-16x9.mp4: 1920 × 1080, 60 fps, 30 s (1800 frames), H.264, music bed plus light UI sounds, no voiceover.
  • launch-9x16.mp4 and launch-1x1.mp4: the same film re-laid out for vertical and square, not just cropped.
# Scene Time What happens Camera
1 Hook 0:00–0:04 The pain in one image: to-do cards drop in with overshoot and pile up, a counter climbs 0 → 48 with a growing red glow, a headline lands word by word Slow push-in 100% → 106%
2 Problem 0:04–0:11 Today’s workaround: three windows (docs snippets, an agent chat, a feedback inbox); the cursor copies a snippet, carries it on an arc, pastes, hesitates, checks the inbox, then copies and pastes the next one. “Copy. Paste. Repeat.” lands on those actions Eased pan following the cursor
3 Product 0:11–0:19 The key feature in the real UI: the prompt is typed, Run is pressed, four skill cards land one by one and pulse as they start, fixes fly into them Push into the prompt bar (~130%), ease back for the cards
4 Payoff 0:19–0:25 The result: checkmarks cascade, the counter drops to 0 and turns green, “Zero fixes left.” holds for 3+ s Pull back to reveal the whole board, clear
5 Logo + CTA 0:25–0:30 The board scales away, the logo builds, the tagline follows a beat later, the CTA pill pops Gentle push-in and drift to the last frame

7 more sections

  • Requirements
  • Workflow
  • Revisions
  • Sound
  • Not for
  • Files
  • Credits

This is a Pro skill. Pro is $9.50, paid once, and unlocks every Pro skill to read, download, and install, including new ones.

Get Pro