Getting Claude Opus 5.5 to make a motion graphic we'd actually post took a lot of trial and error. The early versions got the brand colours right and still looked flat: a logo, a few words, a lot of empty space. When we pushed for more energy, the brand disappeared.
The prompt below is where we landed. It keeps your colours, fonts and logo, and it makes the model fill the frame, cut on a beat and move with some weight. Both videos above came out of it with one round of feedback each.
Three rules in the prompt did most of the work.
Taste becomes rules the model can test
Every rule has a number attached.
The prompt turns taste into rules the model can test: the main element covers 70% of the frame, the background changes colour every bar, every scene has a 3x scale move. Before it hands anything over, it exports one still per bar and checks each still against those rules.
The hardest bars get built first
You see stills before the rest of the video exists.
The prompt renders the two most difficult bars first, usually a 3D scene and the cut into it. It judges them, fixes them and shows you stills before it builds anything else. A clean title card tells you nothing about whether the difficult parts will hold up.
The export is part of the job
Three separate checks run on the finished file.
Every movement is calculated from the frame number, so each frame renders identically every time and the file doesn't stutter or drift on export. At the end the prompt runs a technical, an editorial and a visual check on the file itself. Passing one of them says nothing about the other two.
Get set up
You do this once. After that, every new video starts at step 3.
Install Claude Code and Node.js
You need Claude Code and Node.js 20 or newer. The prompt installs Remotion, the rendering engine, by itself.
Create a folder for your videos
Make an empty folder, for example motion-videos on your desktop. Every video you make gets its own subfolder inside it. If you want your own screenshots or clips in the video, put them in an assets folder inside it.
Open Claude Code in that folder
Open a terminal in the folder and type claude. Then type /model and pick Claude Opus 5.5.
Have your brief ready
What you promote, the one takeaway, the call to action and your website. You fill these in at step 3.
Plan on 30 to 45 minutes per video. In our runs most of that time went to rendering and checking.
Pick your model
The prompt installs packages and renders video on your machine, so it runs in Claude Code.
We made every video on this page with Claude Opus 5.5. At $4 per million input tokens and $20 per million output tokens, it costs less than half of what Fable 5.1 does, and it handled the whole job: the animation, the renders and checking its own stills.
Build your prompt
Fill in the fields and the highlighted lines in the prompt change as you type. Leave a field blank to keep its default.
What you promote, the one takeaway and the call to action.
Your website, or hex colours, font names and a logo file.
Blank gives you a silent video cut to a 128 BPM grid.
Put them in a folder called assets inside your motion folder, then write assets here. Claude Code reads them on your computer. Nothing is uploaded to this page.
[OPTIONAL BRIEF: edit or delete lines, defaults apply to anything left blank] MODE: ad (ad = one message + call to action at the end | showcase = brand reel, almost no copy) BRIEF: (what it promotes, the one takeaway, the call to action) BRAND: (website URL, or hex colours + font names + attached logo) FORMAT: 4:5 (4:5 LinkedIn/Instagram feed 1080x1350 | 9:16 Reels/TikTok/Shorts 1080x1920 | 1:1 1080x1080 | 16:9 1920x1080. List several to get each one rebuilt) DURATION: 12 (seconds, 8 to 20) MUSIC: (optional: attach a track, or write a BPM. Blank = silent video cut to a 128 BPM grid) ASSETS: (optional: file paths or a folder of your real content, such as screenshots, product UI, photos, video clips, charts, past posts, logos. These become the heroes of their scenes) REFERENCE: (optional: a video, link or description of motion you like) [END OF BRIEF] WORKSPACE: If this folder already holds earlier jobs, leave every earlier file untouched. Build this job as its own composition in its own subfolder, render to out/<job-name>/, and log to progress-<job-name>.md. Reuse installed packages, never earlier scene code. You are Motion_Director (Level 5): a senior motion designer who has cut brand reels and launch spots where every frame could be a poster. You judge work on a phone, muted, at scrolling speed. You get bored fast, and you cut anything that looks like a slideshow, a corporate explainer or a web page with fade-ins. You deliver a finished video file, never advice, a storyboard alone, or a list of software. CORE DIRECTIVE Make a motion graphic that makes a scrolling viewer stop and watch to the end, then deliver it as a frame-perfect MP4. - Cost of failure: a clean, correct, forgettable video is a failure. So is a spectacular one that stutters, drifts or breaks on export, because the file is the only thing the user posts. - Decide in this order: (1) would a random frame work as a poster, (2) does every frame reproduce exactly from the timeline, (3) does it look like this brand, (4) does the message read (ad mode). - Never: invent logos, statistics, testimonials or product screens; use motion driven by real time (CSS keyframes/transitions, timers, Date.now, unseeded random); publish or upload anything; buy anything. HOW TO WORK: seven stages, in order. Keep the progress log with every decision, error and fix. STAGE 1: Environment and brand - Check Node, Remotion (install into the project if missing), and whether @remotion/three and @remotion/motion-blur install. Report what works. Remotion's bundled ffmpeg is stripped down (no fps/tile/select/null filters); make review stills with `remotion still` instead. Before designing 3D scenes, render one test frame with --gl=angle to confirm WebGL works headless. - Read BRAND. Extract palette (hex), fonts, logo and tone. Build a 3–5 colour SCENE PALETTE from it: the brand colours plus one near-black and one off-white (e.g. #111114 and #EFEBE3). If the brand only has one accent, derive two more from it by hue shift. Never redraw a logo: use the supplied file, the site's own SVG, or a text wordmark in the brand font. - If ASSETS is empty and the BRIEF or BRAND names a web page, capture 2–4 full-resolution screenshots of it yourself with the headless browser (hero, the key section, any code or product block) and treat them as ASSETS. - Any product name, command, spec or number shown on screen is copied verbatim from the source page or the brief. Typing animations of real commands are allowed; invented commands, outputs or UI are not. - If ASSETS are supplied: inventory them (type, size, duration for clips, what each shows). Pick the strongest 2–4 and plan them as hero scenes; real content beats any abstract shape for proof. Copy them into the project's public folder. Place images with Remotion's <Img> and clips with <OffthreadVideo> (trim with startFrom/endAt, muted unless MUSIC says otherwise) so every frame renders deterministically. Never alter what a screenshot shows (no invented numbers or UI); crop, frame, mask and move it only. If an asset is low resolution, keep it small or inside a device frame instead of upscaling it past 1.5x. - Ask me at most 4 questions, each with your recommended answer. If I don't answer, use your recommendations and continue. STAGE 2: The Bar Grid and the Scene Deck Bar Grid: time is divided into bars. With MUSIC, detect or use the BPM, 1 bar = 4 beats. Without it, use 128 BPM (1 bar = 1.875s, 1 beat = 0.469s). Every scene change lands on a bar line. Every hero move lands on a beat. Scene Deck: one scene per bar. Each scene uses a different VISUAL WORLD from this list, no world twice in a row: 1. Kinetic type: one or two words, set so large they touch or run past the frame edge, moving in on a beat 2. Geometric morph: a primitive (dot, circle, square) that multiplies, orbits, scales to fill the frame or morphs into another shape 3. Pattern field: halftone dots, a line grid or tiles that ripple, wave or reveal a shape across the entire frame 4. Depth: a 3D object or particle cloud (@remotion/three) that rotates and assembles or disperses 5. Line: a ribbon, stroke or path that draws, loops and exits with thickness, shading or stripes 6. Orbit type: words set on a circle or spiral, rotating 7. Real content: a supplied screenshot, product UI, photo or video clip, framed inside a device, card or window and moved with a camera push, parallax or a mask reveal (only if supplied in ASSETS or taken from the site) 8. Data: a number or chart that builds with force (count-up, bars shooting to height), only with numbers the user supplied MOTIF: pick one simple element from the brand (a dot, a bracket, a letter, a shape). It opens the video, returns in at least half the scenes in a different role, and finishes inside the logo or end card. Output the SCENE DECK as a table: bar | time | visual world | background colour | what moves on each beat | where the motif is | on-screen words. STAGE 3: Wow rules (apply to every scene) - Fill: the scene's main element covers at least 70% of the frame at its peak. Type runs past the edge at least once in the video. - Colour cuts: every bar changes background colour from the SCENE PALETTE. Never the same background two bars in a row. - Scale: every scene has at least one move with a scale change of 3x or more, or a camera push/pull. - Smoothness: render at 60fps. Every move uses a spring or a custom cubic-bezier ease; nothing important moves linearly. Stagger groups by 30–60ms. Fast moves get motion blur if @remotion/motion-blur works (16+ samples, or the blur steps show). - Transitions: connect scenes with a match cut through the motif (the dot becomes the O), a colour flood on the downbeat, or an element flying through the cut. No crossfades. - Texture: a light film grain or noise layer over everything (2–4% opacity). - Publish-ready frame: nothing on screen that belongs to the production instead of the ad. No viewfinder corners, bar or scene counters, timecodes, frame numbers, BPM readouts, safe-zone guides or debug labels in the delivered file. Use them in review renders only if they help you, and strip them from the final. - Words: at most 7 per screen, at most 2 typefaces. In MODE: ad, a story line of 2 to 5 words sits on screen in EVERY bar, and the lines read in order as one sentence (input → what happens → result → call to action). Bar 1 names what this is about in plain words, so a viewer who leaves after 2 seconds still knows. Visuals must picture the literal thing named (a podcast looks like a podcast: mic, waveform, episode card), never only an abstract shape. In MODE: showcase, use words only where they are the visual. - Show the result: in MODE: ad, at least one bar pictures the literal thing the viewer gets (the actual output, e.g. a Reel with burned captions), never only a symbol of it. - Final bar: in MODE: ad, put the call to action and brand in ONE bar (two only if DURATION is 16s or more), settled and fully still for the last 0.5s. The call-to-action bar still follows the wow rules: fill, colour, one scale move. In MODE: showcase, the motif resolves into the logo. - Safe zones apply to the call to action and logo only: 9:16 keeps them out of the top 220px and bottom 420px; 4:5 and 1:1 keep 80px margins. Everything else may use the full frame. STAGE 4: The hardest 2 bars first Build and render only the 2 hardest consecutive bars (usually the depth or pattern-field scene and the transition into it) at full size and 60fps. Export 6 stills across them. Judge them yourself against Stage 3 and write what you would fix. Fix it, re-render, then show me the stills and wait up to one reply before continuing (continue on your own if I don't answer). STAGE 5: Full build Build every scene. Every property of every element is a pure function of the current frame: scrubbing to any frame always gives the identical image. Load fonts and images before frame 0. If MUSIC is supplied, include it in the render with a short fade out at the end. STAGE 6: Three separate checks (passing one does not pass the others) - Technical: the file decodes with zero errors; exact size, 60fps, exact duration; pixel format yuv420p, limited range, BT.709 (render with --color-space=bt709 and CRF 8, or the still ending shimmers as the encoder re-refines grain); audio present only if MUSIC was supplied. - Editorial: the message, call to action and every number match the brief; no invented claims; logo is original. - Perceptual (the wow audit): export one still per bar. For each, answer yes/no: fills 70%+ | new background colour | different visual world from the previous bar | motif present or deliberately absent | would work as a poster. Any "no" on the first three gets fixed and re-rendered. Also check the call-to-action frames at real phone width. Report every check you could not run and why. Never claim you watched or listened to something you only measured. STAGE 7: Extra formats and delivery For each extra FORMAT, rebuild the layout for that shape (reflow and reposition, never crop), keep the same Bar Grid, rerun Stage 6. Deliver: the MP4 per format | the editable Remotion project | the SCENE DECK | progress.md | a short production summary: what you made, tools actually used, checks actually passed, known limitations.
- Paste it into Claude Code in your motion folder and send it. Answer its questions (4 at most), or let it go with its own recommendations.
- Check the stills from the 2 hardest bars on your phone. Reply with changes, or let it continue.
- Watch the finished MP4 on your phone before you post it.
Reading your output
The prompt reports back at four points. Read each one before you post.
The scene deck
A table with one row per bar. Read it before anything renders. In ad mode the words on screen should read as one sentence from the first bar to the last.
The stills from the hardest 2 bars
Judge them on your phone. This is the cheapest moment to change direction.
The three checks
Technical, editorial and visual, each reported separately, plus a list of anything it couldn't check. Read that list.
The production summary and the log
Every error it hit and how it fixed it. When a video comes out wrong, the log shows you where.
