
由此 Skill 渲染
一个免费的 HyperFrames 模块,把一个产品功能变成一段 3D 高光时刻。一张深色卡片中间开了个圆形窗口,框住一颗点阵球体;卡片从右侧入场,悬浮,绕球体转完整一圈,再从左侧出场,镜头运动来自 Blender 导出。功能标题、说明、强调色和环绕角度都是变量。
更新于 2026年11月2日
你将得到
- 一支 10 秒、1920×1080 的 MP4,带一张 3D 功能卡
- Blender 导出的镜头运动,逐帧精确回放
- 标题、说明、强调色和环绕角度都可用变量调整
适合
- App 和 SaaS 发布里的功能亮点
- 更新日志和版本说明短片
- 产品导览里的插入片段
不适合
- 一张卡上放好几个功能
- 真实的 App 截图(它展示的是文字,不是界面)
关于此 Skill
/orbit-card 给我们智能家居 App 的新功能做一张环绕卡:标题「Evening wind-down」,说明「Lights dim, blinds close and the heat drops at sunset.」,强调色 #E8735A。
每个功能都值得单独亮相。Orbit Card 把一个功能放在一张卡片上:一个标题、一句话、一条强调线,围绕着一扇圆窗,窗里是一颗旋转的点阵球体。镜头路径来自 Blender 绑定,所以入场、悬浮、整圈环绕和出场都像实拍的运镜,而不是手调的动画。
工作流程
- 提需求:告诉助手卡片写什么:功能标题、一句话说明和一个强调色。
- 搭建:它把模块放进一个 HyperFrames 项目,把你的文案和配色填成渲染变量。
- 预览:它先检查几帧,再用
npx hyperframes render渲染出 1920×1080 的 MP4。 - 复用:变量都在一个 JSON 文件里,换一句标题或换一个品牌,再渲染一次就行。
小贴士
- 一张卡只讲一个功能。要做功能清单,就每个功能渲染一次,再剪到一起。
- 说明控制在十二个词以内;它在卡片上字很小。
- 从品牌配色里挑强调色;分割线和球体光晕都用这个颜色。
- 环绕角度设成 180° 转得更快,设成 720° 更炫。
开源
这是 HyperFrames 模块库里的一个模块。由 HeyGen 和 HyperFrames 贡献者制作(heygen-com/hyperframes),以 Apache License 2.0 开源。下载的是带全部素材、可直接渲染的模块;HyperFrames 本身从 npm 运行。
开始前需要准备
- 你需提供
- 一个功能名、一句简短的介绍和你的强调色。
- 依赖
- Node.js 22 或更高版本——必需 · FFmpeg——必需
- 外部费用
- 没有。HyperFrames 免费开源,在你自己的电脑上渲染。
- 最近测试
- v1.0.0 —
用户评价
还没有评价。安装这个 Skill,成为第一个评分的人。
常见问题
卡片上能放截图吗?
默认不行:卡片上围绕球体的是一个标题和一句话。助手可以改 HTML 加一张图,但这个模块本来就是为短文字设计的。
怎么做功能清单?
每个功能换一组变量渲染一次,再把片段剪到一起;每段都从空画面开始、以空画面结束,所以接得很干净。
为什么免费?
这是 HeyGen 和 HyperFrames 贡献者做的开源 Skill。我们原样上架,样片是在我们自家品牌 Solenne 上运行它做出来的。






