Big Idea

The argument in one line.

AI can already write the code for broadcast-quality motion graphics in Remotion, but the difference between a professional result and an amateur one isn't a better prompt — it's a written taste engine, a CLAUDE.md rules file that teaches the model what separates broadcast motion from amateur motion.

Who This Is For

Read if. Skip if.

READ IF YOU ARE…

You make explainer or YouTube videos and want animated titles, callouts, or motion graphics without learning After Effects.
You already use Claude Code or a similar coding agent and want to point it at a new, visual-output use case.
You're comfortable running npm commands in a terminal and want a code-first alternative to a timeline-based animation tool.
You want a reusable, editable animation asset (colors, text, timing) rather than a one-off rendered video.

SKIP IF…

You want a no-code, drag-and-drop motion graphics tool — this requires running a local dev environment and editing files.
You're looking for a full After Effects replacement for complex 3D or particle work — this is React-based 2D motion design.

TL;DR

The full version, fast.

The creator shows how to generate motion graphics with Remotion, a React framework that builds video with code, driven by Claude Code instead of a timeline editor. After a one-minute setup (npx create-video, npm install, npm run dev), simply prompting Claude to animate something produces a rough, choppy result. The actual fix is a one-page CLAUDE.md file dropped into the project that encodes rules distinguishing broadcast-quality motion from amateur motion — with it, the same prompt produces smoother, more polished animation with usable color and text controls. The project also supports rendering with a transparent background (ProRes 4444, PNG, Yuva444P10LE encoding) for compositing into other footage. The creator shares both the CLAUDE.md rules file and the exact prompt used, linked in the description.

Free for members

Chat with this breakdown — free.

Sign in and you get 23 free chat messages on us — ask for the hook, quote a framework, find the exact transcript moment, generate a markdown action plan. Bring your own key when you want unlimited.

Create a free account →

Chapters

Where the time goes.

00:00 – 00:29

01 · Cold open: one-prompt motion graphics

Creator states the promise: everything shown was made with one prompt to Claude Code and Fable 5, no After Effects or manual keyframing.

00:29 – 01:49

02 · What is Remotion?

Introduces Remotion as a framework for making video programmatically with an exposed API, and shows the community showcase of projects built with it.

01:49 – 02:54

03 · Setup: new Remotion project

Creates a fresh Remotion project from scratch in VS Code using npx create-video@latest, names it claude-remotion.

02:54 – 03:29

04 · Remotion Studio first look

Runs npm install then npm run dev to launch Remotion Studio locally in the browser, showing the default preview/editor UI.

03:29 – 04:08

05 · Prompting Claude Code to animate

Explains that prompting Claude directly works but produces amateur, choppy results without extra guidance — the part most tutorials skip.

04:08 – 04:40

06 · The fix: a CLAUDE.md taste engine

Introduces the one-page CLAUDE.md instructions file with rules that separate broadcast motion from amateur motion.

04:40 – 05:07

07 · Before vs after

Side-by-side comparison of the same prompt with and without the rules file — the unguided version is choppier with worse gradients and stacked objects.

05:07 – 06:09

08 · Full result: editable text and colors

Shows the finished animation in Remotion Studio, demonstrating live text and color edits enabled by the inspector setup from the rules file.

06:09 – 07:04

09 · Rendering + transparent background export

Walks through the render panel: choosing quality, output name, and the ProRes/PNG/Yuva444P10LE combination needed for a transparent-background export.

07:04 – 08:03

10 · Free rules file + prompt, wrap-up

Recaps the two tools (Remotion + Claude/Fable 5), points to the CLAUDE.md file and exact prompt in the description, and asks viewers to engage.

Atomic Insights

Lines worth screenshotting.

