ARTICLE DETAIL

资讯详情

深耕编程入门与网站建设的一线实战洞察。

Claude Opus 5.5 并不会“生成”视频:一文拆解代码视频的五步流水线

Claude Opus 5.5 并不会“生成”视频:一文拆解代码视频的五步流水线 JeecgBoot AI专题研究| 从规划、画面、动作、声音到逐帧渲染看懂大模型“写”出视频的底层原理一个容易被误读的现象2026 年 9 月 22 日 Claude Opus 5.5 发布后社交平台上很快出现了大量“一句话出片”的作品十几秒的动效作品集、带旁白的科普短片、配着钢琴曲的动态设计甚至还有一支两分半钟的完整 MV。于是不少人得出了两个结论要么是 Claude 偷偷上线了视频模型要么是 AI 随手写几行代码视频就“自己长出来了”。这两种理解其实都偏了。先把事实摆清楚Opus 5.5 的输入可以是文字、图片和文件但它看不了视频输出也只有文字。Anthropic 的官方发布文章同样没有提到任何视频能力重点放在写代码、操作电脑和知识工作上。那这些视频是怎么来的答案是——程序画出来的。模型写出一段描述“每一帧长什么样”的程序浏览器或渲染软件按照程序把几千帧逐一画好最后拼接成 MP4。换句话说在这类作品里Opus 5.5 同时扮演了导演和程序员两个角色而真正“出图”的是浏览器和渲染工具。理解了这一点你就能明白这件事的天花板不在于模型会不会“画”而在于它能不能把一个创意拆解成可执行的工程。从一条真实的提示词说起先看一个用来制作教学视频的提示词样例它很能说明代码视频的思路帮我做一个教学视频素材Markdown 文件和 Gemini API Key.env 文件见附件。使用 JS Canvas 绘制手绘卡通风格有动效配音使用 Gemini 3.8 Flash TTS。要通俗易懂开头要吸引人看完有收获。拆开看这短短几句话把五件事都交代到了素材内容来源是 Markdown 文件绘制方式JS Canvas即“画面由程序绘制”的代码视频路线视觉风格手绘卡通有动效配音工具交给 TTS 语音服务验收标准开头抓人、讲得明白、看完有收获在实际使用中我们发现提示词里技术路线和验收标准写得越具体成片越稳定只说“做个酷炫视频”模型往往会回落到它最熟悉的默认风格。底层原理视频就是“第 N 帧长什么样”视频本质上是一串连续播放的静态图片。常见帧率是每秒 30 帧一段 10 秒的视频就是 300 张图播放够快人眼就会把它们看成连贯的运动。所以做视频这件事可以被归约成一个问题给定任意时间点画面应该长什么样Opus 5.5 的工作就是写出一个能回答这个问题的程序——你随便问它“第 2.5 秒是什么画面”程序都能立即画出那一刻的完整帧。整条流水线可以拆成五个环节规划、画面、动作、声音、拍摄与合成。其中“规划、画面、动作”三步是模型写出来的代码其余环节依赖外部工具。配音在这里有两个去向一方面为动作提供时间表另一方面作为音轨交给 FFmpeg 合成。下面逐一展开。第一步规划——先有脚本和分镜再动手接到“帮我做个视频”的需求后模型并不会立刻写渲染代码而是先写脚本再把脚本拆成一个个镜头分镜。每个镜头都要回答三个问题画什么、持续多久、配什么话。一个公开了全部源码的例子是 MV《I’m Upping My P(doom)》项目名 PDoomVideo时长 156.6 秒源码托管在 GitHub 上。据项目说明作者只指定了一个角色形象并要求每句歌词都配上有趣的画面和转场没有给任何具体场景其余全部由模型完成。模型在第一轮产出后自己写了一份分镜规范STORYBOARD.md约束了整片的一致性角色设计固定全片不变配色从暖奶油色过渡到太空紫再到警报红最后回归每个镜头里都必须有东西在动画面不放文字角色表情渐变不允许突然跳变每次切镜都由动作带出比如一口咬下去黑屏、一次坠落、镜头穿过一只眼睛随后模型按章节分工并行派出多个子智能体subagent每个子智能体负责时间轴上的一段各写一个 JavaScript 文件。值得注意的是这支视频前后其实生成了两轮。所谓“一句话一次成型”指的是用户侧只发了一句话规划、分工、返工都是模型在内部完成的。这恰恰是 Opus 5.5 的强项在长时间、多文件的任务里保持方向不跑偏——官方发布文章中提到有测试者让它无人值守连续工作了 18 个多小时。第二步画面——一切形状都由代码描述代码视频不需要现成的图片素材画面里的形状、颜色、角色都由代码描述出来。最常见的载体是网页文字和色块用 HTML、CSS 排版图标和角色用 SVG 绘制。SVG 用坐标和数学公式描述图形放大不会模糊非常适合程序生成。比如下面这段 SVG 画了一个青色圆形、一颗金色五角星和一个方块身体svgwidth400height200circlecx60cy100r40fillteal/polygonpoints200,60 212,95 250,95 219,117 231,152 200,130 169,152 181,117 150,95 188,95fillgold/rectx300y80width60height50rx6fill#d97757//svg不同风格对应不同的工具选择3D 场景常用网页 3D 库 three.js整个场景往往就是一个 HTML 文件手绘质感前面那支 MV 用的是 p5.js面向艺术创作的绘图库加一个水彩笔刷库数学/编程讲解Manim一个专做数学动画的 Python 库不经过网页三维建模有开发者把 Blender 当成 Python 库使用让模型直接写脚本建模、贴图照片级素材先用图像模型生成图片再放进网页里作为元素使用选型上的经验是信息密度高、文字多的内容优先选 HTML/SVG因为排版可控、字体清晰追求质感和氛围时再考虑 Canvas、WebGL 或 three.js。第三步动作——把每个动作钉在时间轴上画面之所以会动是因为代码里有一张时间表第几秒、哪个元素、怎么动。主流写法有两种。第一种是 GSAP一个老牌网页动画库。下面两行的意思是“第 2 秒星星从无到有弹出第 3 秒角色向右移动 400 像素”tl.from(star,{scale:0},2)tl.to(character,{x:400},3)GSAP 时间轴的关键能力是可以暂停也可以直接跳到任意时间点——后面“逐帧拍照”环节正是依赖这一点。开源工具 HyperFrames 默认使用的就是 GSAP。第二种是 Remotion 的写法。Remotion 是一个用 React 写视频的框架每一帧都是“帧号的函数”代码拿到当前帧号计算出这一帧里每个元素的位置、透明度和颜色。两种写法殊途同归给定一个时间点画面就被唯一确定。这个性质直接决定了后续能否稳定、可重复地出片。第四步声音——配音就是全片的时钟带旁白的视频通常是先做配音再让画面去对齐配音。流程大致是模型写好旁白稿交给文字转语音服务常见如 ElevenLabs朗读。关键在于拿到每个字说出口的精确时刻——ElevenLabs 提供带时间戳的接口返回音频的同时给出每个字符的起止时间如果手里是现成录音则可以用 Whisper 等语音识别工具反推每个词的时间。有了这份时间表画面就能“卡着话走”旁白说到“星星”的那一刻星星恰好弹出。整条配音成为全片的时钟所有动作都以它为基准排布。音效和音乐也挂在同一个时钟上元素弹出配一声“啵”转场配一声“嗖”背景音乐垫底有人说话时自动压低音量。声音来源大致有三类音效库中的现成素材AI 音效/音乐模型例如让模型按品牌规范写提示词交给 Suno 生成一段 150 BPM 的配乐和 10 个音效纯代码合成有人让模型做 90 秒的动态设计演示连钢琴配乐都是模型自己写代码合成的MV 则恰好反过来歌曲本身就是时钟画面跟着歌词和节拍走不需要 TTS。第五步拍摄与合成——冻结时间一帧一帧地拍写好的网页还不是视频。要变成 MP4需要一台“摄像机”把它逐帧拍下来再与声音合成。这台摄像机就是无头浏览器headless browser没有界面、在后台运行的浏览器通常是 Chrome由 Puppeteer 这类自动化工具驱动。关键在于它从不按播放键。以 HeyGen 开源的 HyperFrames 为例渲染器先把画面跳到第 0 秒截一张图再跳到第 1/30 秒截第二张……一段 10 秒、30 帧的视频就这样截 300 张。帧率可以自定义前面那支 MV 用的是每秒 24 帧156.6 秒共约 3760 帧。为什么不能直接录屏浏览器为了流畅大量工作是异步进行的字体慢慢加载、图片慢慢解码、动画跟随屏幕刷新率走。机器一卡就会掉帧同一份代码在两台电脑上录出来的结果也可能不同。HeyGen 的工程团队记录过这类问题截图太快会截到字体还没显示、SVG 还没上色的画面。他们的解法是在 Linux 上使用特制版 Chrome让排版、绘制、截图在一次调用中全部完成截完这一帧才进入下一帧。如果画面中嵌入了视频素材也不交给浏览器播放而是渲染前先用 FFmpeg 把素材拆成图片序列拍到哪一帧就换上对应的那一张。代码必须遵守的三条禁令为了保证每次渲染结果一致代码需要守住三条规矩不读取当前系统时间不使用没有固定种子的随机数渲染过程中不联网守住这三条每一帧就只取决于它的时间点同一份代码每次都会渲染出完全相同的视频。由此还带来一个工程红利几千帧可以分发给多个浏览器进程并行渲染最后再按顺序拼接大幅缩短出片时间。最后的合成收尾交给开源音视频工具 FFmpeg把几千张截图按顺序编码成视频流再混入配音、音效和音乐输出最终的 MP4 文件。不必自己造轮子HyperFrames 与 Remotion第五步的“摄像机”不需要从零实现目前有两个主流开源工具都可以配合 Claude Code 使用。HyperFrames由数字人视频公司 HeyGen 开源视频就写成普通 HTML动画默认用 GSAP渲染依靠 Puppeteer FFmpeg。它为 Claude Code、Cursor、Codex 等编程智能体提供了技能包skill把流程固化为规划 → 写 HTML → 接入可跳转的动画 → 加素材 → 代码检查 → 预览 → 渲染。npx skillsaddheygen-com/hyperframes# 给智能体装上技能包npx hyperframes render# 渲染出 MP4Remotion出现得更早用 React 组件写视频同样提供官方技能包在项目目录中运行npx remotion skills add即可安装。两者如何取舍HeyGen 分享过一个经验他们早期尝试过 Remotion发现框架约束加得越多智能体的产出越保守、越雷同换回纯 HTML 后创意才回来。这是一家之言但很有参考价值。我们的建议是追求创意多样性、团队前端基础弱优先 HyperFrames门槛低模型写 HTML/CSS 最熟练追求帧级精确控制、已有 React 技术栈选择 Remotion组件化便于复用和维护数学公式、算法讲解直接考虑 Manim模型如何检查自己的作品既然 Opus 5.5 看不了视频它怎么做质检答案是看截图渲染出若干张静态关键帧逐张检查排版、重叠、可读性发现问题就回去改代码再重新渲染。这也提示我们一个实用技巧在提示词里明确要求“每完成一个镜头先渲染 34 张静帧自检”能显著减少返工。在 claude.ai 中Claude Design 同样可以制作动画产出的也是在浏览器中运行的网页代码如果要拿到 MP4 文件目前多借助第三方工具逐帧渲染。代码视频 vs 视频生成模型互补而非替代Seedance字节、可灵 Kling快手这类视频模型直接生成像素而 Opus 5.5 生成的是代码。两条路线的能力边界几乎完全互补对比维度代码视频模型写程序视频模型Seedance、可灵等画面怎么来程序计算每一帧模型直接生成像素画面里的文字每个字都准确容易错字、乱码修改一处细节改一行代码别处不动通常要整段重新生成与旁白对齐精确到帧很难精确控制写实画面、人脸、动物弱近看是粗糙几何形状强同样输入重复渲染结果完全一致每次都不同两条路线也完全可以混用。Claude 可以充当编排器orchestrator通过 MCPModel Context Protocol让 AI 调用外部工具的标准协议调用视频模型拿回生成好的片段再剪进自己的时间轴。已经有人用几张自拍加一段语音备忘录通过 MCP 连接的工具做出数字人口播视频也有人先用代码渲染出镜头再交给 Runway 的 Aleph 模型转成写实风格。对于企业场景来说这种“代码打底 模型补短板”的组合尤其有价值产品演示、数据可视化、功能讲解这类强调准确性的内容交给代码需要真人、实景氛围的镜头再交给视频模型。局限与成本上手前需要知道的事代码视频擅长动效、图表和讲解类内容但在写实画面和大制作上仍有明显短板活物画不好动物和人脸近看只是粗糙的几何形状这类镜头还得靠视频模型或实拍容易过曝太空等场景常常亮得发白需要在提示词里专门要求真实色彩额度消耗大有创作者制作一支 3 分钟带旁白的短片用掉了每周 Claude 额度的约 7%部分单条提示词的 3D 项目写到一半就撞上了单次输出长度上限。按 API 计费Opus 5.5 为每百万输入 Token 4 美元、每百万输出 Token 20 美元审美仍需人把关开发者 Wes Bos 的评价很中肯——这些动效本身未必出色出色的是它“能做出来”决定展示什么、把风格做到位依然是难点提供素材库和风格指引会好很多有环境门槛需要能执行代码的环境一般是 Claude Code并装好 Node.js、Chrome 和 FFmpeg补充两条实践中的避坑经验长片务必分段渲染。先按镜头渲染、确认再整片合成避免一次性长任务中途失败导致全部重来。把视频规范写进项目文件。将帧率、配色、字体、禁用风格等规则沉淀成项目级说明文件可以让每一次生成都自动遵守减少提示词重复。总结Opus 5.5 做视频的分工其实很清晰模型负责规划、写代码、调度其他工具浏览器和 FFmpeg 负责把代码变成画面和文件。它在视频上的表现本质上来自两项最强能力的叠加——长时间规划和高质量写代码。因此这类视频的优势是文字准、时间准、改得动当需要写实画面时再把视频生成模型接进来补位。对开发者而言这意味着视频正在变成一种“可编程资产”可以版本管理、可以参数化复用、可以批量生成。这条路线未来的想象空间或许比“一句话出片”本身更值得关注。参考资料Introducing Claude Opus 5.5Anthropic 官方发布文章HTML to Video Was Not Easy: Here’s How We Solved ItHeyGen 讲解 HyperFrames 渲染原理的工程文章Claude Opus 5.5 One-Shot a Music VideoOrcaRouter 对 PDoomVideo 项目的拆解Claude Opus 5.5 for videodaily.dev 相关文章摘要Claude Opus 5.5 generates motion design and visual scenes entirely in codedaily.dev 整理的社区案例Create speech with timestampsElevenLabs 带时间戳的语音合成接口文档本文为 JeecgBoot AI 专题研究系列文章。
返回列表