The argument in one line.
Claude Code can now generate production-quality motion graphics through Remotion's agent skill, letting non-developers build animated videos in minutes instead of hours in After Effects.
Read if. Skip if.
- A creator or marketer with basic terminal comfort who wants to generate branded motion graphics (landing pages, promotional videos) without learning After Effects.
- A developer or technical founder who builds tools for non-technical users and wants to understand how Claude Code + Remotion can expand your product's capabilities.
- Someone with design ideas but no motion design experience who's willing to learn Remotion's prompt syntax to turn concepts into 10-60 second animated videos.
- You're a motion designer with years of After Effects experience looking for advanced techniques — this is entry-level tooling, not a replacement for professional workflows.
- You need pixel-perfect control over every frame or work with complex 3D animations — Remotion's agent generates code-based motion, not frame-by-frame design.
- You have no terminal experience and refuse to learn basic command-line workflows — the entire setup requires running commands in a terminal before you touch the visual interface.
The full version, fast.
Remotion's new Claude Code agent skill turns plain-English prompts into animated motion graphics rendered in a local browser studio, removing the need for After Effects or motion-design experience. Install the skill from the terminal, scaffold a project with bun create video, then describe the animation you want � a terminal typing a directory tree, a branded landing-page intro, a logo reveal � and Claude generates the composition files and spins up Remotion's studio so you can preview and iterate. Drop images into the public folder and reference their paths to brand the output. Keep concepts simple; complex multi-scene designs break down. Pair it with a custom prompt-builder skill to translate vague ideas into the detailed briefs the agent actually executes well.
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 →Where the time goes.

01 · Cold open — the result
Shows the finished Co-Writer System terminal animation running in Remotion Studio, then pivots to the Remotion X announcement (8.3M views) that kicked this off.

02 · Install the Remotion skill
Run `npx skills add remotion-dev/skills` in terminal — downloads the Claude Code agent skill. Then `bun create video` to pick a blank-canvas template and scaffold the project folder.

03 · Open in VS Code + clean up agent folders
Project opens in VS Code. Delete the non-Claude agent folders (.cursor, .gemini, .opencode) to keep only .claude/skills/remotion-best-practices.

04 · Build the first animation — co-writer system terminal
Shows Alex's own Co-Writer System project. He uses a two-step process: first ask Claude to write a detailed prompt for the desired motion graphic, then paste that prompt into a fresh Claude session inside the motion-design folder. Claude reads the skill, plans todos, builds the composition, and spins up Remotion Studio at localhost:3001.

05 · First result + iterating — add intro and profile photo
The initial terminal animation works. Alex then expands it: asks Claude to add a title intro ('Co-Writer System by Alex McFarland'), flow into the terminal, then end with his profile photo and landing page URL. He drops the photo in /public and gives Claude the file path.

06 · Final 3-scene video + Remotion Studio preview
Claude builds a three-scene composition: title intro (3s), terminal animation (11s), outro with profile photo and URL (4s). Total 18 seconds at 30fps. Preview plays in the browser.

07 · The motion-design-prompt skill
Alex introduces his custom Claude skill that guides users through building the kind of hyper-detailed prompt the Remotion agent needs. Two paths: provide a concept, or brainstorm from scratch. He demos it live — inputs a rough idea about a terminal showing AI agents being invoked — and Claude starts asking structured clarifying questions.

08 · Keep it simple — what actually works
Key warning: complex multi-element designs break down. Terminals, text on screen, links, and simple visuals work well. Don't over-engineer on day one.

