Google Antigravity
Google Antigravity 是 Google 基于 VS Code 构建的 agent 优先 IDE。它的 agent 会根据你的提示自动发现和加载 HyperFrames skills，因此你无需记住框架内部结构即可获得正确的合成。
安装 skills
将 HyperFrames skill 包安装到你的项目中：
npx skills add heygen-com/hyperframes
这会将 skill 目录放置在工作区根目录的 .agents/skills/ 中——Antigravity 扫描工作区范围 skills 的位置。
💡 Tip
如果你希望 skills 在所有 Antigravity 项目中可用，请改为安装到全局范围：
npx skills add heygen-com/hyperframes --agent antigravity --global全局 skills 位于
~/.gemini/antigravity/skills/中，在每个工作区中加载。
验证 skills 是否已安装：
ls .agents/skills/
你应该看到类似 hyperframes/、hyperframes-cli/、gsap/、tailwind/ 等目录——每个目录包含一个 agent 按需读取的 SKILL.md。
Skills 在 Antigravity 中的工作方式
Antigravity 使用语义匹配——当你输入提示时，agent 会将其与每个可用 skill 的 description 字段进行比较，并加载相关的 skill。你不需要通过斜杠命令调用 skill（尽管你可以通过名称来精确引用）。
| 你说 | Agent 加载 |
|---|---|
| "创建一个 10 秒的产品介绍视频，带字幕" | hyperframes、hyperframes-cli |
| "给标题添加 GSAP 缩放弹出效果" | gsap |
| "使用 Tailwind 进行样式设置" | tailwind |
| "转录这段音频并添加字幕" | hyperframes-media |
| "添加闪烁扫过过渡效果" | hyperframes-registry |
Skill 只在匹配时才注入 agent 的上下文窗口——这保持了上下文的整洁和专注。
ℹ️ Note
为了获得最佳结果，请在提示中提及 "HyperFrames" 或 "composition"，以便 agent 立即匹配正确的 skills，而不是猜测通用的网络视频约定。
创建和预览视频
创建项目脚手架
打开 Antigravity 的集成终端并运行：
npx hyperframes init my-video
cd my-video
向导会引导你完成示例选择和媒体导入。Skills 会自动安装在新项目中。
启动预览服务器
npx hyperframes preview
这会在你的浏览器中启动 HyperFrames Studio 并支持热重载——对 index.html 的编辑会立即显示。
给 agent 发出提示
在 Antigravity 的 agent 侧边栏中，描述你想要的视频：
为我的 SaaS 应用创建一个 15 秒的深色主题产品介绍视频，带淡入标题、嗨风格字幕和闪现过渡到 CTA。
agent 读取 HyperFrames skill，编写带有 data-* 属性和 GSAP 时间线的有效 HTML，并将其保存到你的项目文件中。预览会自动更新。
迭代
像视频编辑器一样与 agent 对话——不要从头重新提示：
把标题放大 2 倍并将过渡改为甩镜。
在 0:03 添加一个下方三分之一字幕条，显示我的名字。
将背景替换为 assets/hero.mp4。
渲染
npx hyperframes render --output output.mp4
在 Manager 视图中使用多个 agent
Antigravity 的 Manager 视图 让你并行协调多个 agent。对于复杂的多场景视频，你可以分配工作：
- Agent 1： 创作介绍场景和过渡
- Agent 2： 生成 TTS 旁白和字幕时间
- Agent 3： 构建数据可视化场景
每个 agent 独立获取相关的 HyperFrames skills。当所有 agent 完成后，使用 data-composition-src 引用将输出合并为单个 index.html。
MCP 替代方案
如果你偏好零安装的云端创作，Antigravity 支持远程 MCP 服务器。添加 HyperFrames MCP 连接器，无需 CLI 即可创作和渲染合成——请参阅 Antigravity 的 MCP 文档了解你版本中的确切设置步骤，然后使用服务器 URL：
https://mcp.heygen.com/mcp/hyperframes
在提示时通过 OAuth 使用你的 HeyGen 账户授权。请参阅 HyperFrames MCP 指南了解工具和提示的完整详情。MCP 在云端处理渲染；CLI 提供本地控制。
Agent 指令文件
使用 npx hyperframes init 创建的 HyperFrames 项目会自动生成 CLAUDE.md 和 AGENTS.md——这些文件为 agent 提供 skills 之外的额外合成上下文。
AGENTS.md— 跨 agent 约定。无论你选择哪个模型（Gemini、Claude 或其他），Antigravity 都会读取此文件。CLAUDE.md— 当 Antigravity 的 agent 使用 Claude 模型（Sonnet 或 Opus）时读取，提供 Claude 特定的项目指令。
提示
- 当精度很重要时，按名称提及 skill。 "使用 hyperframes skill 添加颗粒叠加"比"添加颗粒叠加"更可靠，尤其当 agent 加载了许多 skills 时。
- 渲染前使用
npx hyperframes lint。 检查器会捕获结构性问题（缺少class="clip"、未注册的时间线、静音视频违规），这些在复杂编辑中 agent 可能会遗漏。 - 安装 registry blocks 以获得高级效果。 运行
npx hyperframes add shimmer-sweep安装预构建 blocks，然后让 agent 将它们接入你的合成。 - 保持预览服务器运行。 Antigravity 的文件监视器 + HyperFrames 的热重载意味着你可以实时看到每次 agent 编辑。