hyperframes是HTML吗

七种视频玩法，从苹果风到赛博朋克，全部用 hyperframes 生成，我花了二十四小时测试玩法分享给大家。第一种，苹果发布会级产品演示，不用 a e， 不 用 p r， 跟 ai 说做个苹果风格的产品视频十五秒十六比九极简，高级 ai 自动分镜写 html 加动画，一键渲染，质感直接对标官方。第二种，赛博朋克 h u d 界面故障风，打字机粒子流，全程代码搭建，不是画出来的，比 a e 更快更稳。 三种数据格式化，近速图， excel 直接丢给 ai， 一 句话，生成财经媒体风的动态柱状图，折线图，三 d 饼图，丝滑又专业。第四种，地图动画，旅游路线，病毒扩散，航线轨迹进入高德或 max， 地图路线精准，地理正确，从 ppt 直接变大片。第五种，三 d 场景动画，不用 blander， 让 ai 调用 r 三 f 生成三 d 场景，黄昏、霓虹、太空氛围随便换，关键是把参数暴露出来，玉兰里直接调，效率翻十倍。第六种， ui 操作演示 app 界面系统演示功能讲解， ai 自动拆镜头，先展示桌面，再点开软件按钮，点击弹窗弹出，不用画一个像素。其实 hyperframes 的 本质就是用 html 显示屏， ai 当导演，你只需要动嘴，从今天起，告别 ae， 实现动效自由。

好了，大家好，这段时间 codex 相信很多小伙伴已经上手，开始用了一个非常好用的 openai 的 桌面端的一个 agent 工具。那么今天我想推荐一个 codex 里面的一个很强很厉害的一个做视频的插件叫 hyperframes， 它可以帮你按照网页的形式去做成一个视频，相当于用写前端的代码去做一个视频。首先我们知道 ai 在 写前端代码这块已经是非常厉害的，所以说这个插件就可以帮你 让你的 ai 像写代码一样去做视频。好的，那么我们就直接来试一试这个插件到底有多厉害。使用是在这边点击这个插件下面找到这个 hyperframes， 安装之后我们直接右上角点在对话中使用。这里我把 cloud 的 一个官网给他，我说一句，请根据这个网站做一个产品的宣传视频。好的，我们这里让他开始执行。好的，可以看到他跑了一段时间，他去官网去拉取了一些他需要用到的素材， 他接着在执行。好的，现在他已经生成好了，他已经跟我们说宣传视频已经生成好，在这里只需要点开就可以去预览。 并且他除了宣传片以外，他还使用了官方的素材，产品的文案，他还有动画的分镜，他还给这个宣传片加了旁白的阴鬼。让我们来一起看一下 the ai for problem solvers breakdown complex work together research write analyze data and code with expert level collaboration bring code to your desktop browser tools and team code by anthropic think bigger work clearer。 可以 看到整个效果还是非常好的，除了可能画面中有个别的小细节， 有一些排版上的问题，整个的效果你敢相信是我只用了一句话，没有经过任何修改它就出来的一个结果。随着 ai 进一步的发展，一开始的文字、 图片、视频以及到现在的全自动的生成视频以及剪辑， ai 的 发展只会越来越快，而且这个工具对于很多想要制作一些宣传视频、科普视频的人来说非常的有帮助。

大家好，这里是和老曹一起玩 ai， 今天给大家介绍一个做视频神器 hyperframes， 让你像写网页一样写视频。 hyperframes 是 开源的视频渲染框架，核心是 html 剪编辑模式，你可以用 g s a p l t c s s 动画甚至 three g s 自由组合，通过 puppeteer 加 f f i pad 实现无损捕捉合成，具有三大震撼体验， 第一，斜杠指令模式，对 ai 说想要什么，它立刻生成脚手架。第二，浏览器直接预览，点击渲染生成 mp。 四、第三，万物皆可视频化，自动抓取 url， pdf， csv cicd 自动生成更新视频， 它可以彻底融入代码工作流，视频可以被 git 管理，用 lanter 检查，成为 c i c d 的 一环。 headless 浏览器离屏捕捉计算成本极低，适合大规模并行生成个性化视频。一行命令启动 hyperframes in it 项目，自带五十多个开箱即用的组件块，从社交媒体遮照到炫酷着色器过渡，只需组合 data 属性就能完成。 尝试去 fork， 去创造属于你的视觉代码。在这个万物皆可代码化的时代，视频的未来属于会写 html 的 你，喜欢的朋友点个关注吧！

