写 HTML 就能渲染视频：HeyGen 开源 5.5 万星 agent 框架

AI 编码 agent 已经会写网页、写幻灯片，HeyGen 决定让它们把"渲染视频"也接管了：开源框架 HyperFrames，用一句话讲就是"写 HTML，渲染视频，为 agent 而生"。54.7 千星、Apache-2.0 协议、TypeScript 实现，Node 22+ 即可本地跑，也可以只当作托管渲染内核嵌进你自己的产品。

它是什么

HyperFrames 把 HTML、CSS、媒体文件和可 seek 的动画编译成确定性的 MP4 视频。关键词是"确定性"：同样的输入永远得到逐帧一致的输出，这对 agent 自动化至关重要，因为 agent 需要预览、lint、修改、再渲染的闭环，随机性会让这个循环失效。

它天然有三种用法：本地 CLI 直接渲染；给 coding agent 装 skills 让它自主完成"规划视频、写 HTML、接动画、加媒体、lint、预览、渲染"整条生产流；或者只把它当渲染内核，接进你自己的创作平台。

21 个技能的组织方式

agent 集成是它最用心的部分。框架自带 21 个按需加载的技能，入口 /hyperframes 是路由器和能力地图：任何"给我做个……"的请求，它先判断是视频、幻灯片还是移植任务，再指向对应的领域技能。

Claude Code 两条命令装好：

claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes

Codex、Cursor、Gemini CLI、IBM Bob 等支持 skills 的 agent 用：

npx skills add heygen-com/hyperframes

装完试着说一句："用 /hyperframes 做一个 10 秒的产品介绍，标题淡入，背景视频，配一点轻音乐。"剩下的就是看 agent 自己走完生产循环。

快速上手（人类版）

不通过 agent 也可以直接用 CLI：npm 安装 hyperframes 后本地渲染，官方还有个 Playground 可以在浏览器里试，组件目录（数据图表、字幕、转场等 blocks）在文档里按类目可查。

适合谁用

做程序化视频的团队：批量生成产品介绍、数据播报、课程片段这类"模板 + 数据"型视频，确定性渲染让 CI 也能出片。

agent 工作流搭建者：21 个技能的分层加载（路由器按需安装工作流）本身就是 agent 技能组织方式的范本，值得抄。

HeyGen 生态观察者：这是 HeyGen 把内部渲染能力开源化的动作，虚拟人视频的生产闭环很可能长在这个内核上。

和 Remotion 这类"React 写视频"的先驱相比，HyperFrames 选了更低的门槛（HTML/CSS 而非 React 组件）和明确的 agent-first 定位，技能、路由、确定性与 lint 预览一应俱全。对想让 agent 接管视频产线的团队，这是一个可以直接落地的起点。