夜雨聆风摘要：html-video 不是普通剪辑 App，而是给 coding agent 用的视频生产脚手架：把文章、仓库或 prompt 变成素材，让 Agent 组织多帧故事板，再用 HTML 和本地渲染输出 MP4。
如果你平时会用 Codex、Claude Code 或 Cursor 写文章、做 demo、整理开源项目，html-video 值得看一眼。它解决的不是“剪辑软件怎么更好用”，而是另一件事：让 Agent 按一条清楚的流水线，把文章、仓库和 prompt 变成一支可渲染的视频。
它的官方定义很直白：HTML becomes video — on your laptop. 也就是说，最后不是云端给你吐一个不可控成片，而是在本机把 HTML、CSS、数据和动画渲染成 MP4。这个定位决定了它更像技术内容生产工具，而不是面向普通用户的手机剪辑模板。
它真正想补的，是 Agent 做视频的中间层
现在让 Agent 写文章、写代码、做网页都相对顺手，但一到视频，问题就变复杂了。视频不是只有一段文案，还要有分镜、节奏、画面元素、模板、时长、配乐和最终编码。你当然可以让 Agent 直接生成某个引擎的工程文件，但这样很快会被具体工具绑住。
html-video 的思路是加一层 meta-layer。用户丢进去的可以是一句话、一个网页文章链接，也可以是一个 GitHub 仓库。Studio 先把来源拉取并扁平成可读素材；Agent 读素材和模板说明，生成 content graph，也就是多帧故事板；每个节点再变成一段自包含 HTML；最后由 Hyperframes 录制动画帧，再交给 ffmpeg 合成 MP4。
下面这张 README 截图能看出它的核心卖点：本地优先、21 个模板、多个 coding agent 接入，以及不用 API key 的本地渲染叙事。
这条链路的价值在于边界清楚：Agent 负责理解材料和组织故事板，模板负责视觉表达，渲染引擎负责把 HTML 变成真正的视频文件。以后如果引擎从 Hyperframes 换成 Remotion 或 Motion Canvas，理论上替换的是底层适配器，而不是整套内容组织方式。
从链接到 MP4，中间不是“魔法一键生成”
README 里把流程拆得很明确：source fetch、agent loop、content graph、per-frame HTML、Hyperframes render、ffmpeg。这个拆法比“一键 AI 视频”更诚实，也更适合开发者理解。
比如你给它一个 GitHub 仓库，它不是随便套个“开源项目介绍”模板，而是先读取仓库简介、README 和顶层结构，再让 Agent 判断哪些要点应该进视频。一个 1500 字文章也类似：真正进入视频的不是装饰性标题，而是从原文里抽出来的关键节点和它们之间的关系。
这对技术解读视频很有用。因为技术内容最怕两件事：一是画面很好看，但和项目事实没关系；二是信息准确，但视频节奏像 PPT 录屏。html-video 尝试把这两件事拆开处理：事实由来源材料约束，节奏和画面由模板与 story board 约束。
适合收藏，但别把它当普通剪辑 App
它目前最适合三类人：第一类是经常把文章、项目、产品说明改成短视频的人；第二类是已经在用 coding agent 做内容生产的人；第三类是希望视频模板、素材来源、渲染过程都能被检查和复用的小团队。
边界也要说清楚。现在真正跑通的是 Hyperframes 引擎：无头 Chromium 逐帧录制 HTML 动画，再用 ffmpeg 编码。Remotion、Motion Canvas / Revideo、Manim 都还在路线图或调研中。换句话说，它已经能做事，但不是所有视频技术路线都已经落地。
使用门槛也不是零。项目要求 Node 20 以上和 pnpm 9 以上，快速开始是安装依赖、构建 monorepo，再启动本地 studio。如果你只是想在手机上套模板剪一条生活视频，它不是最短路径；如果你想让 Agent 把一篇技术文章或一个开源仓库稳定拆成视频，这类工具反而更值得关注。
我会把它归到“Agent 内容生产基础设施”这一类：不是因为它能替你省掉所有创作判断，而是因为它把来源、故事板、模板和渲染这几件事分开了。对技术内容来说，这比单纯追求“一键成片”更重要。
项目地址：<https://github.com/nexu-io/html-video>