大家好，我是手软猫咪。今天这期视频，包括你现在看到的每一页画面，都不是用剪映、 pr 或者任何传统剪辑软件做的，它是 ai 写的一堆网页代码，然后直接渲染成了 mp 四，没有时间轴，没有关键帧，没有拖拽素材。 整个过程我只做了三件事，写文案、录音频，把东西丢给 ai。 可能你会问，这有什么意义？ ppt 谁不会做？意义在于这套流程一旦跑通 以后，出同类视频的编辑成本几乎为零，换个文案，换个音频，同样的风格，同样的质量，几分钟就能再出一条。接下来我把整个流程完整拆给你看。先说整体思路，就四步。 第一步，写文案，就是你现在听到的这些话，先把要讲的内容写出来。第二步，生成音频，你可以自己录，也可以用 ai 配音，录完之后用剪映之类的工具把气口和停顿剪干净。现在这句话就是我用阿里的 cosy voice 训练的自己的声音， 听起来我觉得还是挺不错的。导出一个干净的音频文件。第三步，生成字幕，把音频丢进剪映或者其他语音识别工具，导出 s r t 字幕文件， s r t 里面会标记每句话的起止时间，精确到毫秒，这个时间信息是后面的关键。 第四步， ai 生成画面，把 s r t。 字幕文件丢给 ai 编程工具，比如 color code 的 或者 open code 的 这些模型用什么都行。 这期就是用 deepsea 生成的，效果一样好，告诉他按照这些时间戳每句话，生成对应的 html 页面。最后用 hyperframes 这个开源工具把 html 渲染成 mp 四的视频， 核心逻辑就是 s r t。 字幕充当了画面和声音之间的桥梁。如果你不需要这么精确的音画对应关系，比如你只想快速出一版概念视频或者内部演示，那 s r t。 的 不用直接把文案大纲丢给 ai 就 可以 让它自己安排节奏。这里单独说一下 hyperframes 这个工具，因为它是让整套方案成立的关键一环。 hyperemax 是 high end 开源的一个项目，完全免费商用，也没有任何限制。他做的事情是你给他一个 html 文件，他用无头浏览器逐帧截图，然后拼成视频。你可能会说，我自己用录屏工具录 html 页面不也一样吗？ 不一样，录屏的问题是时间不好把控，你手动翻页，手动触发动画节奏很难精准。而 hyperremax 是 精准到毫秒的， 每一帧在什么时间显示什么内容，完全用代码决定，不需要人工介入。这意味着效率提升了一个量级。理论上，你一晚上可以批量产出一百期同等质量、同等美术水准的视频。 所以所有你能在网页上实现的效果， c s s 动画 g s a p 动效 three g s 三 d 场景都可以变成视频。而且因为是逐帧渲染，同样的代码永远产出一模一样的结果。 对于我们这个场景来说，最重要的一点就是它天然适配 ai， 因为代元模型最擅长写的就是 html， 你 让 ai 去操作视频剪辑软件的时间轴，它做不到，或者说很难实现。但让它写 html， 这是它训练数据里最多的东西之一。 至于 hyperframes 具体怎么安装，怎么调用，这些你完全不需要知道，你只需要知道它是干什么的，能做到什么程度就够了。把 hyperframes 的 项目仓库地址丢给 air 编程工具，告诉他用这个工具来渲染， 剩下的它自己搞定。我全程没有手动超过任何一条 hyperframes 的 命令，现在一步步看实际怎么操作。文案这一步没什么特别的，你可以自己写，也可以让 ai 帮你列大纲，然后自己调整，重点是确定好每个段落要呈现什么内容。文案就是你整个视频的骨架，音频部分 录音用任何你顺手的工具都行，录完后用剪映把气口和长停顿剪掉，让语音听起来连贯。不想自己录的话， ai 语音合成现在的质量也完全够用了。最终你需要的是一个干净的音频文件。 s r t 字幕。我自己是用剪映 把音频导入剪，应用语音识别功能自动生成字幕，然后导出为 s r t 格式。每一条字幕都有编号时间戳和对应的文字，这个文件就是你丢给 ai 的 核心输入。 最后是 ai 生成 stml， 打开你的 ai 编程工具，把 stml 文件丢进去，然后告诉他你想要什么样的视觉风格。 ai 会生成一整个 stml 文件， 里面的每句话都对应一段内容，时间轴全部绑定好了，预览一下效果，不满意就让 ai 继续调，满意之后让它渲染成 mp 四，再和你之前的音频合到一起，视频就完成了。 到这里你可能会想， ai 每次生成的风格都不一样怎么办？今天是赛博朋克，明天变成了水彩风，没法形成系列感，这确实是个问题，但解决方法很直接。先打磨一套模板，你先花时间跟 ai 反复调一版你满意的 html 模板 配色、字体、动画、节奏、布局方式都调到你满意为止。这个过程可能会来回好几轮，这是一次性的投入。 调好之后，你把这个模板文件保存下来，下次做新视频的时候，开一个新的 ai 对 话窗口，把两样东西丢给他，你的模板文件和新的 s r t 字幕或文案大纲，告诉他参照这个模板的风格和结构来生成新的内容。 这里要说一下为什么是给参照物，而不是写一份详细的设计规范文档，也就是所谓的 skill， 让 ai 去遵守。 原因很简单， skill 是 文字描述，每次生成都会受大模型随机性的影响，同样的规范文档，跑十次可能出十个稍有差异的结果，很难做到完全一致。但如果你给的是一个实际的 html 文件， ai 是 在看着具体的代码去仿照， 颜色值、间距、数值、动画参数全都是确定的，付现的精度高得多，所以这个用模板做参照物的步骤不可替代。最后聊一个观点， 在做这种 ai 生成的 ppt 或者视频画面的时候，瓶颈不再。模型能力在美术参考现在不管是 deepsea cloud 还是 gpt， 写 html 和 css 等能力都够用了。能不能做出好看的东西，差别在于你给他看了什么。 你跟 ai 说帮我做一个好看的 ppt， 他 只能给你一个泛泛的、不好不坏的结果。但你如果给他一张苹果发布会的截图，说按照这个风格来， 或者给他一个现成的设计稿，说参照这个配色和布局，结果就完全不一样。所以我的建议是，平时看到好看的画面就截图存下来，不管是网页、 app 界面、别人的视频截图、海报，甚至游戏 ui， 这些都是你的弹药库。 但要注意，截图只是参考，它的作用是帮你明确自己想要什么方向，真正落地的时候，还是至少用 ai 做出一个 demo， 调到满意为止。这个 demo 就是 我前面说的模板， 它既是你的美术标准，也是后续批量生产时的一致性锚点。总结一下今天的流程，文案、音频、 s r t 字幕、 ai 生成， html、 hyperframes 渲染成视频。整个方案的核心价值是可复制性。第一次跑通这个流程可能需要几个小时去摸索，但一旦有了满意的模板，后面每一条视频的制作成本就非常低了。 hyperture 是 完全开源免费 ai 编程工具，现在也有了很多免费或低成本的选项，感兴趣的话可以自己动手试一下。我是手仁猫咪，我们下期再见。

