// 01 HyperFrames 是什么
HeyGen 面向 AI Agent 开源的视频渲染框架
HyperFrames 来自 HeyGen 团队维护的开源项目，GitHub 仓库名称为 heygen-com/hyperframes。它不是 HeyGen 传统意义上的数字人生成产品，而是一个面向开发者和 AI 编程 Agent 的 HTML 视频渲染框架。官方描述很直接：用 HTML、CSS、媒体素材和可 seek 的动画来生成确定性的 MP4 视频。项目采用 Apache-2.0 License，公开仓库显示主要使用 TypeScript 开发。
它面向的用户包括 AI Agent 开发者、视频自动化团队、内容工程师、营销增长团队、技术文档团队和需要批量生成视频素材的开发者。相比传统剪辑软件，HyperFrames 的重点不是给人手动拖拽时间线，而是让 Claude Code、Cursor、Gemini CLI、Codex 等编程 Agent 能用熟悉的 Web 技术栈写出视频合成文件，再通过 CLI 预览、检查和渲染。
它解决的问题
AI 生成视频的难点不只在模型本身，还在可控性、可复现和自动化。普通文生视频工具适合生成镜头素材，但要做产品发布视频、代码演示、数据动画、字幕节奏、品牌模板和批量内容流水线时，提示词生成很难保证每次一致。HyperFrames 把视频当成 HTML 页面来写，用数据属性定义片段时间、轨道和画布尺寸，再用 GSAP、CSS、Lottie、Three.js 等动画系统控制帧级效果。
这种思路特别适合 AI Agent，因为大模型本来就擅长生成 HTML、CSS 和 JavaScript。与其让 Agent 学习专有剪辑软件格式，不如让它用网页语言描述镜头、字幕、转场和音频，然后交给确定性渲染器输出 MP4。
核心能力
- 支持将 HTML、CSS、图片、视频、音频和 seekable animation 渲染为确定性 MP4。
- 提供 CLI，可用于创建项目、浏览器预览、lint 检查、inspect 和本地渲染。
- 官方快速开始要求 Node.js 22 及以上版本，并依赖 FFmpeg 完成视频编码。
- 支持 GSAP、CSS 动画、Lottie、Three.js、Anime.js、WAAPI 和自定义 frame adapter。
- 提供 Agent Skills，可通过 npx skills add heygen-com/hyperframes 安装，让 Claude Code、Cursor、Gemini CLI、Codex 等工具理解视频制作流程。
- 官方 Catalog 提供可复用区块和组件，覆盖转场、社交叠加层、字幕、图表、地图和视觉特效。
- 开源仓库包含 core、engine、producer、studio、player、shader-transitions、aws-lambda 等包，支持从本地渲染到分布式渲染扩展。
如何使用
HyperFrames 的使用方式更接近开发工具，而不是网页注册型产品。开发者可以选择两条路径：一种是给 AI 编程 Agent 安装 HyperFrames Skill，然后直接描述要制作的视频；另一种是手动用 CLI 初始化项目、编写 HTML composition、在浏览器中预览并渲染为 MP4。
- 准备 Node.js 22 及以上环境，并安装 FFmpeg。
- 如果使用 AI Agent，执行 npx skills add heygen-com/hyperframes。
- 让 Agent 根据需求创建视频，例如产品介绍、代码演示或数据动画。
- 如果手动使用，可执行 npx hyperframes init my-video 创建项目。
- 使用 npx hyperframes preview 在浏览器中实时预览。
- 确认无误后执行 npx hyperframes render 输出 MP4。
典型使用场景
在产品营销场景中，团队可以用 HyperFrames 生成产品发布视频、功能更新短片和社交媒体宣传片。品牌样式、字体、配色和字幕节奏可以写成可复用模板，方便后续批量生成。
在技术内容场景中，它适合制作 PR walkthrough、代码 diff 动画、文档转视频和教程解说。Agent 可以读取仓库、生成脚本，再把代码变化、字幕和旁白组合成可发布视频。
在数据可视化场景中，HyperFrames 可以制作 chart race、地图动画、指标变化短片和报告摘要。相比手工剪辑，HTML 与代码驱动更适合自动化流水线。
与同类工具的差异
HyperFrames 与 Remotion 都使用浏览器和 FFmpeg 路线生成视频，但官方比较强调二者的作者模型不同：Remotion 以 React 组件为核心，HyperFrames 选择普通 HTML、CSS 和可 seek 动画。这个差异对 Agent 很重要，因为普通 HTML 文件更容易被 AI 直接生成、检查和修改，也更容易在没有复杂构建流程的情况下预览。
如果团队已经有成熟 React 视频工程，Remotion 仍然更顺手；如果目标是让 AI Agent 快速写视频、改视频、批量渲染视频，HyperFrames 的 HTML 原生路线更有优势。
价格与真实局限
HyperFrames 本身是开源项目，Apache-2.0 License，没有公开的按次渲染费用或商业使用门槛。实际成本主要来自本地机器、CI、云渲染、素材生成、TTS、字幕和模型 API 调用。如果团队使用托管 Studio 或第三方云服务，还需要单独评估对应费用。
它的优势是可控、可复现、Agent 友好、适合自动化；局限是上手门槛高于普通视频剪辑工具，需要理解 HTML、CSS、动画时间线、FFmpeg 和命令行。它也不是文生视频模型，不能凭空生成复杂真实镜头素材，而是更适合作为视频合成、排版、动画和自动化渲染引擎。对于专业成片，它适合做工程化视频生产底座，仍需要人来把关脚本、画面审美和最终质量。