09 · The bigger picture — stack your skills
Closes with a positioning argument: whether you ghostwrite, run a startup, or build a content business, motion design stacks on top of writing skills and makes you dramatically more valuable as an AI operator. He pitches his Substack for the prompt skill and CoWriter System.
Lines worth screenshotting.
- Remotion's Claude Code agent skill lets you generate animated motion graphics from a text prompt without opening After Effects or any design tool.
- The Remotion studio launches in your browser and renders the animation in real time as Claude builds it — you see the output iterate live.
- A detailed prompt is required because the Remotion agent needs explicit visual specifications: typography, color, timing, animation style, and layer order.
- A custom slash skill that generates a detailed Remotion prompt from a landing page path solves the biggest barrier for non-designers: knowing what to ask for.
- Terminal typing animations, folder file-structure reveals, and text build sequences are all buildable with the Remotion skill without custom animation code.
- The announcement video for the Remotion skill reached 8.3 million views on X within 24 hours — signal that programmatic motion design has mass market appeal.
- Installing the Remotion skill is a single terminal command that also sets up the project scaffold, the agent skill file, and the development server.
- Deleting the Cursor, Gemini, and OpenCode agent directories keeps the workspace clean if you are only using Claude Code.
- Motion design generated in Remotion can be dropped directly into a deployed landing page without any video editing step.
- Iterating on a Remotion animation is done conversationally inside the same Claude session — no need to re-run setup or re-specify the full design context.
- A blank canvas template is the right starting point for branded promotional videos — the pre-built templates are too opinionated for custom brand work.
- The gap between describing a motion design in words and having it rendered as a browser-playable video is now a single Claude Code session.
The two-step prompt chain is the real unlock.
Don't ask Claude to make the motion graphic — ask Claude to write the prompt for the motion graphic, then paste that prompt into the Remotion session.
- Install in two commands: `npx skills add remotion-dev/skills` then `bun create video` (blank canvas template).
- Keep it simple: terminals, text, links, and static images work well. Multi-element complex layouts break down fast.
- Use the two-step chain: Claude writes the spec-quality prompt, then Claude executes it — your rough idea never touches the agent directly.
- Drop assets (photos, logos) in /public and give Claude the file path — it'll pull them into the composition.
- The Remotion Studio preview runs at localhost:3001 automatically — Claude keeps it live during iteration.
- Build a prompt-writing skill like his motion-design-prompt.md to systematize the briefing process for any creative domain.
- Positioning angle for JoeFlow/MCN+: 'motion design is now a dictation workflow' — you speak the concept, Claude specifies, Remotion renders.
Terms worth knowing.
- Motion design
- Animated graphic design that uses moving text, shapes, and images to communicate ideas, commonly used in promotional videos, landing pages, and product demos.
- Remotion
- A framework for creating videos and motion graphics programmatically using React code instead of a traditional video editor, with rendering done in the browser.
- Claude Code
- Anthropic's command-line coding tool that runs an AI agent locally in the terminal, able to read files, run commands, and edit code inside a project.
- Agent skill
- A packaged set of instructions and reference files that extends an AI coding agent with specific knowledge or capabilities for a defined task, loaded on demand.
- Project scope
- An install option that makes a skill or configuration available only inside the current project folder, rather than globally across every project on the machine.
- Bun
- A fast JavaScript runtime and package manager used as a drop-in alternative to Node.js and npm, often invoked through commands like 'bun create' to scaffold new projects.
- Blank canvas template
- An empty starter project with no pre-built scenes or animations, used as a clean foundation when you want to build a motion graphic from scratch.
- Composition
- In Remotion, a named video scene with a defined duration, frame rate, and dimensions that acts as the top-level container for the animation being rendered.
- Remotion studio
- A local browser-based preview environment, launched by Remotion, where you can play back, scrub through, and inspect the motion graphics being generated.
- Public folder
- A project directory whose files are served directly to the application, used in Remotion projects to hold images, videos, and other static assets the animation references.
- Ghostwriting
- Writing content like posts, articles, or newsletters under someone else's name for pay, commonly done for executives and founders who want a consistent online presence.
- AI operator
- A practitioner who combines multiple AI tools — writing, image, video, audio, motion — into end-to-end workflows, rather than specializing in a single AI use case.
Things they pointed at.
Lines you could clip.
“I created this motion design graphic that you're looking at right now in less than twenty minutes using Claude Code.”
“Most of the stuff you see on X is, like, total hype and BS — but this was one time where it's actually pretty crazy.”
“It's not just about writing. Writing is the focus, but then you can build on top of that. Now we have research, image generation, video generation, motion design, sound. When you add all of that together, it makes you so much more valuable.”
“I don't know how good this is gonna come out. My instructions weren't the best, but you'll still be able to see the point.”
Word for word.
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.
The bait, then the rug-pull.
Twenty minutes. One prompt. No After Effects license. Alex McFarland opens with the finished terminal animation already playing — then rewinds to show every step that produced it, from a single npx command to a looping promotional video embedded on a live landing page.
Named ideas worth stealing.
Two-step prompt chain for motion design
- Step 1 — Ask Claude to write a detailed motion design prompt from your rough idea and landing page
- Step 2 — Paste that detailed prompt into a fresh Claude session inside the Remotion project folder
Using Claude to write the prompt for Claude removes the friction of writing pixel-level animation specs yourself.
motion-design-prompt skill
A custom Claude skill that guides users through creating detailed, AI-executable motion design prompts via structured conversation — either from a concept or from scratch.
Stack your AI skills
Writing alone is table stakes in 2026. The multiplier is layering motion design + video + image generation + research on top of writing to become a full-stack AI content operator.
How they asked for the click.
“Consider joining my Substack where the Claude skill will be if you need help prompting.”
Soft verbal pitch at the very end — no lower-third, no pinned comment shown. The prompt skill is paywalled behind Substack.







































