用 codex 生成视频，我觉现在 ai 开始把生产能力交到普通人手里。现在你看到的是我仅用几行字就让 codex 帮我制作出关于特斯拉的视频动画。我横向对比了 remotion 和 hyperframes， 你 们觉得哪个更好？

兄弟们， ai 写 html 还是只能出图，改一个字就要重做这个！三点四， k 星神器 studymail anything star anything 直接让本地 ai agent 生成真正可交付的 html， 号称本地 agencic html 编辑器，你的 ai agent 写 html， 你 直接发货。 亮点一，七十五个可组合技能模板，从 markdown、 csv join 直接生成 html。 亮点二，支持杂志换灯片、海报、小红书、推文原型、数据报告、 hyperframes 等九大版面。亮点三， 沙河实时预览流势渲染，所见即所得。亮点四，一键导出 wechat x 知乎 h t m l p n j 完全本地运行，零 api。 蜜奥再也不用为 ai 声称 h t m l 头疼了，记得点赞关注哦！

开源界又出了一个让我狂喜的视频框架， hyperframes， 让 ai 直接用 html 写视频。大家好，我是 ai 学习的老张。 hyperframes 一 句话，定位是写 html 渲染视频专为 agent 而生。视频的组合就是一个 html 文件浏览器里实时预览，命令行直接渲染成 mp。 四、没有构建步骤，写完就能跑。最妙的是 skills 这条线， 一行 npx 命令，装上 cloud code， cursor codex， 这些 agents 立马学会写合规的 composition 和 g s e p 动画。 data start 是 开始时间， data duration 是 持续描述， data track， index 是 轨道编号，时间轴一目了然。大模型一看就懂。 和 remotion 比，差别就一个核心决定， hyperframes 压的是 html， 压的是 react。 对 agent 来说， html 这条路顺得太多了，许可证更直接。 hyperframes 是 个 party， 二点零完全开源商用，零门槛。 remotion 超过小团队就要付费授权把视频生成重新定义成写 html。 ai 原声工具这个词终于算落到实处了。

