作者注：拆解 Claude 做视频的完整原理：每帧都是时间的纯函数 seek（t）、无头浏览器 + ffmpeg 四步逐帧渲染、闭合弹簧与卡拍让动效顺滑，最后给出可照做的 5 步上手流程。
如果你最近刷过中文 X，大概率见过一种短片：文字弹性入场、图表随节拍生长、3D 物体缓缓旋转，标注写着「Claude 做的」。2026 年 9 到 10 月，Claude 做视频成了热门玩法，起点之一是 @guanmo_ai（观默）发布的一支 13 秒动效短片。
作者本人的说明很直接：「这支片子是我让 Opus 5.5 一行行写代码渲染出来的，没用任何视频生成模型」。他在评论区又补了一句：「用代码渲染出来，然后逐帧渲染成视频」。
这不是 Claude 悄悄上线了视频模型，也不是什么神秘插件。整件事的核心只有一个时间函数加四步渲染流水线，本文把原理逐层讲透，再给出照着能做的 5 步流程。写场景代码这一步，可以通过 API易 apiyi.com 按量调用 claude-opus-5-5 来完成。
核心价值：读完本文，你会明白 Claude 做视频为什么成立、动效为什么顺、提示词为什么越短越好用，并能自己跑出第一支 MP4。
Claude 做视频的原理：没有视频模型，像素从哪来
一句话结论：Claude 只负责写代码，像素是浏览器画出来的。
Claude Opus 5.5 是纯文本模型，输入文本和图片，输出的只有文本。第三方技术博客 BeatAPI 写明，Anthropic 于 2026-09-22 发布 claude-opus-5-5，支持 1M 上下文、最多 128K 输出 token，没有视频模型。所以大家说的「Opus 5.5 做的视频」，模型真正交出来的是一个网页：只要告诉它时间点，它就能画出动画在那一刻的画面。
打个比方，Claude 像写乐谱的作曲家，浏览器是照谱演奏的乐手，ffmpeg 是录音棚。作曲家本人不发出一个音符，但乐谱写得够精确，录出来的就是完整的曲子。
| 对比维度 | 视频生成模型 | Claude 做视频（代码渲染） |
|---|---|---|
| 模型产出 | 直接输出像素帧 | 输出 HTML/JS 场景代码 |
| 像素来源 | 模型神经网络生成 | 浏览器 Canvas、SVG、WebGL 绘制 |
| 可修改性 | 改一处往往要整段重生成 | 改一行代码，重渲即可 |
| 结果确定性 | 同提示词多次结果不同 | 同一份代码每次渲染完全一致 |
| 文字与数据 | 文字容易糊、数字容易错形 | 字体清晰，数据按代码精确绘制 |
| 擅长内容 | 真人、实拍质感、自然场景 | 动效、信息图、数据动画、logo 揭示 |
seek（t） 是什么：每一帧都是时间的纯函数
一句话结论：给我任意一个时间点，我永远还你同一张画面。
想象你拿着视频播放器的进度条，随手拖到第 3.5 秒，画面立刻定格在那一张，跟你之前看过哪几秒毫无关系。这就是「纯函数」的意思：画面只由时间 t 决定，不依赖历史状态。
场景代码对外只暴露两个约定，这两条出自 BeatAPI 的提示词模板和 awesomeclaude.ai 的渲染脚本：
window.DURATION：整支片子的总时长，单位秒。async window.seek(t)：跳到第 t 秒，并把这一帧完整画完再返回。
为了守住这个契约，场景里明确禁止以下写法：
Date.now()：读的是真实墙钟，渲染时和画面时间对不上。requestAnimationFrame逐帧累加：位置靠「上一帧 + 增量」推出来，一旦跳帧就错位。- CSS
transition、setTimeout、setInterval：都依赖真实流逝的时间。 - 未播种的
Math.random()：每次渲染随机结果不同，画面会闪烁。
为什么必须是确定性渲染
一句话结论：渲染不是实时播放，帧与帧之间没有「连续」可言。
实时播放时，第 400 帧紧跟着第 399 帧出现。但离线渲染时，第 400 帧可能在第 399 帧之后好几秒才截图，甚至多帧并行渲染。任何跨帧累积的状态都会让画面抖动、闪烁，或者两次渲染结果不一致，所以位置必须写成 t 的函数，随机数必须用固定种子。
awesomeclaude 的渲染脚本还有一招更省心：注入虚拟时钟。它接管 performance.now、Date.now、requestAnimationFrame 和 document.getAnimations()，每帧调用一次 __advance(1/fps)，让时间严格一帧一帧往前走。这样场景代码不用改，rAF 循环、GSAP、CSS 动画都能被正确驱动。
Claude 做视频的 4 步逐帧渲染：从 HTML 到 MP4
一句话结论：这本质上是在拍定格动画，只不过摆模型的是代码、按快门的是无头浏览器。
定格动画的做法是摆一下、拍一张、再摆一下。Claude 做视频的流水线完全一样：代码负责把画面「摆」到第 t 秒，浏览器负责「拍」，ffmpeg 负责把几百上千张照片串成视频。
| 步骤 | 谁来做 | 做什么 | 关键要点 |
|---|---|---|---|
| ① 写场景 | Claude 模型 | 生成自包含单文件 HTML | 暴露 DURATION 与 seek(t) |
| ② 逐帧采样 | Playwright 无头浏览器 | 推时间到 t，截一张 PNG，循环到末帧 | 首帧前等字体加载完成 |
| ③ 编码成片 | ffmpeg | PNG 经管道送入，编码 H.264 | yuv420p、crf 18、+faststart |
| ④ 音频后混 | ffmpeg | 独立音轨最后混入 MP4 | 不录浏览器声音 |
第一步，模型通常写出一个单文件 HTML，用 Canvas 2D、SVG+GSAP、Three.js/WebGL 或 GLSL shader 来画。单文件的好处是零依赖，扔进任何浏览器都能打开。
第二步由 Playwright 打开页面，把时间推到 t、截图、再推下一帧。第三步把 PNG 逐帧经管道送进 ffmpeg，编码参数常用以下三项：
-pix_fmt yuv420p：兼容绝大多数播放器和社交平台。-crf 18：接近视觉无损的画质档位。-movflags +faststart：把索引放到文件头，网页上能边下边播。
第四步单独混音。浏览器录音的时间轴和画面时间轴不是一回事，用独立音轨在最后混进 MP4，剪辑点和节拍才能对准。
渲染脚本的典型调用方式是一行命令：node 渲染脚本.js scene.html out.mp4 6 60 1920 1080。六个参数依次是：
scene.html：输入的场景文件。out.mp4：输出文件名。6：时长，单位秒。60：帧率 fps。1920、1080：画面宽和高。
关于速度，awesomeclaude 自述实测：Linux + Chrome + ffmpeg 7 环境下，2 秒 30fps 的片子约 6 秒渲完，第 45 帧正好落在 t=1.500。这是他人自报，不是基准，你的机器配置不同结果会有差异。观默的 build 段则做得更细：每帧额外渲 4 个 subframe，再用 ffmpeg 的 tmix 滤镜合成运动模糊，成片 60fps。
Claude 做视频的技术栈怎么选
一句话结论：库决定怎么造，风格决定像不像 AI。
awesomeclaude 统计了 703 条已发布结果里提名的技术栈，同时发现只有 38% 的提示词明确指定了库，其余由模型自己挑。
| 技术栈 | 占比 | 最适合的内容 |
|---|---|---|
| Canvas 2D | 38% | 动效、动态字、粒子、图表、讲解片 |
| SVG + GSAP | 26% | logo 演绎、UI 动画、线条绘制 |
| Three.js / WebGL | 19% | 3D 转台、空间穿行 |
| GLSL shader | 13% | 抽象循环、流体流动效果 |
如果要做一分钟以上的多场景长片，Remotion、HyperFrames 这类框架自带帧时间和渲染器，比手搓单文件 HTML 省事得多。
Claude 做视频为什么顺：闭合弹簧、卡拍、运动模糊与自检
能出片只是第一层，片子看起来顺不顺、有没有「AI 味」，靠的是下面几条运动学原理。
闭合弹簧：用公式算位置，而不是一步步推
一句话结论：弹簧位置直接从 t 算出来，不靠逐帧模拟。
普通的弹跳模拟是每一帧给速度加一点、给位置加一点，像一步步推小球。闭合形式阶跃响应（closed-form step response）则是一个公式，代入 t 就能直接得到小球在那一刻的位置。如果一个元素被多次改目标，就把多个弹簧响应相加，结果依然只依赖 t。
同理，所有物理量都提前算好或用解析式表达。逐步积分在帧乱序时会漂移，这和前面讲的 seek（t） 契约是同一个道理。
卡拍与运动模糊：节奏和质感的来源
卡拍的做法是用 numpy 分析 BGM，得到一张节拍网格，把关键动作落在节拍上，而不是凭感觉给时长。观众未必说得出为什么舒服，但画面和鼓点对齐时，片子会显得非常「专业」。
运动模糊则对应前面提到的 subframe 技巧。快速移动的物体在真实摄影中本来就会拖影，每帧多采几个子帧再混合，画面会从「幻灯片式跳动」变成「电影式流动」。
联系表自检：先看缩略图，再渲全片
一句话结论：渲全片之前先渲一张「缩略图拼图」，提前发现问题。
联系表（contact sheet）是摄影术语，把多张小图拼在一张纸上快速浏览。全片渲染前，每分钟或每一拍先渲一帧，拼成一张图，检查文字有没有重叠、有没有空镜、节奏有没有拖。
awesomeclaude 总结了六条硬规则，可以直接当检查清单：
- 读时间，不数帧。
- 所有随机数都播种。
- 不用逐 tick 积分的物理。
- 首帧前
await document.fonts.ready，否则前几帧会是回退字体。 - 声音交给 ffmpeg 混，不录浏览器。
- 色彩标 BT.709，否则部分播放器会偏色。
观默还分享过三个踩坑经验：给会被相机缩放的层加 will-change 会让文字发虚；在形变容器里换文字要单独设进出场时间；首尾帧必须完全一致，否则循环播放时会抖一下。
Claude 做视频的提示词为什么短反而好用
一句话结论：给方向和禁区，比给一堆参数更能激发模型的设计能力。
观默公开过一句话提示词原文，并明确说用 Opus 5.5 不需要 skill，一句话就够：make a dynamic 15-second motion graphics video that shows what an incredible motion designer you are, like it's your showreel for a résumé. go all out. 意思是「做一支 15 秒动态视觉短片，当作你求职的作品集，全力以赴」。他的经验是，写「顶尖、全力以赴」比写一堆详细参数更有效。
awesomeclaude 统计的 496 条完整提示词里，近一半不到 200 字符。只有 7% 的提示词要求模型自己检查帧，但高质量结果几乎都做了自检。
需要更可控时，可以参考观默的六段式结构：
- inputs：先让模型反问，要 8-12 个 UI 状态、配色、BPM。
- direction：风格方向，加一份 Banned 清单。
- structure：按拍子排列的状态序列。
- build：工程约束，比如 seek（t） 契约和 subframe。
- gotchas：常见坑提醒。
- start：先给节拍表，再写代码。
最值得写进提示词的是「不要」：粒子爆发、镜头光斑、霓虹发光、RGB 分离、弹跳 easing，这些是 AI 味的主要来源。通用模板还要写清时长、画幅、分辨率、fps、事实清单和音频信息，其中画幅最常被漏写，导致成片带黑边。
Claude 做视频快速上手：5 步流程、耗时与价格
原理讲完，下面是照着能做的流程。全程不需要写一行代码，命令和配置都以行内形式给出。
- 准备本机环境：安装 Node.js、Chrome 和 ffmpeg。终端执行
npx playwright install chromium装好无头浏览器，再执行ffmpeg -version确认 ffmpeg 可用。 - 接入模型：在你常用的 OpenAI 兼容客户端里填三项，
base_url填https://api.apiyi.com/v1，api_key填在 API易 控制台创建的 Key，model填claude-opus-5-5。 - 写提示词：一句话版本直接套用上面的作品集提示词；需要可控就用六段式，务必写明时长、画幅、
1920x1080、60fps，并要求场景暴露window.DURATION与window.seek(t)。 - 先渲联系表和短片段：让模型先给分镜和 4 个关键帧，再渲 2-3 秒片段验证。确认没有 timer、字体正常、首尾帧一致后再继续。
- 全片渲染与混音：执行
node 渲染脚本.js scene.html out.mp4 15 60 1920 1080，然后用 ffmpeg 把 BGM 混进成片，音频编码选-c:a aac，并加-shortest让音视频等长。
如果用的是 Claude Code，它能自己写场景、自己跑渲染脚本、读回 contact sheet 并修正，直接产出带音轨的 MP4。想固定一套视觉风格，可以打开项目里的 .claude/skills/SKILL.md，写入以下几行：
- 第一行写
name: motion-video，作为技能名。 - 第二行写
description:，说明「生成基于 seek（t） 的动效短片」。 - 之后逐行写风格规则，比如 Banned 清单、配色、字体、必须
await document.fonts.ready。
之后一句话就能复现同一套视觉。至于 claude.ai 网页版，适合直接在页面里预览效果，但录屏会丢帧、锁在屏幕分辨率，也没法混音。
Claude 做视频的耗时与花费参考
以下数据全部是他人公开自报的单点数据，不是基准，仅供量级参考。
| 场景 | 耗时 | 花费或用量 | 数据性质 |
|---|---|---|---|
| 15 秒一次性生成 | 约 1 分钟 | 约 2 美元 API 花费 | 他人自报，不是基准 |
| 5 分钟讲解片（含 TTS 与字幕） | 26 分钟 | 未公开 | 他人自报，不是基准 |
| 3 分钟历史题材，约 7400 行代码 | 约 1 小时 | 用掉周额度 7% | 他人自报，不是基准 |
| 4K60 整首歌，只算渲染 | M5 Pro 上约 57 分钟 | 本地渲染，不花模型钱 | 他人自报，不是基准 |
| LaunchVideo 公开 demo | 约 4 分钟 | 约 9 万输入 + 1.5 万输出 token | 他人自报，不是基准 |
按 LaunchVideo 这份 token 预算换算模型成本：输入 9 万 ÷ 100 万 × 4 美元 = 0.36 美元，输出 1.5 万 ÷ 100 万 × 20 美元 = 0.30 美元，一条约 0.66 美元。实际花费取决于你的提示词长度和修改轮数。
claude-opus-5-5 价格表
以下价格查自 docs.apiyi.com/models，单位为美元/百万 tokens，按量计费，查于 2026-10-26。
| 模型 | 类型 | 输入 | 输出 | 缓存读 |
|---|---|---|---|---|
| claude-opus-5-5 | 文本 | 4 美元 | 20 美元 | 0.2 美元 |
| claude-opus-5-5-thinking | 文本 | 4 美元 | 20 美元 | 0.2 美元 |
型号与价格以平台型号列表为准，实际价格以控制台实时显示为准。反复修改同一个场景时，长提示词和已有代码会命中缓存读，单价远低于普通输入。
🚀 快速开始：建议先在 API易 apiyi.com 用新用户免费额度跑一支 5 秒短片，把环境、提示词和渲染脚本整条链路走通，再投入长片制作。
Claude 做视频的边界
一句话结论：代码能画的都能做，需要摄像机拍的做不了。
代码渲染擅长动效、动态字、信息图、数据动画、产品演绎、logo 揭示和 3D 场景。它不是真人实拍，也不做口型同步，需要真人出镜、街景实拍或电影镜头，得另外接视频生成模型或补拍素材。
另外两个现实问题：模型偶尔会把 timer 写进场景，长片的章节拼接也可能不干净，所以先渲短片段验证再渲全片。讲解类内容里的数字要自己核对，模型可能把事实写错。
Claude 做视频常见问题 FAQ
Q1：Claude 做视频到底是什么？
它是让 Claude 写出一个可按时间取帧的网页场景，再由无头浏览器逐帧截图、ffmpeg 编码成 MP4。模型本身不生成像素，像素全部由浏览器绘制。
Q2：Claude 做视频和 Sora 这类视频生成模型有什么区别？
视频生成模型在真人和实拍质感上保持领先，但文字清晰度、数据准确性和可修改性受限。相比之下，Claude 做视频在信息图、数据动画、logo 演绎上更稳定，改一行代码就能精确调整。
Q3：这个玩法是什么时候流行起来的？
2026 年 9 到 10 月在中文 X 上走红。按 BeatAPI 的说法，claude-opus-5-5 于 2026-09-22 发布。观默随后公开了案例库 awesome-ai-motion，截至 2026-10-26 共收录 1417 条作品索引，但每条都没有被维护者独立复现，只能当参照。
Q4：Claude 做视频最适合哪些场景？
– **产品宣传**：功能演示、界面动画、发布会片头。
– **知识讲解**：数据图表生长、流程拆解、科普动画。
– **品牌动效**：logo 揭示、动态字、社交媒体短动效。
– **3D 展示**：产品转台、空间穿行。
Q5：如何通过 API 调用 claude-opus-5-5 来写场景代码？
1. 在 API易 apiyi.com 注册并创建 API Key。
2. 客户端里把 `base_url` 设为 API易 的 OpenAI 兼容地址，模型名填 `claude-opus-5-5`。
3. 发送提示词拿回单文件 HTML，交给本地渲染脚本出片。
同一个 Key 还能切换 Claude、GPT、Gemini 等模型，方便对比哪家写的动效更好。
Q6：做一支短片大概要花多少钱？
按他人自报的 LaunchVideo 用量估算，模型成本约 0.66 美元一条；有人自报 15 秒片约 2 美元。这些都不是基准，建议先用 API易 apiyi.com 的按量计费小额测试，记录自己的真实 token 用量再做预算。
Q7：为什么我渲出来的片子会闪烁或抖动？
最常见的原因是场景里用了 `Date.now()`、逐帧累加或未播种的随机数，违反了 seek（t） 契约。其次检查首尾帧是否一致、首帧是否等待字体加载完成。
Claude 做视频核心要点与总结
Key Takeaways
- 像素来源：Claude 只写代码，画面由浏览器绘制，不需要视频模型。
- 核心契约：每帧都是时间的纯函数
seek(t)，任意时刻画面唯一确定。 - 四步流水线：写场景、无头浏览器逐帧截图、ffmpeg 编码、音频后混。
- 顺滑秘诀：闭合弹簧、物理预计算、卡拍、subframe 运动模糊。
- 质量保障：渲全片前先出联系表，提前发现重叠、空镜和拖拍。
- 提示词策略：短而有方向，重点写画幅和「不要」清单。
- 上手方式：通过 API易 apiyi.com 按量调用 claude-opus-5-5，本地完成渲染。
总结
Claude 做视频的本质，是把「生成画面」变成「生成能画画面的代码」。只要守住 seek（t） 这个时间函数，再配上无头浏览器和 ffmpeg 的四步流水线，一个纯文本模型就能稳定产出可复现、可修改的动效短片。它的边界同样清晰：擅长动效与信息图，不碰真人实拍和口型同步。
建议从一支 5 到 15 秒的短片开始，先跑通链路，再逐步加入卡拍和自检。写场景代码这一步，推荐通过 API易 apiyi.com 调用 claude-opus-5-5，按量计费，新用户有免费额度可以先验证效果。
Claude 做视频参考资料
- 观默原始短片与作者说明：玩法起点
- 链接：
x.com/guanmo_ai/status/2109941504827654305 -
说明：13 秒动效短片原帖，作者说明见
x.com/guanmo_ai/status/2104141508081525184 -
awesome-ai-motion 案例库：Opus 5.5 代码渲染作品索引
- 链接：
github.com/guanmo-ai/awesome-ai-motion -
说明：可当风格参照，条目未经独立复现
-
awesomeclaude Claude Video 指南：渲染脚本与六条硬规则
- 链接：
awesomeclaude.ai/claude-video -
说明：虚拟时钟方案和技术栈统计的出处
-
API易 模型列表：claude-opus-5-5 价格与分组
- 链接：
docs.apiyi.com/models - 说明：型号与价格以此页面为准
作者：API易 技术团队
技术交流：欢迎在 API易 网站首页联系我们，更多接入文档可查阅文档中心 docs.apiyi.com
