Loading...

编程 AI 的视频工具 · HyperFrames

让编程 AI 连视频也一起做:产品宣传片、功能讲解视频、演讲开场,它都交出了成片

把 HeyGen 免费开源的 HyperFrames 装进 Claude Code 或 Codex,AI 就会读你的网站和代码,搭好镜头,导出 MP4 视频。成果以项目文件夹的形式留下,一句文案、一个镜头都能回头再改。从 JetBrains 到独立开发者,再到韩国 YouTuber,我们收集了真实用过的例子。

2026年10月6日·4 个案例

JetBrains 在官方账号上发布的 Kotlin 宣传视频。来源:JetBrains X

最上面这支,是 JetBrains 9 月 22 日在官方 X 账号上发布的 Kotlin 宣传视频。JetBrains 写道:“This product video was generated entirely by Claude Opus 5.5.”(这支产品视频完全由 Claude Opus 5.5 生成。)据介绍,员工只是把 HyperFrames skill 交给 Opus 5.5,再让它去看 kotlinlang.org 而已。

随着用 Opus 5.5 做的宣传视频大量涌现,背后用到的 HyperFrames 也重新火了起来。进入 10 月,它在 GitHub 上的星标以每天 500 个左右的速度增长,已超过 5.7 万;npm 下载量在 9 月 28 日那一周达到 81 万次,创下最高。 10 月 5 日,还推出了能和 AI 在同一条时间线上改视频的桌面应用。

HyperFrames 不是直接生成画面的视频模型。AI 用 HTML 搭好镜头,HyperFrames 把页面一帧一帧定格拍下,再合成 MP4。成果以项目文件夹的形式留下,一句文案、一个镜头都能回头再改。 如果说Opus 5.5 宣传片那篇里是一段提示词做出一支片子,这里的案例则是装好一次工具,下一支视频还能接着用。

Reference 01Social SDK 的作者、15 岁的开发者 Leo

每个镜头放什么由他亲自定,AI 做的发布视频在 X 上播放超过 12 万次

他发布了开源项目 Social SDK,让应用能轻松接入社交平台发帖功能。56 秒的发布视频是用 HyperFrames 做的,在 X 上播放超过 12 万次。 他说自己主要用 Opus 5.5,难做的镜头交给其他模型慢慢磨,还单独发帖分享了制作心得,也不讳言缺点:“tons of bugs”(bug 很多)。

Leo 分享的制作心得(七条里的四条)
  1. 1DO NOT LET THE AGENT CHOOSE WHAT TO PUT. I told specifically about each part of the video by myself.
  2. 2Give the agent access to your codebase and make the project there. This let's the agent find existing components, and reuse them, or change them for the video.
  3. 3Give your agent a component library of animations.
  4. 4Have a good landing page. This is one of the best references for a launch video your agent can have.

第一个镜头里那段类似 Slack 的对话,也是他亲口要求的:“I want the first part to have a chat thread like slack”(开头部分我想要一段像 Slack 那样的聊天对话)。

Reference 02开源项目 TanStack AI 维护者 Alem Tuzlak

交给它一个 PR,AI 就做出这个功能的 30 秒讲解视频

TanStack AI 每发布一个新功能,都会在官方账号上发一支简短的讲解视频。有人问是怎么做的,维护者 Alem Tuzlak 回答“It uses this skill”(用的就是这个 skill),并公开了自己写的 skill。 这个 skill 会读 PR 和代码,找出品牌色、字体和 Logo 来用,每个中间步骤都要人点头。他介绍说,自己会把成品从头看到尾,说出哪里不满意,AI 就改好重新渲染。

Alem 公开的 skill(把 PR 变成宣传视频)

https://github.com/AlemTuzlak/skills/tree/main/skills/hyperframes-video

skill 的第一行写着“Turn a PR into a rendered short-form promo video with a hook, code moments, and CTA, using HyperFrames.”,意思是用 HyperFrames 把一个 PR 变成由开场钩子、代码镜头和行动号召组成的短宣传视频。

Reference 03比特币 YouTuber Nettalba · 2.7 万订阅

演讲翻译视频的开头,接上了一段韩元价值图表动起来的韩语开场

他把 Saifedean Ammous 在首尔的演讲翻译后上传,视频开头的 1 分 30 秒,换成了用 HyperFrames 做的韩语动态图形。他本人在 X 上写道“클로드 + 하이퍼프레임 = 비트코인 강연 영상”(Claude + HyperFrames = 比特币演讲视频);有人回复问是不是把 Claude 折腾了一番才做出来的,他答:“계속 패고 있습니다”(还在一直“揍”它呢)。

开场中的一幕:'₩0.974' 数字旁边,排着一年比一年短的韩元价值柱

观众没有提到 HyperFrames,只是留言说:“네딸바님 영상 퀄리티가 점점 높아지네요”(Nettalba 的视频质量越来越高了)。

Reference 04艾美奖得主、视频制作人 Sam Wasserman

在应用操作录屏上叠加步骤卡片和逐词字幕,做成一支教程

他公开了自己的开源应用 Blockout,用来在拍 AI 电影之前先规划走位和机位;第二天就发了一支 3 分 26 秒的使用教程。真实的应用录屏上,叠着步骤卡片、面板名称和逐词高亮的字幕。他本人写道,HyperFrames 帮忙做出了(help make)这支视频。