现在越来越多团队开始用代码生成视频，以前做视频靠剪辑软件，现在很多视频可以直接用代码、数据和模板自动生成。这里面有两个很典型的工具， remote 和 hyperframes， 它们都能把代码变成视频，但底层思路完全不一样。 简单说， remotion 是 react 做视频， hyperframes 是 html 做视频。 remotion 更像一个面向工程团队的视频生成框架。 hyperframes 更像一个面向 ai agent 的 和前端页面的视频渲染系统。 先看 remote， 它的核心理念是视频，本质上也可以是一个 react 应用。你可以用组建写画面，用 props 控制内容，用帧数控制动画，再把整个 react composition 渲染成 mp。 四、对前端工程师来说，这个思路非常自然。 remote 最适合的场景是工程化、规模化的视频生产。比如一个 sars 产品要自动生成用户报告视频， 一个电商平台要批量生成商品广告，一个内容团队要根据数据库生成几千条短视频。这种情况下， react 组建化类型、系统状态管理和工程生态都会变成优势。 再看 hyperframes， 它的切入点不是 react， 而是 html。 你 可以把一个网页、一个数据看板、一个 css 动画，甚至一个由 ai 生成的页面直接作为视频画面来渲染。它更接近网页即视频的思路。 这也是 hyperframes 特别适合 ai 工作流的原因。现在很多 ai agent 很 擅长写 html、 css 和 javascript， 如果一个 a 卷的可以先生成一个完整网页，再把这个网页逐帧渲染成视频，那么从提示词到成片的路径就会更短。 所以两者最大的区别不是谁更高级，而是生产方式不同。 remotion 编工程系统强调 react， 组建可维护性、批量化和产品集成。 hfpms 偏页面渲染强调 html 资产，附用前端动画、网页转视频和 ai 生成效率。 如果你的团队本来就在用 react， 而且视频生成是产品的一部分，比如自动化模板、用户个性化视频、数据驱动视频，那 remotion 会更稳。如果你的目标是快速生成营销视频、讲解视频、 网页录制风格视频，或者希望 ai 直接参与视频制作， hyperframes 会更顺手。总结一下， remotion 是 用 react 构建视频应用， hyperframes 是 用 html 构建视频画面， 前者更像工程框架，后者更像 ai 时代的网页视频渲染管线。真正要选的不是工具名字，而是你的内容生产流程。 如果你要做稳定、可维护、可规模化的视频生成产品，优先看 remotion。 如果你要让 ai 更快地把网页、动画和视觉内容变成视频，优先看 hyperframes。 一个是 react first， 一个是 html first 代码。生成视频的下一步 不只是自动剪辑，而是把视频变成可以被工程化、被数据驱动、被 ai 自动生产的界面。

