Video-as-code 正在颠覆传统视频生产流程。从 Remotion 的 React 框架到 Hyperframes 的 HTML 方案，四类工具用不同技术路径实现同一目标：让视频创作可代码化、可版本控制、可被 AI agent 操作。这场变革正在复刻翻译行业从 Word 到 TMS 的演进史，而 HTML 作为 LLM 母语的优势或将重塑视觉内容生产格局。

前天发了那篇用 Claude design 做 30 秒宣传片的文章，群里炸出几个有意思的回应：有人甩来 HeyGen 刚开源的 Hyperframes，有人提到 Remotion 已经做了五年，还有人发来 Motion Canvas 和 Manim 的链接。

我才意识到，这不是一个产品的事，是一个 category 在崛起。

这个 category 已经有了名字：Video as Code——视频即代码。

追随好奇心扒拉了一通，得到了这张地图。

一、Video-as-code 赛道已经不少人

大致分四派，各押一种未来。

1、Remotion——React 派的老牌玩家

2021 年由 Jonny Burger 创立，基于 React 组件做视频。截至 2026 年 5 月，GitHub 大约 37.5K stars，四年迭代。Fireship 的视频团队在用它做技术解说，很多营销公司用它批量生成”个性化年度回顾”这类视频。

它的核心模型很直接：每一帧是一个 React 组件，整段视频就是一个 React 应用，渲染时把每一帧导出为 PNG，再用 FFmpeg 拼成 MP4。

Remotion 的赌注是：未来软件主要由开发者写 React + AI 辅助，所以最好的视频工具就是给开发者一个强大的 React 框架——这在翻译领域，有点像CAT（计算机辅助翻译）的bet。

2、HeyGen Hyperframes——HTML 派的搅局者

2026 年 4 月 17 日刚开源，早上看了一下，15.8K Star了。

它的赌注简单粗暴——直接写 HTML、CSS，不用 React。CLI 默认非交互式，所有输入通过 flag 传入，所有输出是纯文本——专门为 Claude Code、Cursor、Gemini CLI、OpenAI Codex 这些 agent 设计。

它的官网 tagline 直接就是 “Edit Videos By Vibe-Coding”。

这是昨天用Hyperframes做的视频，等有空了分享下过程：

3、Motion Canvas / Revideo / Midrender——TypeScript Generator 派

Motion Canvas 是用 TypeScript 的 generator function 编排动画。写起来更像剧本——第一步发生什么、停顿多久、然后下一步。适合手工编排的解释性视频，比如数学讲解、产品逻辑演示。

4、Claude Design——晚到的体量玩家

严格说不在同一个赛道，但产出形态非常像。我前天文章里写过，Claude design 给我的不是 mp4，是一个项目包：HTML + JSX + CSS + assets，需要自己用 FFmpeg 后处理。

Claude design 没有专门的渲染管线，但它给出的”成品形态”和 Hyperframes 是同一种世界观：视频是一个可代码化的资产包，不是一个时间轴文件。

这些玩家放在同一张图上看，你会发现它们用的是不同语言、不同抽象层级，但都在做同一件事：把视觉创作从图形界面解放出来，变成可以被代码、版本控制、agent 操作的系统。

二、翻译行业 Word-CAT-TMS故事的视觉版

把镜头切到翻译技术领域的历史：

最早的工具是 Word。译者打开一个 。doc 文件，一句一句改。每个项目从零开始，术语写在 Excel 里，风格指南、译文原文、过程文档文档分散在文件夹或者邮箱。一个项目结束，资产留下的不多，下个项目还得从头来。

后来出现了 CAT（Computer-Aided Translation）工具——Trados、MemoQ、Wordfast。它们做了一件事：把”翻译”这个动作从”改 Word 文档”变成了在数据库里管理资产。翻译过的句子拆分为句段，进入 Translation Memory（翻译记忆库），下次遇到相似句子自动提示术语进入 Termbase（术语库），强制保持一致风格规则进入 QA 引擎，自动校验

再后来出现了 TMS（Translation Management System）——XTM、SmartCAT、languageX。把 CAT 工具变成云端协作系统：版本控制、多人协作、自动化流水线、统一资产管理。

不是 Word 错了。Word 在它的尺度上仍然好用——写一封邮件、起草一份合同。但当翻译规模变大、复用变多、流程变复杂时，更底层的系统会胜出。

Video-as-code 这场迁徙，几乎是这套剧本的视觉版重演：

Hyperframes 那个项目包结构（HTML + 数据属性 + 资产文件夹），几乎就是 TMS 项目包结构的视觉版。同样是把散件的创作活动结构化成可被批量、被复用、被 agent 操作的资产。代码做视觉，不是更”高级”，它只是把视觉变成了系统。这些是 Premiere 和 AE 这一代工具结构上做不到的，就像 Word 结构上做不到 TM 和术语库一样。

三、Remotion 和 Hyperframes，押的是两种未来

