Get AI summaries of any video or article — Sign up free
Claude Code can now make videos, here’s how thumbnail

Claude Code can now make videos, here’s how

David Ondrej·
5 min read

Based on David Ondrej's video on YouTube. If you like this content, support the original creators by watching, liking and subscribing to their content.

TL;DR

Claude Code can generate professional animations from plain-English prompts by using Remotion’s code-based video pipeline.

Briefing

Claude Code can now generate full, professional-looking animations from plain-English prompts—without manually building timelines or wrestling with animation software. The practical breakthrough is that Remotion, a framework for programmatic video creation, has released “agent skills,” letting AI coding agents plug into Remotion and output React-based animation code that renders into real video. The result is that marketing videos—like the ones demonstrated—can be assembled by typing instructions, with the system handling the underlying animation logic frame by frame.

At the core is Remotion’s approach: video is built as code. Instead of dragging assets around in a GUI, creators define sequences and components that place elements over time, similar to a timeline in editing tools. When development runs, a local preview lets users scrub through the animation in real time. When rendering, each frame is screenshot and stitched into an MP4 using FFmpeg. Because Remotion treats animations as React components, AI agents can generate structured code rather than trying to operate complex interfaces like After Effects or Premiere Pro—areas where coding-focused agents typically struggle.

The “agent skills” layer matters because it standardizes how agents learn tool-specific patterns. These skills are instruction files that use progressive disclosure: only the relevant parts of the skill load into context when a task matches the description. That keeps prompts lean and prevents wasting tokens on unrelated capabilities. The skill is described as containing Remotion API patterns, component conventions, best practices for animations, and reference documentation for topics such as 3D audio captions. Since skills are positioned as an open standard, the same Remotion skill can work across multiple agents (including Claude Code, Open Code, and others) as long as they support the skills format.

The workflow shown is built around a setup that’s mostly copy-paste. Developers start from remotion.dev, use an npx create command to scaffold a blank Remotion project, add Tailwind, and enable agent skills. Then they install the Remotion skill via a skills.sh command (hosted by Vercel), choosing whether to install it per-project or globally. After that, Claude Code is run inside the project folder, and prompts are organized into subdirectories so each animation stays contained.

Best results depend on how prompts are written. The demonstrated guidance emphasizes starting with a clear storyboard, iterating through multiple smaller prompts rather than attempting a one-shot build, keeping compositions modular with reusable components (intros, transitions, outros), and providing high-quality assets (sprites for games, product photos for marketing). In the examples, the first animation required substantial generation time—on the order of minutes—because the agent had to author many React components and register them into the Remotion project. Subsequent prompts can be faster and can modify details like gradients or timing.

Overall, the pitch is straightforward: AI can already build products, but Remotion + agent skills shifts marketing video production into the same prompt-driven workflow. Instead of hiring animators or learning complex tools, teams can iterate on video concepts by typing instructions and letting code generate the animation structure programmatically.

Cornell Notes

Remotion turns video creation into code by defining sequences and React components that place elements over time, then rendering frames into MP4 via FFmpeg. The key upgrade is Remotion’s “agent skills,” which let AI coding agents like Claude Code generate Remotion-compatible code instead of struggling with complex animation GUIs. Agent skills use progressive disclosure, loading only the instructions relevant to the user’s task to keep context efficient. With the Remotion skill installed, prompts can produce full animations and marketing clips, including modular components and asset-driven scenes. The workflow rewards clear storyboards, iterative prompting (often multiple rounds), and high-quality input assets for better results.

What makes Remotion different from traditional animation tools?

Remotion creates videos programmatically. Animations are defined as code—sequence components place elements on a timeline, and React components describe what appears and when. A local dev server provides a preview that can be scrubbed frame-by-frame, and final rendering screenshots each frame and stitches them into an MP4 using FFmpeg. This code-first model is what lets AI agents generate animations structurally rather than manipulating a human-oriented UI.

Why do “agent skills” matter for Claude Code and similar agents?

Agent skills are instruction files that teach an AI coding agent how to work with a specific tool. For Remotion, the skill includes API patterns, component conventions, and animation best practices, plus reference docs for topics like 3D audio captions. When a prompt matches the skill’s description, the agent loads only the relevant parts (progressive disclosure) and then generates the correct Remotion code to render the animation.

How does progressive disclosure improve results and efficiency?

Instead of dumping a large set of tokens into the context window, progressive disclosure loads full skill instructions only when the task matches. If the prompt is about video editing, Remotion-related instructions load; if it’s about something else, those instructions don’t. This keeps context lean and helps the agent focus on the right components and patterns for the requested animation.

What prompt strategy leads to better animations with Remotion skills?

The guidance emphasizes a clear storyboard first, then iteration. Rather than trying to generate everything in one prompt, start with small prompts, preview results, and adjust. The examples suggest that strong animations often take multiple prompt rounds (roughly 5–10). Modular composition also helps: build reusable components for intros, transitions, and outros instead of one monolithic component.

What role do assets play in the quality of the final video?

Assets strongly influence output. The workflow recommends providing high-quality inputs—sprites for games or product photos for marketing. In the demonstrations, the agent generates and animates around provided images (e.g., moving cursor and UI elements, or cycling through supplied visuals). Better assets generally produce better-looking animations because the agent’s code orchestrates timing, transitions, and layout around those inputs.

How is the Remotion skill set up for use with Claude Code?

The setup is described as scaffold-and-install. Start at remote.dev, run an npx create command to generate a blank Remotion project (with Tailwind and agent skills enabled), then install the Remotion skill using a skills.sh command (from Vercel). After installation, run Claude Code in the project folder, verify available skills, and create separate subdirectories for each animation so files stay organized.

Review Questions

  1. How does Remotion’s rendering pipeline (preview vs final render) work, and where does FFmpeg fit in?
  2. Explain progressive disclosure in agent skills and why it helps an AI agent stay efficient.
  3. What combination of storyboard clarity, iteration, modular components, and asset quality most affects animation outcomes?

Key Points

  1. 1

    Claude Code can generate professional animations from plain-English prompts by using Remotion’s code-based video pipeline.

  2. 2

    Remotion represents animations as React components and sequence components that place elements over time, then renders frames into MP4 via FFmpeg.

  3. 3

    Remotion’s “agent skills” let AI coding agents produce tool-correct Remotion code instead of struggling with animation GUIs like After Effects or Premiere Pro.

  4. 4

    Agent skills use progressive disclosure, loading only the instructions relevant to the user’s task to keep context efficient.

  5. 5

    High-quality results depend on a clear storyboard, iterative prompting (often multiple rounds), modular composition, and strong input assets.

  6. 6

    A practical workflow involves scaffolding a Remotion project, installing the Remotion skill (per-project or globally), and running Claude Code inside the project folder with organized subdirectories for each animation.

Highlights

The Remotion skill turns prompt-driven video generation into React component code that can be rendered frame-by-frame into MP4.
Progressive disclosure prevents agents from loading irrelevant skill instructions, keeping prompts lean and improving tool accuracy.
Animations can be produced from a single detailed prompt, but the best outcomes typically come from iterative refinement across several prompt rounds.
The setup emphasizes copy-paste commands: scaffold a Remotion project, install the skill, then let Claude Code “cook” inside the project directory.

Topics

  • Prompt-Driven Animation
  • Remotion Framework
  • Agent Skills
  • React Video Rendering
  • AI Marketing Videos

Mentioned