哥们，你写个 html 就 能直接渲染成视频，这就是 hyperframes， premiere， ae 全不用学浏览器，就是你新的渲染引擎。 你写的每一行代码都会变成视频里的一帧 css 动画，直接用就行。弹跳、过渡、渐变全都支持 gsf 时间线 精确到 ds 的 动画编排，一行代码控制整个时间轴。 three g s 三 d 场景，完整的三维渲染能力，场景一目了然。 webgl 着色器自己写片段，着色器做出连 ae 都做不出来的图形特效，还支持数据可视化，柱状图，数字滚动全都能炫 粒子系统也没问题，上百个粒子的动态效果一帧一帧输出，你想想网页上能做的所有效果，它都能拍成视频给你看。最牛的是什么？ 每帧都确定可复现同样的代码，每次渲染出来完全一样。 ai 可以 直接量产视频，这在以前根本不可能，而且完全开源 ipad 二点零 gitlab 已经一万六千多颗星了。这个方向我觉得非常值得关注，我后面继续深挖，关注不走丢。

嘿，大家好，我是白发难治。很多尝试用 ai 剪视频的人，最后都抱怨画面对不上节奏稀碎，效果就像开盲盒一样。过去几天，我深入了解了有有黑镜团队开源的视频编辑器 hyperframes， 它刚刚迎来了史诗级版本大更新，直接把全自动化视频生成能力推向了 风尘的高度。你以为 ai 剪辑还停留在用嘴随便说一句就指望它出大片的阶段？今天的内容彻底颠覆你的认知，我将直接带你打通这套全自动精 剪口播，加上三 d 动态效果叠加的工作流。首先，我们必须弄明白，这种级别的 ai 剪辑底层逻辑到底是什么。传统的剪辑需要人在时间线上手动拖拽素材，但 hyperframes 的 核心优势在于，它是用 a、 t、 m、 c、 s、 s 和 javascript 直接在网页里搭建的画面，你的转场字幕，甚至是三 d 动效，全都由代码控，最后再由浏览器一帧一帧截图进行成 mp。 四视频 a、 t、 m l 的 渲染，对传统的文本格式是真正的降维打击，它能承载极高的信息， 一层复杂的交互组建。以前你要花几千块找专业特效师做的玻璃质感卡片、三 d 动画等等，现在全靠代码直接一嘴成片。接下来就是见证魔法时刻不在终端。调用 hyperframes 之后，你能直接实现三大杀手锏。第一， 全自动口播精简。它内置着 whisper 模型生成时间戳、自动剪、自动裁剪、无效停顿静音片段。如果一句话你说错了，重复两次，大模型会通过语音分析自动保留，最后一次完美切掉。废话，整个过程完全不需要你剪轨道。第二，网页一键转三 d 宣传片。只需要给他一个网站连接， ai 就 能自动分析落地页一键转换成带有三 d 动态展示的专业产品宣传片，外面大把人正在用这项技术来赚钱。第三，极其震撼的动态特效，只需要极经典的中文指令，它就能帮你生成带有动感的订阅按钮，或者根据上传的音频自动生成绝不穿帮的三 d 音频。组 建、修改、设计、更换科技风配色，也只需要一句话就能搞定。不过作为过来人，我必须给你几个极其硬核的避坑建议。首先，时间成本 极高，这种代码渲染非常吃电脑配置，每调整一轮重新渲染成视频可能需要半个小时到一个小时的时间。所以想清楚再让他动手，能 省下大量的时间。其次，别指望 ai 联网帮你找素材，找回来的经常和画面对不上，一定要自备高清素材。图片可以去一些开源网站找背景音效，用三种合成配音弦，机械就可以用 mini max 固定一套视觉工作流，你的出片效果才是最稳定。 ai 剪辑的时代，谁手里握着素材库最权，谁就拥有最大的优势。如果你想彻底解放双手，批量产出高画视频，我会将这期制作的全部素材和提示词放到评论区。我是白发男志，关注我，让我们一起探索 ai 自动化的无限可能，我们下期见！

