Works with

Motion Canvas animations with your AI agent

Motion Canvas animates in TypeScript, one generator function per scene, which suits an agent that writes code. The agent writes and changes the scenes; FrameJam is where you review each render and say exactly what to change.

Facts about other tools are from their official docs and websites, as of Oct 2026. Each one links to its source, and all of them are listed under Sources.

What Motion Canvas is

In its own words, Motion Canvas is two things: a TypeScript library that uses generators to program animations, and an editor with a real-time preview of them. Its website calls it "a TypeScript library for creating animated videos using the Canvas API". Animation reads top to bottom: a scene is a generator function, and yield* runs a tween, like changing a circle's fill colour over one second, before the next line starts.

Rendering happens in the editor: press RENDER. The default exporter writes an image sequence, and a Video (FFmpeg) exporter turns the animation into a video file. Motion Canvas is MIT-licensed.

How FrameJam fits around Motion Canvas

You describe the video in Claude, ChatGPT or Cursor, optionally with a playbook and a style.
The agent writes the scenes. The Motion Canvas editor updates its preview as the files change.
You render with the Video (FFmpeg) exporter, and the agent opens the new file in FrameJam as the next version.
You pin a spot in the frame, mark a range or comment on the whole video, then press Finish review.
The agent gets each comment with its time and a frame image, finds the moment in the generator code, and changes it for the next version.

Comments map well to Motion Canvas code, because time runs down the scene: "at 4.2 s, this label comes in too early" points at one yield* line. FrameJam's styles apply in Motion Canvas too, as palettes, fonts, easing and pacing.

Example prompt

This is a Motion Canvas project. Make a 60-second explainer about how our sync engine works with the FrameJam playbook "Explainer". Keep it in Motion Canvas. Tell me when the scenes are ready; I'll render with the FFmpeg exporter and give you the file, and you open it in FrameJam for review.

Choosing between Motion Canvas and Remotion? Read Remotion vs Motion Canvas. Want headless rendering in the same style of code? Remotion alternatives covers Revideo, the fork of Motion Canvas that adds it.

Playbooks that work with Motion Canvas

A playbook is FrameJam's method for one kind of video. Your agent follows it in whichever tool the project uses.

make a narrated explainer video with AIExplainer: A topic, article or script goes in, a narrated animated explainer comes out.
make a 3Blue1Brown math animation with AIMath Animation: A math or science idea goes in, a calm animated explainer in the style of 3Blue1Brown comes out.
make a SaaS launch video with AIProduct Launch: Your product goes in, a polished launch video with the real app on screen comes out.
make YouTube Shorts with AI from talking-head clipsShow & Tell Short: Raw talking-head clips go in, a tight vertical short that shows what you talk about while you say it comes out.
make an AI music video with animated lyricsKinetic Music Video: A song goes in, a music video where the lyrics, graphics and illustrated characters move on every beat comes out.

Questions

Can my agent render Motion Canvas videos on its own?

Motion Canvas's docs describe rendering from its editor, with the RENDER button. So in a Motion Canvas project you usually press RENDER after the agent's changes, and the agent opens the new file in FrameJam. Revideo, a fork of Motion Canvas, adds headless rendering.

Does FrameJam replace the Motion Canvas editor?

No. The editor gives you a live preview while scenes are written. FrameJam reviews the rendered video and sends your comments, with timestamps and frame images, back to the agent.

Will the agent convert my project to Hyperframes?

No. FrameJam's skill tells the agent to keep the project's own tool and never convert it.

Is Motion Canvas free?

Yes. As of Oct 2026 its repository is MIT-licensed. FrameJam is MIT-licensed too.

Which FrameJam playbooks fit Motion Canvas?

Any playbook that works in your existing project, like Explainer or Show & Tell Short, follows its method in Motion Canvas. Math Animation builds in Manim by default but has notes for Motion Canvas too.

Guides

How to edit videos with ClaudeEdit and make videos in Claude with FrameJam: cut a raw recording, add animations, then point at the exact frames to change. With a full video walkthrough.
How to make videos with ClaudeClaude motion graphics step by step: the tools (HyperFrames, Remotion, Manim), prompting with references, storyboards and a feedback loop. With the full video.
All guides to making videos with your AI agent

Sources

Checked on October 14, 2026. Prices and features change; the linked pages are current.

FrameJam is free, local and open source. Install it in Claude, ChatGPT or Cursor, and read how the review page works.