用过的人怎么说

从 Remotion 这类其他视频代码工具换过来的人,欢迎它的成品效果和好改。不满集中在 bug、渲染慢、渲染结果和预览不一致,以及做出来的视频大同小异。

好评

  • “I just found hyperframes better in the last few months of constant usage, although remotion code animations do seem nicer because of all the plugins etc.”

    给 TanStack 做视频连续用了几个月,觉得 HyperFrames 更好。不过他也补充说,Remotion 插件多,代码动画确实更好看一些。

    Alem Tuzlak · Xx.com
  • “15분쯤 지났을 때 결과가 기존 리모션보다 자막 싱크와 전환이 더 좋아서 바로 갈아타기로 결정했습니다.”

    大约 15 分钟时,出来的结果字幕同步和转场都比原来的 Remotion 好,于是当场决定换过来。这位韩国 YouTuber 用了两个月 Remotion 后改用 HyperFrames;同一支视频用两个工具分别导出,文件大小从 21.6MB 降到 14.5MB(本人测量)。

    「不会写代码的文科开发者」· YouTubeyoutube.com
  • “It was so great to have a studio UI for the last-mile video fine-tuning.”

    一位儿童绘本平台的创始人在没有预算的情况下做公司介绍视频,她说最后的精修能在编辑界面里亲手调,这点很好。

    Feifei Qiu · Xx.com
  • “i tried it and edited my reel without any 3rd party paid service and results are seriously shocking”

    没用任何第三方付费服务,就把 Reels 剪好了,结果真的让人吃惊。

    @fahadmughal9795 · YouTube 评论youtube.com

不足之处

  • “I tried it. It takes forever to render and the result is so mid. I could've just edited by myself and save so much more time”

    渲染慢得没完,结果也就一般般,还不如自己剪,能省下多得多的时间。

    @miltonnolan · YouTube 评论youtube.com
  • “I've found hyperframes is too prescriptive and restrictive for Opus 5.5. It gets better outputs by itself”

    对 Opus 5.5 来说,HyperFrames 的规矩太死,模型自己做反而效果更好。HeyGen 则发布了相反的自家实验:给出规则时,渲染次数和 token 成本都降低了。

    @adityah8717 · YouTube 评论youtube.com
  • “In the browser preview every caption was there. The audio was fine. The render said success.”

    渲染一支 31 秒的视频,预览里有的字幕一条都没了。他说原因是渲染器并不播放视频,而是逐帧跳着截取;他改成把动画的起始值和结束值都写明,问题就解决了。

    Ayo · Xx.com
  • “I have been testing HyperFrames with AG and Codex, but no avail so far as it just doesn't suit me for anything other than graphs and overlays.”

    用好几个 agent 测试过,但除了图表和叠加层,别的都不适合自己的工作。

    u/Little-Specialist286 · Redditreddit.com

怎么开始

  1. 1

    装好 Node.js 22 及以上和 FFmpeg,打开 Claude Code 或 Codex

    HyperFrames 本身免费开源,在自己电脑上渲染也不花 HeyGen 点数。要花钱的是编程 AI 的套餐。可以在 Claude Code、Codex、Cursor、Gemini CLI 这类编程 agent 里使用。

    HyperFrames 仓库 ↗
  2. 2

    在要做视频的文件夹里,粘贴官方请求

    AI 会安装 skill、提出方向、问清还缺什么,然后做出视频。

    HyperFrames 官方文档里的第一条请求

    Set this folder up for HyperFrames and make me a video. 1. If the HyperFrames plugin is installed, use its bundled skills and launcher. Otherwise run: npx hyperframes skills update 2. Then, using /hyperframes, make a 10-second product intro for https://example.com 3. Open the local preview when it is done and tell me the project folder.

    把 https://example.com 换成你自己产品的网址。

  3. 3

    把第一版从头看到尾,说出要改的地方

    官方文档也说,第一版不是成品,要把故事、事实、文字、声音各检查一遍。在 10 月 5 日推出的桌面应用 HyperFrames Studio(macOS、Linux,用 HeyGen 账号登录)里,可以直接在画面上指出或圈出要改的地方。

    下载 HyperFrames Studio ↗

做竖版发布视频的请求

运营效率工具导航网站的 Shushant Lakhyani,附上一支自己喜欢的发布视频当参考,写了这段请求。这是少数把提示词完整公开的案例之一。

Shushant Lakhyani 写的请求

/hyperframes use the hyperframes skill. I've attached a good launch video here. I want you to go through it perfectly and completely and take inspiration from it perfectly and completely and create a new better and different launch video in 9:16 aspect ratio perfectly and completely for my best productivity resources directory website: https://bestproductivityresources.com/ Make it fast paced for best and high audience retention. Add transitions, effects, SFX, VFX, and background music as required and wherever required.

把网址换成你自己的,再附上要参考的发布视频文件。

需要准备

  • Node.js 22 及以上、FFmpeg
  • Claude Code、Codex 这类编程 AI
  • 你的产品网站或代码文件夹

分享此参考

这个参考对您有帮助吗?

每周精选参考直达您的邮箱