大多数专业视频内容都需要一堆工具，设计软件、动态图形和视频编辑器。但你此刻观看的视频并不需要其中任何一项，它是由人工智能生成并编辑的。那没有 figma， 没有 photoshop， 没有 after effects， 没有 premiere， 也没有 final cut。 你现在看到的一切都由单个提示词生成下三分之一字幕、动态图形和标题。这一切都借助 hejian 的 云代码和 hyperframes 得以实现。在本视频中，我将向你展示如何亲手构建这套系统。接下来让我们看看什么是 hyperframes。

两个框架都能用代码生成视频，一个用 react， 一个用 html， 一个四年老兵，一个刚出生就瞄准 ai agent。 接下来七分钟，你会搞清楚它们到底在赌什么，不同的未来，以及你该站哪边。 先说一个前提，为什么要用代码做视频？打开 premiere 不好吗？好。但如果你要做的是每周生成五十条产品演示视频，每条只换一组数据。 或者你的 ai agent 需要自动把分析报告变成视频发给客户。这种场景下，手动剪辑不是慢的问题，是根本不可能 程序化视频解决的是规模和自动化。你写一次模板，数据一换，视频自动出能，版本控制能， c i c d 能跑在流水线里。这不是取代剪辑师，是取代重复劳动。 motion 的 核心信念。如果你会写 react， 你 就会写视频组建 hooks， typescript 类型安全，整个 react 生态直接赋用，它赌的是 react 开发者的数量优势。 hyperframes 的 核心信念完全不同，它说写视频的不一定是人。 ai agent 在 互联网上见过海量的 html 和 css， 但 react 组建训练数据里占比小得多。让 agent 写一个 motion 组建，他得先花 token 学框架规则才能开始创作，让他写 html 直接上手， 这是两种对未来的判断。 remote 认为下一个十年还是人类。用 react 写软件， ai 辅助， hyperframes 认为是 agent 替你生产内容，你只管验收， 技术层面差异很直接。 remote 需要完整的构建流程，为 motion 打包 react 翻译 npm 依赖管理， 你的项目里有 package 点儿， jason tcn com， 一 堆配置文件。 hyperframes， 一个 index 点儿 html 文件，没有构建步骤，没有 npm install 浏览器能跑的东西，它都能渲染成视频渲染引擎。两家都用 headless chrome 逐帧截图，再为给 ffmpeg。 但 hyperframes 在 linux 上多了一个 begin frame 模式，直接驱动 chrome 合成器字节即可复现同一个 html。 在 不同机器上渲染出来的视频逐像素一致， remote 做不到，这个 动画是最尖锐的差异点。 remote 的 动画模型，每一帧 react 重新渲染整颗组件数，你用 use current frame 拿到当前帧号，用 interpolate 计算属性值，精确可控。但有个致命问题， g s a p 用不了。为什么？ g s a p 有 自己的内部时钟？基于 performance now remote 逐帧渲染时， g s a p 不知道时间被冻结了，它会在渲染的第一秒内把整个四秒动画跑完，剩下三秒全是空帧。 hyperemem 怎么解决的？它在每帧截图前暂停 g s a p 的 时钟，然后 seek 到 frame 处，以 f p s。 的 位置。 g s a p 的 split， text motion， pass， scroll， trigger， 全部原声可用，这不是小事。 g s a p 是 动画领域的事实标准。 ai agent 友好度，这是 hyperframes 最强的卖点。它内置 mcp， 支持 cloud code cursor， 这些 agent 可以 直接通过工具协议操作。 hyperframes， 你 跟 agent 说帮我做一个产品介绍视频，他写一段 html， 调用渲染命令，视频就出来了， 中间不需要你碰任何东西。 remote 呢？ agent 得先把想法翻译成 j s x， 处理 react 的 状态，管理，配置 webpack， 每一步都是出错的机会，有人做过测试，让 cloud 分 别用两个框架生成同一个视频， hyperframes 的 成功率明显更高，因为 agent 不 需要学框架规则就能写出能跑的代码。 不过说实话，如果你团队本身就是 react 技术站， remote agent 体验也不差，毕竟 ai 写 react 也很熟练了。 生态成熟度， remote 碾压四年积累三万七千五百颗星，文档详尽，社区活跃， fireship 等知名创作者背书。最关键的是 remote lambda， 把视频拆成几百个片段，分发到 a w s lambda 并行渲染， 一个十分钟的视频几十秒就能出，这是生产环境的硬需求。 hyperframes 目前只能单机渲染，架构上不阻碍分布式，但还没人做。另外， hyperframes 支持 hdr 输出， remote 不 支持。如果你的内容要上 hdr 屏幕，这是个加分项。但对大多数人来说，分布式渲染比 hdr 重要得多。 许可证差距很大。 hyperframes 是 阿帕奇二点零真正的开源商用免费无限制 remotion， 用的是自定义许可证，个人和三人以下公司免费，超过就要买商业授权，最高两万五千美元。如果你是个人开发者或小团队， remotion 免费用没问题。 但如果你是一家中型公司，想把它集成到产品里，这笔钱得算尽成本。所以到底选谁？我的判断很简单， 如果你的团队是 react 技术站，已经有一套组建库，需要稳定的分布式渲染能力。选 remote， 它成熟可靠，生态完善。 如果你的核心场景是 ai agent 自动生产视频，或者你不想被框架绑定，想用 g s a p 做复杂动画，选 hyperframes， 它更灵活，更开放，对 agent 更友好。两者能共存吗？能，我见过有团队用 hyperframes 做 agent 驱动的快速原型，确认效果后再用 remotion 做精细化生产，这不是非此及彼的选择。 remotion 堵人， hyperframes 堵 agent， 两年后回头看，可能两个赌注都对，只是服务不同的工作流。真正的问题不是哪个更好，而是谁在写你的下一个视频，我们下期见。

