
A product video
A product video, a service explainer or a launch video in motion graphics that looks professional, made by Claude in code and rendered to MP4.
Start here: pick a reference film
- Open What Ships: about 2,200 launch films. Choose one or two whose pace, type and transitions you want, and give Claude the link.
- For single effects, open Charlie Hills' motion board (25 September 2026): 16 animations made with Opus 5.5 in Claude Code, such as a button that opens into a video player, a bar chart that morphs into a line, or a headline that fills with artwork. Each comes with a short copy-and-paste prompt. The editable HTML board, the prompts and a PDF guide are free, but you need to subscribe with your email.
Read from Rexan Wong's thread of 26 September 2026 on how the good "made with Opus" videos were really made. The idea: everyone has the same model, and what you give it decides the result. Without that, Claude falls back on its default look: centred text, a gradient background, everything fading in.
Six steps
- Pick a reference film. Choose one or two whose style you want on What Ships and tell Claude to match them. Naming a film works better than describing a style.
- Give Claude a video engine. Remotion, which we already have, or HyperFrames. Every scene is code, rendered straight to MP4, and a change edits one line instead of starting over.
- Use real interface parts. When the film shows a product screen, take ready-made components from 21st instead of letting Claude invent fake-looking buttons. For an eR service, use real screenshots of the service instead.
- Give it everything, then ask for three storyboards. Logo, colours, fonts, screenshots of the real product, the reference film and a short brain dump of how you see it. Three variants means you pick a direction instead of fixing its first idea.
- One still frame per scene before anything moves. Fixing a still takes seconds; fixing a render means rendering again.
- Give notes like a director, in camera words. "Slow every zoom to 0.7x", "hard cut here", "push in on the button". "Make it better" gets random changes.
The same lesson, twice
- Both sources say it: one prompt is not enough. What works is naming the exact states (start, end, what moves), giving a reference, and then a few rounds of fixes.
What it adds to what we have
- The engine and the render we already have: Remotion, installed, used by the family video.
- New: the reference film, the three storyboards and the still frame per scene. These are the steps worth adding to any film recipe, the family video included (a contact sheet of stills before the first render).
- What does not apply: 21st only matters when a film shows an app screen, and only in React.