The fix for amateur-looking AI motion graphics isn't a better prompt — it's a written rules file that tells the model what separates broadcast motion from amateur motion.
Remotion lets you build video with React code and an exposed API, rather than a traditional drag-and-drop timeline.
A default Remotion + Claude Code setup can already turn a plain-English description into a working animation with zero manual keyframing.
Without a rules file, identical prompts produce choppier, more stacked-up, less polished gradients and object motion.
A one-page instructions file acts as a 'taste engine' — it's a portable, reusable asset separate from any single prompt.
The same instructions file also unlocks an on-the-fly inspector panel for tweaking text and colors, which the stock installation doesn't provide by default.
Transparent-background exports require three specific render settings together: ProRes format, PNG image type, and Yuva444P10LE encoding.
A full local Remotion + Claude Code setup takes about one minute: npx create-video@latest, npm install, npm run dev.

Takeaway

A written rules file beats a better prompt for AI output quality.

WHAT TO LEARN

When AI-generated output has a quality problem rather than a correctness problem, the fix is usually a standing rules file that encodes taste, not a smarter one-off prompt.

02What is Remotion?

Remotion makes video a coding problem — components and an API — which is exactly what makes it usable by a coding AI instead of a timeline-based tool.

03Setup: new Remotion project

A full local project setup is three commands and about a minute: create the project, install dependencies, start the dev server.

04Remotion Studio first look

The stock local editor already previews, adjusts exposed settings, and renders — before any AI or custom instructions are involved.

05Prompting Claude Code to animate

Prompting a coding AI directly to 'make an intro' works, but produces an okay, unpolished result — the gap most tutorials skip past.

06The fix: a CLAUDE.md taste engine

The fix for weak AI output quality is a written rules file, not a better single prompt.
The rules file specifically encodes the difference between broadcast-quality and amateur motion design.

07Before vs after

The same exact prompt, with and without the rules file, produces visibly different results: choppier objects and flatter gradients without it.

08Full result: editable text and colors

The rules file's benefit isn't only visual — it also set up an inspector panel for live text/color edits that the base install doesn't include.

09Rendering + transparent background export

A transparent-background render needs three settings aligned together: ProRes format, PNG image type, and Yuva444P10LE encoding.
The AI also has to be told explicitly to build the animation with a transparent background in the first place — it's not automatic.

Glossary

Terms worth knowing.

Remotion: A React-based framework for building videos with code instead of a timeline editor — you write components and it renders them as video, with a full API for animation, composition, and rendering.
CLAUDE.md: A markdown file placed in a project's root that Claude Code reads automatically, giving it persistent project-specific rules, conventions, or standards to follow.
Taste engine: An informal term used in this video for a CLAUDE.md rules file that encodes aesthetic judgment — specific rules that tell an AI model what separates professional-looking motion design from an amateur first draft.
Remotion Studio: The local, browser-based editor that ships with a Remotion project (started via npm run dev), used to preview compositions, adjust exposed settings, and trigger renders.
ProRes 4444 / Yuva444P10LE: A high-quality video codec and pixel-encoding combination that preserves an alpha (transparency) channel, used here to export a motion graphic with a transparent background for compositing over other footage.

Resources

Things they pointed at.

01:51toolRemotion ↗

00:00toolClaude Code / Fable 5

07:14linkdigbenjamins/remotion-animation (CLAUDE.md + prompt files) ↗

Quotables

Lines you could clip.

03:52

“So the fix isn't a better prompt in my opinion. I think it's a file that we need to provide to Claude.”

the whole video's thesis in one line→ TikTok hook↗ Tweet quote

04:23

“It tells Claude the rules that separate broadcast motion from amateur motion.”

tight, quotable definition of the core technique→ newsletter pull-quote↗ Tweet quote

00:00

“There is no after effects, no timeline to edit, no messing around with key frames.”

strong contrast opener against the old workflow→ IG reel cold open↗ Tweet quote

The Script

Word for word.

Read-along

Don't just watch it. Burn it in.

See every word as it's spoken — crank it to 2× and still catch all of it. The same dual-channel trick behind Amazon's Kindle + Audible.

metaphoranalogy