给 ai 一个网站，就能一键生成这样的网站宣传视频，生成好的视频支持编辑文字、位置和颜色等，这就是 happyframes 安装方式，就是在 codex 插件中搜索 happyframes， 点击安装即可。然后在输入框中使用插件，并输入网站地址，再输入风格参考发送给 ai， 稍等一会后就会返回给我们一个地址。直接在浏览器打开，我们就看到视频生成完成 了。生成好的视频可在右侧底再进行格式化修改，可编辑文字、调整颜色、字体，甚至是渐变模糊等高级效果。我是月半，欢迎关注，持续学习！

今天这个项目，做视频的人和 ai 编程用户都可以看一眼。 hyperframes 的 想法很简单，你写普通 html， 它帮你预览再渲染成视频。这对 ai 很 友好，因为大多数编程助手本来就很会写 html 和 css， 你只要告诉他想做什么，比如十秒产品介绍、动态图表或者短视频开场，他会把页面、动画、字幕、音乐这些东西整理成可以反复预览的项目。手动用的话也不复杂，先编辑一个项目，再 preview 预览 render 就 能导出 mp。 四。它还支持 g s a p l t free j s 这些动画方式，适合做更复杂的画面。 最新版本今天刚发，仓库也在当天继续修。渲染和分布式相关问题，活跃度是在线的。如果你想让 ai 更稳定地帮你做视频原型， hyperframes 值得收藏试试。

ai 写代码超强，但做视频还是只能出图，现在直接写 html 就 能出 mp 四视频了，有这个二，一点八 k 新神器 hyperframes 彻底改变规则，开源视频渲染框架，写 html、 css 媒体以及可寻址动画 直接渲染标准 mp 四视频，专为 ai agent 打造。亮点一，纯 html 创作，无需 react， 无需构建步骤，直接写 html 就 出视频。 亮点二，内置 agent skills、 cloud code、 cursor、 japanese、 c l i 等 ai agent， 可直接掌握完整生产流程。亮点三，确定性渲染，搭配 c l i 工作流，一键出场预览渲染，兼容 g s f、 lotus 三 d j s 等动画。 亮点四，浏览器 studio 实时预览，支持分布式渲染，数据可识、字幕转场功能一应俱全，再也不用为 ai 生成视频头疼了，记得点赞关注哦！

