Skill 广场
代码化视频生成与编排 Skill

代码化视频生成与编排.Skill

@heygen-com/hyperframes-1adf5

4.8优秀AI 评分基础检查通过源自 GitHub

这是 HeyGen 开发的代码化视频框架 HyperFrames 的总入口中枢。它颠覆传统时间轴剪辑方式,将视频定义为带有 timing 属性的 HTML/DOM 结构,支持精准到帧的 CSS、GSAP、Anime.js 等动效渲染。本模块负责分析用户原始诉求(包括官网宣介、Remotion代码迁移、GitHub PR解析、口播切片贴片、卡点动效等),自动采集创作意图并生成 BRIEF 规格书,调度对应的子工作流与领域技能,驱动 CLI 完成从草稿、时间轴编排、音频混音到无损渲染的全流程。

AI工作流前端工程师与全栈开发者技术型内容创作者与自媒体团队产研产品经理与开发者关系(DevRel)工程师2026-09-23 更新main

代码化视频生成与编排

这是 HeyGen 开发的代码化视频框架 HyperFrames 的总入口中枢。它颠覆传统时间轴剪辑方式,将视频定义为带有 timing 属性的 HTML/DOM 结构,支持精准到帧的 CSS、GSAP、Anime.js 等动效渲染。本模块负责分析用户原始诉求(包括官网宣介、Remotion代码迁移、GitHub PR解析、口播切片贴片、卡点动效等),自动采集创作意图并生成 BRIEF 规格书,调度对应的子工作流与领域技能,驱动 CLI 完成从草稿、时间轴编排、音频混音到无损渲染的全流程。

它会先理解你的原始内容和目标,再按清晰的步骤完成处理。你不需要学习复杂命令,也不用理解背后的技术细节。

常见场景

它能帮你做什么?

01

产品官网宣介短片自动化制作:输入 SaaS 官网 URL 或 Figma 界面,系统提取关键视觉与卖点,编排带缩放动效和卡点转场的产品首发视频。

02

GitHub PR 改动可视化讲解:输入代码变更记录或 Pull Request 链接,提取差异并生成动态代码高亮打字与架构对比的解说短片。

03

Remotion 视频工程轻量化重构:把现有的 React Remotion 视频工程无缝迁移至 HTML/DOM 架构,利用 HyperFrames CLI 执行高并发批量渲染。

三步完成

怎么使用

1安装 Skill

把右侧安装请求发给你的 AI。

2说清楚目标

告诉 AI 你想完成什么,或直接贴入内容。

3检查结果

按需要继续调整语气、范围或格式。

复制就能用

你可以直接这样说

根据产品官网 https://my-app.dev 生成一段 45 秒的产品发布视频,包含功能动效和文字卡点。

将这个 GitHub PR #88 的重构差异制作成一段 30 秒的技术演示视频,突出核心逻辑变更。

把现有的 Remotion 视频代码重构成 HyperFrames HTML 组合结构,并执行 CLI 渲染检查。

适用人群

适合谁?

前端工程师与全栈开发者技术型内容创作者与自媒体团队产研产品经理与开发者关系(DevRel)工程师动效设计师与自动化视频流水线搭建者

上手门槛

使用难度

专业

适合熟悉相关工具和专业流程的用户。

兼容范围

支持哪些 AI?

Codex可直接使用
Claude Code可直接使用
OpenClaw可直接使用
Hermes可直接使用
国内 Agent可直接使用

中文用户增强

Skill Px 做了什么?

中文说明简化使用方式补充中文案例整理安装流程降低理解难度