Product demo video
A complete pipeline for the kind of 30 to 50 second product video that does well on X and in a README: real footage of
the product, edited like a motion-design piece, with sound on every action. Everything in assets/ is the code that
made the web-skills demo. Copy it and change
the config; don’t rewrite it. It already handles the frame-timing, resolution and audio-sync problems that hand-rolled
versions hit.
What it makes
A 1920×1080, 30 fps MP4 with stereo audio at -14 LUFS (the level X, YouTube and Instagram normalise to):
| Part | Length | What happens | Sound |
|---|---|---|---|
| Intro | 2 bars | The tagline lands word by word on the beat; the key word turns the accent colour and gets an underline swipe; the block zooms through the screen | A tuned button blip per word, climbing the scale; a soft select tone on the underline; a whoosh into the first scene |
| Scenes | 2 to 4 bars each | A browser window tilts up into place; the recording plays inside it while a camera follows the cursor and pushes in on each click; a kicker, a headline that lands word by word and a one-line sub sit above; the window slides out left with a blur | A soft tap on every click; optional extras per scene (a long whoosh for a fly-through, a drop when a drag springs back); a right-to-left whoosh that peaks on each cut |
| Outro | 3 bars | A flash; the call to action types itself into a terminal card; feature chips drop in one by one; the link lands as a pill; a footnote fades up | A reverse riser into a cinematic sub drop on the downbeat, keyboard clicks, rising bells, a bell for the link |
Music runs under all of it: a light house groove at 110 bpm in A minor, quiet for the first two bars, with pads and bass that dip under each kick.
9 more sections
- Requirements
- Pipeline
- Principles
- Sounds
- Adapting it to a product
- Recording gotchas
- Not for
- Files
- Credits
Create a free Pagenue account to read the whole skill, download it, and install it.
Sign in free to read the rest