哈喽，大家好，我是 ai 少年，今天主要是看到了一篇文章，关于使用 hebrew frames by highen 这个插件啊，来生成视频的。这个插件呢主要在 codex 里面使用的，所以呢，今天我主要是来实操一下，下面直接进入实操环节， 复制这个插件，然后打开 codex app， 使用的是客户端啊，点击左侧的那个插件 粘贴，直接有了。 ok， 添加安装，安装还是很快的，应该 ok， 安装好了，安装好了我们直接一个新的绘画，新的绘画在哪里找这个插件呢？有个小加号，在这个聊天窗口里面就可以找到这个插件。 ok， 今天我们主要来演示一个生成什么样的视频呢？我找了一个，我之前比较久了，一月三十一号，一月三十一号的时候生成了，使用那个，嗯， remote， 使用 remote skill 来生成了一个视频， 可以直接复制一下这个提示词，来到这个聊天窗口里面。这个提示词主要是干嘛的呢？就是有两个函数， 嗯，一个是天赋，是 x 的 平方，另外一个是努力，努力的话它是一点一次一点一的 x 密 x 呢是天数啊， 这个是我是用 kimi k 二点五，当时 kimi k 二点五生成的一个体式词了，这个体式词大概算出来了，在九十六天的时候，它们两个值是一样的，然后呢， x 轴就是零到两百天， x 轴零到零到两百天， y 轴的话是零五千一万，两万四万。下面我我们来看一下这个视频啊，看一下它的效果。 对，其实当时用那个 remotion 来生成这个视频，它的效果还是比较满意的，然后当然后面的音频，音频 是我后面添加去添加上去的，然后还有一点效果，我是添加上去上去的，但整体的话它的效果还是很好的。今天呢，我们就用同样的提示词，同样的提示词来生成，看看能不能生成一个比较类似的一个视频了。那么我们这里重点强调一下， 请不要使用 emotion 来生成视频，而是使用使用这个插件啊，插件来生成视频， ok， 不过呢，这里执行时间还是比较久的，所以要稍等一下。嗯，这里他已经收到了我的回复，就是使用的是 hyperframes 来做这个视频，而不是 remotion。 对，他去读，我们下载了那个插件，插件里面可能有工作流哈，然后去渲染，最终呢啊， paperframes 主要是通过生成 html， 它生成 html 来那个渲染的渲染动画，渲染完动画以后， 渲染完动画以后生成啊，播放动画相当于一个视频可以进行导出的，那我这个目录是空的，所以他需要那个。嗯，根据上面的提示词来重新生成啊，生成完之后，我们可以去看一下他的那个文件文件列表。 好，下面我们就多等一会。 ok， 现在等待了大概十二分钟的时间，它终于生成完了。生成完了，我们直接来看一下它的效果，这里可以直接点击预览地址。 嗯，外部浏览器打开，然后它相当于生成了一个单独的网页。啊，这里有播放。 嗯，这里停顿了一下，然后到达八万的上限以后继续往上冲，这里有个提示，整体来说的话，效果也还是不错，也还是有的，但整个页面相对来说，嗯，没有 remotion 更惊艳一点，可能也是可以调整的，比如说这个背景，背景也好，整个，嗯，布局还是可以再进行一个优化的。 最最后的话，这里可以有一个导出视频，所以整个视频生成的过程大概就是这样的了。今天的分享就到这里，再见。

开源 html 动画软件 hyperframes， 让 ai 用 html、 css、 js 做动画视频，无需 ae pr 写网页代码就能预览渲染成 mp。 四、适配 ai 代理工作流，本地部署免费，让开发者与创作者直接解锁视频创作新姿势。