00:00So everything you're watching right now was created with one prompt using Cloud Code and Fable five. There is no after effects, no timeline to edit, no messing around with key frames. I described it in plain English and it created it for me.

00:12It's fully customizable so I can edit the text, I can change the colors. The possibilities, they are endless. From adding live data to custom styles, this is what everyone is doing right now when they create motion graphics.

00:24So let me show you how to do it.

00:29Alright. So before I show you how you can make that really nice animated video, I wanna let you know that we're going to use Remotion, and this is what our AI model will use to create these videos. And as you can see here, Remotion helps us make videos programmatically, and it exposes an API.

00:44It has libraries that we can use to create these videos using code. And if you look at the showcase, for example, people were doing this for some time and they created really nice things. But with the rise of AI and models such as Fable five, this tool becomes so much more powerful because it really understands how to use the code, how to create code to make this really sleek animated motion graphics, and that's what we are going to do.

01:09Now installing this takes about one minute. I'll show you how to set it up. It also comes out of the box with a small editor that we can use to look at our animation, to change it like the text, the colors, and also render it so that you have the actual video that you can use within your longer videos.

01:26Remember, this is what everyone is doing to create these explainer videos that you see popping up on YouTube that uses this nice animated motion graphics. So let me show you how to do it. And after that, I will also show you how you can turn it up one notch to make it really look really sleek and also production worthy.

01:43So stick around, and with that said, let's get started.

01:49Alright. So in order to create all this, I will use Visual Studio Code. It helps me to organize my files, but you can use whichever editor that you like.

01:56Now the first thing that we will do is create a new project. I already have a project here as you can see. However, this is the one that I created earlier to create the intro, and we will look at that in a minute.

02:06But I wanna show you how you can set it up from scratch yourself. So within this folder here, what we are going to run is the command n p x create video at latest, and we're also going to give it a name called clot remotion. Now if you want more information, you can always go to their official docs, and then under installation, you will find everything to install this yourself.

02:24However, we are going to do it step by step, and it's not that much steps at all, it will go really quick. So once we run this, you will see that we'll create a new folder here for us. It's called Cloud Remotion.

02:35And the next thing that we need to do is c the Internet folder. So we go to the Clot Remotion folder, then we type n p m I to install all the libraries, all the packages that are needed to make this work properly.

02:46And once this is done, you will see a message like that. And then the next thing that we need to do is type n p m run dev so we can clear the terminal n p m run dev. And what this will do is start that Remotion Studio.

02:58So it will open in our browser. It's all locally. As I said, it's out of the box or it comes out of the box with Remotion.

03:04And that is that small studio that we can use to look at our animations. We can change the settings for our animations like the colors and the text and also eventually render it as you can see here. But we will come back to that in a minute once we have an animation, and I will show you how this works.

03:22So for now, we can stop the actual video editor. We don't need it. We can clear our terminal, and we can continue.

03:29Now in theory, you can start Cloud just like this, and you can start prompting Cloud to create an animation, and it will work. It knows how to use the Cloud Remotion project to create these animations. It will come up with a scene that you prompted to make, and it will make sure that you can see it within the video editor that I just showed you.

03:47Now the part that actually matters, and that is the part that everyone skips in their tutorials, if you just tell CloudNOW to make me an intro, you will get a okay result. It will not be that great, and it doesn't look that good, to be honest.

03:59And, of course, it will take you a lot of time and a lot of prompting to find out and to create these really good instructions that Claude can use to come up with these production ready animations. So the fix isn't a better prompt in my opinion. I think it's a file that we need to provide to Claude, and you can see here I have this file with all the instructions, all the rules that Claude can use to create this really nice looking motion animations.

04:23So I dropped this one page instruction file in the project, and you can call it a taste engine. It tells Claude the rules that separate broadcast motion from amateur motion.

04:35So as I said, in theory, you can start now by prompting Claude to make these animations. But let me show you real quick a video that I created without these instructions, and then you can see the difference between these videos, and it's the same exact prompt. And as you can see here, one looks a bit more off.

