Bonsai 🌳

Claude Opus 5.5 is the motion designer who changes exactly one thing when you ask Anyone who has worked with a motion designer knows the dance: you ask for a slightly bigger logo, and the next version comes back with a bigger logo, a shifted soundtrack and colors that somehow feel different AI video generators are even worse, because every request rolls the dice on the whole clip again With Claude + Remotion it works differently, because the video isn't a file you regenerate, it's a React component where every element hangs on its own string Here's how it works: > every element on screen, from the headline to the button to the logo, is its own component with its own props, so Claude can reach exactly one of them without touching the rest > timing, color, size and position live in named values, which turns "make the logo bigger" into a one-line change instead of a brand new render > you can describe those values as a schema, and Remotion Studio turns them into sliders and inputs you can tweak yourself without opening the code > the same composition renders with different props straight from the command line, so one video becomes ten variants with a different headline or color each > everything you didn't mention stays exactly where it was, because nothing in the code was asked to move You can use it for launch videos that go through five rounds of feedback, product demos that need a fresh version every release, ads you want to test with different headlines, and client work where "just one small change" finally stays small The prompt that does most of the work: "Change only the headline color. Leave everything else untouched" save this, then read the full guide 👇🏽

I asked Claude Opus 5.5 to make a video of itself working, and it turned out to be the coolest thing I've made this week Here's the part most people don't know: Claude Code quietly saves every session as a JSONL file in ~/.claude/projects. Every file it read, every edit it made and every command it ran is in there, with a timestamp So that log is basically a script for a movie, and all you have to do is hand it to Claude and Remotion How it works: > Claude parses the session log into a timeline of what ran, which files were touched and how long each step took > every file becomes a node on screen, and each Read or Edit lights up the line to it > the real commands from the session scroll by in a terminal strip at the bottom > Remotion renders that timeline as code, so the same log always gives you the same clip You can use it as a client demo that shows the work instead of describing it, a clip attached to a pull request, or a weekly reel of everything your agent did while you were away The prompt is basically one line: "Read my latest session in ~/.claude/projects, turn it into a timeline JSON and build a 25-second Remotion video from it" save this, then read the full guide to controllable Claude + Remotion videos ↓

I gave Claude Opus 5.5 one line of chess notation, and it gave me back a movie The line was the full score of game 6 between Deep Blue and Garry Kasparov from May 1997, the 19-move game that made a machine the first to beat a reigning world champion in a match. It's plain text that looks like "1.e4 c6 2.d4 d5…", and that's exactly why this works: to Claude Code it isn't a chess game, it's data, and in Remotion data can become video Here's how the text turns into a film: > Claude parses the PGN into all 37 half-moves and turns each one into its own short scene with a fixed start and length > every piece is a real 3D model on a wooden board rendered with @remotion/three, so the camera, the light and the depth of field are all just code > quiet moves pass quickly, while captures and checks get a slower beat and a closer camera angle > the famous knight sacrifice on move 8 gets a full slow-motion moment, because that's the move that cracked Kasparov's defence open > the final position holds long enough to read, and the whole thing renders to MP4 straight from the terminal The part I love is what comes after. Once you see that a game score is just a timeline, you start noticing how many other things are too: a match play-by-play, a deploy log, a git history, anything that records events in order can be handed to Claude and turned into something people actually want to watch The method that keeps this kind of video controllable instead of random ↓

Claude + Remotion can turn one spreadsheet into 500 personalized videos This sounds like something you'd pay an agency for, but it's really a weekend project A Remotion video is just a React component, so it can take data the same way a web page does Instead of one launch clip you get a template that renders a different video for every row in your CSV: the customer's name, their company, their plan, even their brand color Here's how the pipeline works: > Claude builds the template once, using the same rules as any controllable video: one action, a clean opening, a result that stays on screen long enough to read, and everything driven by useCurrentFrame() > every field you want to personalize becomes a prop, so name, company, plan and accent color are typed inputs instead of hard-coded text > a short script reads the spreadsheet and passes each row as inputProps to Remotion's renderMedia(), one MP4 per customer > before the big batch you check a few rows as stills (the longest name, the shortest one, the darkest color), because that's where layouts break > when you change the template, every video changes with it, so a fix or a rebrand is one edit and one re-render instead of 500 You can use it for onboarding welcome videos, "your year in review" recaps, sales outreach with the prospect's own company in the clip, or release notes for each pricing tier All of it depends on the template being rock solid, and that's exactly what my guide below covers Save this and read it ⤵️

Claude Opus 5.5 can turn a single screenshot of your app into a launch video No screen recording, no After Effects, no motion designer. You drop one PNG of your app into Claude Code, and it rebuilds that screen as real React components inside Remotion, then animates the one action that actually sells your product Here's what that loop looks like: > Claude reads the screenshot and splits it into components: the sidebar, the cards, the chart and the one button that matters > every piece becomes code, so the "video" is just your UI driven by useCurrentFrame(), with spring() and interpolate() doing the motion > you pick a single action (one click, one before, one after) and keep the whole thing around 15–25 seconds, because three features in 20 seconds turns into a slideshow > before anything moves, Claude renders three stills (the opening, the click and the result), so layout and readability problems get caught early > one render command gives you the MP4, and since it's all code, the same scene can be laid out again for 16:9, 1:1 and 9:16 The best part is that you're editing code, not pixels. Want the button bigger or the chart in another color? You say exactly what to change and what must stay the same, and Claude touches just that instead of rebuilding the whole video Install the official Remotion skills once (npx skills add remotion-dev/skills) and Claude already knows the patterns that don't fall apart the moment you start revising Save this, and the full workflow is in my guide below ↓

