animate:让 Claude Code 逐帧用代码画出短视频
animate 是 cth9191 的 Claude Code skill:整段视频逐帧用代码画在 canvas 上,7 种风格,导出 MP4,不调视频模型。
Skill 资料
npx skills add cth9191/animate --skill animate
让编码智能体做视频,常见两条路都不省心。调视频生成模型,按次计费,改一个镜头就得重抽;用 Remotion 那类模板工具拼素材,画面又不由你说了算。cth9191 的 animate(MIT 协议,2026 年 10 月 4 日创建,截至 2026-10-13 收获 580 星、93 个 fork)换了个思路:整段视频逐帧用代码画出来——一个 <canvas>,无头浏览器逐帧渲染,ffmpeg 合成单个 MP4,中途不碰任何视频生成模型。
它按什么顺序做事
animate 值得先看的地方,是它不急着渲染。SKILL.md 把「分镜没确认就不开画」列为第一条不可协商项,理由写得很直白:故事或风格错了,重跑一次完整构建的时间就白花了。
流程从一次提问开始,问的是题材、画幅、语气、风格、主角、配乐和要不要放自己的产品,风格会给一张画廊让你挑。挑完之后是三次确认:
- 故事确认——它选定一种叙事格式,列一张编号节拍表,每拍写清时间、发生什么、怎么接到下一拍、声音在哪(哪一段留白、最响的一刻落在哪里)
- 风格确认——画 2 到 4 张差异最大的全尺寸帧,你逐张点头或打回
- 分镜确认——每一拍一张关键帧,带声音和转场,按格点头或打回
之后才是构建,最后交付时附一份实测报告,而不是「看起来不错」。下面这张就是第 3 步的产物,仓库自带的 60 秒示例《A short history of AI》分镜表,15 拍,每格标了时间、标题和声音分工。

七种风格,第八格留给你
内置七种风格,每种是一个可插拔的套件:故事语法、节奏、声音和渲染器都共用,风格只负责提供绘画工具包。
| 风格 | 画面 |
|---|---|
| cut-paper 剪纸 | 撕纸边缘、投影、蜡笔、图案、有脸的人物 |
| crosshatch 排线 | 手绘墨线每 2 秒「沸腾」一次,排线与铅笔明暗,暖色纸与深蓝的「机器内部」世界 |
| riso 孔版印刷 | 三色孔版:各自角度的半调网屏、套印、故意错位 |
| sketchbook 速写本 | 石墨线加一个强调色,手写字体 |
| math 数学 | manim 风格的数学讲解:黑底、坐标轴与图表、变量配色、平滑缓动 |
| pixel 像素 | 按真实低分辨率绘制再最近邻放大,配点阵字体 |
| isometric 等距 | 精确等距线稿:恒定细线、白色面遮挡后面的东西、圆角块面,一个深色强调 |

第八格不是风格,是给你自己的。丢给它一段视频、几张图或者一个网页,它量出参考图的配色、线宽、纹理、运动和剪切节奏,画一两帧匹配的图给你确认,然后存成 styles/<name>/,以后的每条片子都能复用。参考素材始终留在本机,不提交、不抄代码、不在署名里提作者名字。
它约束了什么
- 单文件:整段视频编译成一个
index.html,代码里不许出现图片、音频、视频文件、data:URI、外部 URL 和网络字体,tools/build.mjs会强制检查。你自己的截图和 logo、以及一首配乐,是仅有的两个例外 - 确定性:随机全部走种子 RNG,禁止
Math.random()和墙上时钟时间,同一份代码重跑输出逐帧一致 - 屏幕上每个事实都要联网查证并在 brief 里附来源,没来源不许写「第一个」
- 「做完了」是可测的:
tools/review.mjs会核对切点是否落在节拍网格上、故事弧的响度、主角有没有被锚定、最响的一刻是否紧跟在静默之后,并输出联络表 - 格式可复用:9:16、1:1、4:5、16:9 四种画幅是各自排版出来的,不是从一条片子裁的
适合谁
适合已经在用 Claude Code、需要一条 20 秒到 1 分钟讲解片或宣传片,并且不想按帧付费的人。仓库很新,2026 年 10 月 4 日才建,只有 1 个 open issue,可以当早期工具试,但要留出返工余量。
三件事得提前知道。第一,前置环境不轻:Node 18+、Playwright 的 Chromium、PATH 上的 ffmpeg,缺哪个 skill 就直接停下来让你装;配音要么接 ElevenLabs 连接器,要么自己录,词级时间戳还要本地 Python 装 faster-whisper。第二,它自己写明了哪些还没被证明——SKILL.md 末尾的「Honesty about what’s proven」承认,8 种叙事格式里只有 F2(时间线形变链)和 F4(任务)各自产出过通过全部检查的成片,isometric 风格目前只有 demo、还没扛过完整成片,README 里预告的 WebGL 动效风格还不是能用的风格。第三,三次确认是有成本的,一句话出片做不到。
同类里,huashu-art-motion 同样用 Canvas 代码画动画,走的是 35 种艺术风格加 9 种解说语法;animate 风格少一些,但把「先确认再渲染」和节拍级分镜表写进了流程,还附了那份诚实的验证清单。如果你要的只是把项目变成一条 20 秒发布视频,brag 更省事。