04:52The objects are a bit more choppy. They don't look so polished. They are more stacked on top of each other.

04:58And as you can also see here, the gradient of these objects, they are not as nice as the other video.

05:07So let me go back to my own project now. So this was how we set it up. It's called Cloud Remotion as you see here.

05:13So if we go one folder back and then we go into the Remotion animation because that is where I already have that video that I created. If we now type NPM run dev, that will also start the studio for us. And then I can show you how it looks once you have an animation within there.

05:31And as you can see, this is the exact video, I can play it here, and then it will start. This is what we saw in the beginning of the video. That is everything exactly the same.

05:39Now as you can see here, I can change all the text of the motion graphic of the objects. As you can see here, I can also change the colors, and that is the great thing. That also comes with that instruction file because out of the box, that installation that we did, it doesn't do that.

05:55It doesn't allow you to update these animations here with the settings that you can see here on the side. But that is also something that we instructed Claude to set up.

06:03It creates these inspector files that we can use to update our animation on the fly. And then also, if we like it, as you can see here, there is also a render button. So if we click on render, we can select the quality.

06:16We can select the name that we wanna call it to render it. And also good to know, you can also create animations with a transparent background. And, also, this you can set here within the render option.

06:26So then you will have to choose, for example, ProRes, high quality, or best quality even, then the picture is PNG because we are having a transparent background. And the encoding, we have to set to the last one here, the Yuva 44P10L e.

06:40And then if you render it, it will render it with a transparent background. But, of course, you have to tell Claude to create an animation with a transparent background first. So once you click render video, it will render it for you, and it will output in that folder here out, and that's where you can see the video.

06:56So for example, the one that we created here that is showing up in the out folder.

07:04So that's it for today. That's the combination of the two tools, Remotion and CloudFable five. As I said earlier, I will make sure that you have access to that CloudMD file, which has all the rules for Cloud to use when it's going to create animations and also the prompt file that you can use to recreate this animation if you want to with a bit more room for interpretation from yourself or the exact prompt that the AI came up with once the animation was created.

07:30Or you can create something yourself. The only thing that I suggest is that you add this cloth m d file with all the rules so that cloth knows how to create a really nice looking animation. So to recap, the code base will be available for you.

07:41Check the link in the description. That's it for today. If you think it was interesting, like the video, subscribe to the channel.

07:47Let me know, are you planning to create any of these motion graphics? And as always, if you have a question, put it in the comments. I read all the comments, I will do my best to come back to it as soon as possible.

07:56That's it for today. I hope you enjoyed it, and I'll see you in the next one.

The Hook

The bait, then the rug-pull.

Everything in the cold open — the drifting orbs, the glowing title card, the animated chat bubbles — was generated from a single plain-English prompt to Claude Code, no After Effects and no manual keyframing involved.

Frameworks

Named ideas worth stealing.

04:08concept

The Taste Engine (CLAUDE.md rules file)

A one-page markdown instructions file dropped into the Remotion project root that tells Claude the specific rules separating broadcast-quality motion design from amateur motion — covering things like easing, object layering, and gradient treatment.

Steal forAny AI-coding workflow where output quality depends on taste/aesthetic judgment, not just correctness — write the standard down once as a project rules file instead of re-explaining it in every prompt.

CTA Breakdown

How they asked for the click.

VERBAL ASK

07:14link

“The codebase will be available for you. Check the link in the description... like the video, subscribe to the channel.”

Soft, single-ask CTA at the very end after value was fully delivered — points to a free GitHub repo with the exact CLAUDE.md rules file and prompt used, plus a standard subscribe/comment ask.

MENTIONED ON CAMERA

01:51toolRemotion ↗

07:14linkdigbenjamins/remotion-animation (CLAUDE.md + prompt files) ↗

FROM THE DESCRIPTION

OTHER LINKSAlso linked in the description.

Storyboard