Same Claude Opus 5.5. Same product. The only difference is the first domino Most people open Claude Code, type "make a cool 20-second video for my app" and then wonder why the timing feels random and every small fix breaks half the clip Claude isn't bad at animation, it's just guessing, because nobody told it when anything is supposed to happen What fixed it for me was writing a short brief before any code gets written, so every moment of the video is decided upfront, the same way you line up dominoes before you push the first one: > Structure: how many scenes there are and what happens in each, for example the interface comes in, one click happens, the result holds on screen, then the logo > Key moments: when the button appears, when the click lands, and from what point the result has to be readable > Constraints: style and colors, spring() for entrances, no CSS animations, every value driven by useCurrentFrame() > What stays locked: everything Claude must leave alone when you ask for changes later > And before watching any motion, ask for three stills (the opening, the click, the final frame), because layout problems show up there instantly Revisions work the same way. Instead of "make it smoother", you tell Claude where the problem is, what exactly is wrong, what to change and what has to stay the same, and it fixes that one thing instead of quietly rebuilding the whole video One action per video, one clear brief and a couple of targeted revisions, and by your second or third video the difference is obvious The full workflow and the example brief in article ⤵️

Claude Code + Remotion is the After Effects replacement almost nobody has set up yet, and the whole setup is 4 commands This video was made exactly that way: Opus 5.5 wrote every frame of it as React code in Remotion, with no timeline, keyframes or editing app involved Here's everything you need to get the same stack running: > npx create-video@latest --yes --blank my-video creates a blank Remotion project, React and TypeScript included > cd my-video && npm install pulls in everything Remotion needs to render, FFmpeg included > npx skills add remotion-dev/skills is the step most people skip, and it's the one that matters most: the official skills teach Claude useCurrentFrame(), interpolate(), spring() and <Sequence>, so the code doesn't fall apart on your first revision > npm run dev opens Remotion Studio in your browser, where Claude writes the code and you watch every change live All you need beforehand is Node.js LTS and Claude Code From there it's one clear brief, a few stills to check the layout, a couple of targeted revisions and a single render command for the final MP4 The full workflow, from the first brief to the final render, is in my guide. Save this and read it 👇🏽

Claude Opus 5.5 can run a tiny animation factory for you, and almost nobody sets it up Every time you prompt "make a cool 20-second video", Claude has to guess the timing, the pacing and what's allowed to change, so you get something close-ish and every revision breaks half of it But once you treat video as code, where every frame is just a function of time, you can set Claude Code up once as a small production line and then simply feed it orders Here's what that line looks like: > The rulebook: a CLAUDE. md with house rules Claude reads every time, so time only comes from useCurrentFrame(), motion from spring() and interpolate(), scenes live in <Sequence>, and CSS animations, Date. now and setTimeout are banned > The order form: a brief template with one action, one before and one after, 15–25 seconds at 30 fps, the key moments, and a list of what must never change > The machine: one Remotion composition with props, so the product name, colors, copy and screenshot swap in while the motion stays exactly the same > The QC desk: before anything moves, Claude renders 3 stills (the opening, the action and the final frame), so layout and readability bugs get caught early > The repair shop: revisions only come in as "where, what's wrong, what to change, what stays", so one fix never rewrites the whole video > Shipping: one render command per order, and the same props in always give you the same video out The official Remotion skills (npx skills add remotion-dev/skills) work like the factory's training manual, teaching Claude the patterns that don't fall apart the moment you start editing Set it up once, and every new launch, feature or update becomes an order you hand to the line instead of another lottery ticket The full method behind every station is in my guide, save this and read it 👇🏽

I told Claude what was wrong with my video and it fixed exactly that without touching anything else Every time I asked AI to tweak one thing in a video, it rebuilt half of it and broke the parts I already liked, so I started treating the video like a draft I can leave notes on, the way a director marks up a cut > I circle the button and write "entrance too abrupt", and that button is the only thing in the whole clip that moves differently afterwards > the headline gets cut off, so I mark it, and the text reflows while the logo, the colors and the timing stay exactly where they were > I ask it to hold the result a bit longer, and only that one scene stretches while everything before it stays put > the only note that never works is the lazy one, because "make it pop" gives Claude nothing to aim at, and that turned out to be the whole lesson The reason it works is that nothing in the clip is improvised: every element is placed by time instead of by luck, every note says what to change and what to leave alone, and Claude shows me still frames before it renders anything Opus 5.5 writes the Remotion code, and I just leave notes The exact workflow I use, step by step 👇