四家工具表面看是技术路线之争，深层是对未来工作流的两种押注。

Remotion 的押注：未来十年，软件主要由人写 React + AI 辅助。AI 是副驾驶，人是司机。所以工具的最佳形态是给开发者一个强大的 React 框架。

Hyperframes 的押注：未来十年，软件主要由 agent 生成内容、人审校。agent 是司机，人是 QA。所以工具的最佳形态是用 agent 最熟悉的语言（HTML） 来表达视觉对象。

这背后有一个核心的认知判断，HeyGen 的CEO Joshua Xu 说得很直白（以下是社区对他观点的转述，大意如此）:

大语言模型是在 HTML 上训练的，HTML 是它们的母语。React + Remotion 在训练语料里只占很小一部分。所以让 agent 写视频，HTML 是最低摩擦的语言。

这句话翻译成翻译行业的语言就是：模型的母语是 HTML，让它写 React 是让它写第二语言。

而这两种押注，几乎完美对应翻译行业演化的两个阶段：CAT 时代：人主导翻译，工具辅助记忆和术语 → 对应 Remotion 时代，开发者主导，AI 辅助生成post-editing 时代：机器主导翻译，人做译后编辑 → 对应 Hyperframes 时代，agent 主导生成，人做审校

翻译行业用了大概20-30年，从 CAT 走到 post-editing，视频赛道现在正在迈进这一步。

两个时代会共存——就像今天的翻译行业里，CAT 工具和 post-editing 工作流同时存在，不同体量的项目用不同的工作流。

但如果让我下注，我赌 agent-first 这条线长期会更主流。理由不是技术更优，是经济结构更优：当 agent 写视频的边际成本接近零，”批量”会变成视频生产的默认模式，而批量的工作流必然偏向 agent-led。

四、几点个人观察

1、确定性渲染才是这个赛道的护城河

四家工具全部强调 same input = same output——同样的输入，永远渲染出一模一样的输出。

这跟生成式视频（Sora、Veo、可灵）是两个完全不同的物种：生成式视频追求”惊喜”——同一个 prompt 跑两次，结果不一样，这是它的特性video-as-code 追求”可控”——同一个项目跑两次，必须一模一样，这是它的底线

媒体容易把这两类归类为”AI 视频”，是错的。它们解决的是不同问题：生成式视频是创作，video-as-code 是生产。

一个对应短片、广告、艺术表达，一个对应批量、模板化、品牌一致性。前者像油画，后者像活字印刷——几乎是两个行业。

2、PPT、海报、网页、视频正在合流

这是最容易被忽视的一个信号。

去年我把 PPT 全切到了 HTML——Claude 写 HTML 比写 PPT 强太多。今年用 Claude design 做海报，输出也是 HTML。前几天用 Claude design 做视频，输出还是 HTML。

四种以前完全独立的视觉产物，正在变成同一个 HTML 工作流的不同输出形态：静态 + 单页 = 海报静态 + 多页 = PPT静态 + 互动 = 网页动态 + 时间轴 = 视频

底层是同一套语言（HTML/CSS/JS），同一个 agent 接口（MCP），同一种项目结构（设计系统 + 组件 + 资产）。

这意味着什么？未来三年，会有一波”视觉全栈”工具出现，把这四种输出形态收进同一个产品里。Anthropic 的 Claude design 已经在往这个方向走，Hyperframes 已经支持 web-to-video（把网页转成视频）。

合流之后，设计师、剪辑师、PPT 制作者、网页前端这几个一直分着站的工种，会被重新洗牌。

3、做视频的新机会窗口到来

传统视频工作流的入口是 Premiere、AE，门槛是一套设计师/剪辑师才会的肌肉记忆。video-as-code 的入口是 prompt + HTML + 一点 vibe coding 的素养——跟做 PPT 的难度差不多。

会一点 HTML、能用 Claude Code 跑 npx 命令的非技术背景人，反而比传统的视频高手更早摸到这条路。原因很简单：没有旧工具的肌肉记忆，光脚的不怕穿鞋的。

4、母语问题，决定了这场战争的胜负

回到 Joshua Xu 那个判断——HTML 是 LLM 的母语。

这是这个赛道的一个深刻认知。它说的不是技术问题，是生态问题：HTML 是网页的母语，二十年来全人类写了海量的 HTML 文档React 是 React 的母语，十年来开发者写了大量的 React 代码

模型从训练语料里学到的，前者远远多于后者。

所以当你让 agent 写视频，它写 HTML 几乎不会出错，写 React 就会出现各种 hallucination。这个判断如果对，那么三年后我们会看到：所有 agent-first 的创作工具，输出都会向 HTML 收敛。Remotion 这条 React 路线不会消失，但会被压回一个垂直的 niche——专业视频工程师的领地。

我之前说过一句话：AI 翻译的昨天，是 AI 编程的今天。今天再补一句：翻译的昨天，也是视频的明天。

下一个轮到的会是什么？