Загрузка видео...

Не удалось загрузить видео

На главную

AI 写的动画，以前像 PPT 翻页。 装了 gsap-skills 之后，我让 Claude Code 写了一个视差滚动页面。 出来的效果我盯着看了三分钟。 GreenSock 官方出的，专门教 AI 怎么写专业级动画代码。视差滚动、SVG 变形转场、Apple 那种丝滑微动效，代码直接符合生产规范，不用自己再改。 GitHub 4.5k stars。 🔗 你让 AI 写过最拉跨的动画效果是什么？

VincentLogic's profile picture

Vincent Logic | 信号＞噪音

51,233 subscribers

13,725 просмотров • 1 месяц назад •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

终于有一个 skill 能拯救 AI 的动画审美了！ GSAP 官方开源了 gsap-skills，专门为 Cursor、Claude、Copilot 等 AI 工具提供了专业的动画能力拓展和审美设计能力，前端 AI 动画的短板终于被彻底补齐～ 以前 AI 写动画经常像 PPT：僵硬、呆板、没质感 现在 AI 能写出专业的动效了：丝滑 Timeline、ScrollTrigger 滚动叙事、Flip 流畅切换、SplitText 文字动画、SVG 形变等等，质感提升明显。 需要提高你的ai审美的朋友们可以试试～ 地址：
0:33

终于有一个 skill 能拯救 AI 的动画审美了！ GSAP 官方开源了 gsap-skills，专门为 Cursor、Claude、Copilot 等 AI 工具提供了专业的动画能力拓展和审美设计能力，前端 AI 动画的短板终于被彻底补齐～ 以前 AI 写动画经常像 PPT：僵硬、呆板、没质感 现在 AI 能写出专业的动效了：丝滑 Timeline、ScrollTrigger 滚动叙事、Flip 流畅切换、SplitText 文字动画、SVG 形变等等，质感提升明显。 需要提高你的ai审美的朋友们可以试试～ 地址：

爱丽丝呀！

244,208 просмотров • 26 дней назад

🔥 前端动画界的老大 GSAP，又扔出了一颗炸弹：gsap-skills！ 90% 的网页动效只是乏味的淡入淡出，但 Apple 风滚动、数据可视化动画、沉浸式产品页背后的秘密，全在 GSAP。 GSAP 官方直接放出 gsap-skills： 支持 Cursor、Claude Code、Copilot、Google Antigravity、Windsurf 等几乎所有主流 Agent，自动识别。 神亮点： - 25+ 高级动画实战案例，一键学会 Timeline、ScrollTrigger、Ease 等核心技能 - 让 AI 或开发者都能瞬间生成丝滑、专业、高级感爆棚的动效 - 免费开源，商业项目直接用 - 性能极致流畅，复杂动画也不卡顿 - 跨框架支持：React、Vue、Svelte、原生 JS 全覆盖 - 官方教程 + 实战案例 = 动效学习最快捷径 GSAP 本身已全部免费（原 Club 高级插件全部白送），现在再加上这套官方 skill，装完直接甩需求给 AI，感受 Apple 级动效秒出的爽感！
0:52

🔥 前端动画界的老大 GSAP，又扔出了一颗炸弹：gsap-skills！ 90% 的网页动效只是乏味的淡入淡出，但 Apple 风滚动、数据可视化动画、沉浸式产品页背后的秘密，全在 GSAP。 GSAP 官方直接放出 gsap-skills： 支持 Cursor、Claude Code、Copilot、Google Antigravity、Windsurf 等几乎所有主流 Agent，自动识别。 神亮点： - 25+ 高级动画实战案例，一键学会 Timeline、ScrollTrigger、Ease 等核心技能 - 让 AI 或开发者都能瞬间生成丝滑、专业、高级感爆棚的动效 - 免费开源，商业项目直接用 - 性能极致流畅，复杂动画也不卡顿 - 跨框架支持：React、Vue、Svelte、原生 JS 全覆盖 - 官方教程 + 实战案例 = 动效学习最快捷径 GSAP 本身已全部免费（原 Club 高级插件全部白送），现在再加上这套官方 skill，装完直接甩需求给 AI，感受 Apple 级动效秒出的爽感！

开发者Hailey

129,745 просмотров • 28 дней назад

国外大神录了一个11分钟的教程，用 AI 从零做了一个赛博朋克动画网站，看完我沉默了（已加中文字幕） 滚动页面背景视频跟着播、鼠标移动有视差、卡片是磨砂玻璃质感、字体是定制艺术体。这种效果找外包做报价至少大几千 他用 GPT 5.5 + Codex，11分钟搞定 最绝的是他的工作流： 不是上来就让 AI 写代码，先去 Pinterest 找视觉参考，去 找现成的动画效果提示词，用 生成赛博朋克视频素材 然后把这些参考图、现成的 CSS 代码、具体的交互描述一起喂给 Codex。AI 拿到的不是一句模糊的"做个酷网站"，是精确的视觉方向 + 可用的代码片段 滚动驱动视频播放、液体玻璃效果这些以前要手写 GSAP 调半天的东西，他一个提示词就出来了 React + Vite + TypeScript + Tailwind + GSAP，全套技术栈 AI 自动配好 看完最大的感受是：差距不在工具上，在于怎么用。同一个 Codex，大部分人做出来像学生作业，这哥们做出来像设计公司的作品
11:00

国外大神录了一个11分钟的教程，用 AI 从零做了一个赛博朋克动画网站，看完我沉默了（已加中文字幕） 滚动页面背景视频跟着播、鼠标移动有视差、卡片是磨砂玻璃质感、字体是定制艺术体。这种效果找外包做报价至少大几千 他用 GPT 5.5 + Codex，11分钟搞定 最绝的是他的工作流： 不是上来就让 AI 写代码，先去 Pinterest 找视觉参考，去 找现成的动画效果提示词，用 生成赛博朋克视频素材 然后把这些参考图、现成的 CSS 代码、具体的交互描述一起喂给 Codex。AI 拿到的不是一句模糊的"做个酷网站"，是精确的视觉方向 + 可用的代码片段 滚动驱动视频播放、液体玻璃效果这些以前要手写 GSAP 调半天的东西，他一个提示词就出来了 React + Vite + TypeScript + Tailwind + GSAP，全套技术栈 AI 自动配好 看完最大的感受是：差距不在工具上，在于怎么用。同一个 Codex，大部分人做出来像学生作业，这哥们做出来像设计公司的作品

Vincent | 信号＞噪音

19,721 просмотров • 9 дней назад

想让 AI 做出专业级动画，你得先学会怎么跟它描述 Linear 设计工程师 Emil Kowalski 整理了 90+ 个动画术语，涵盖弹性动画、交互反馈等 12 个分类。做网站、做视频动画都能用 为了方便理解每个术语的实际效果，我用 Claude 做了一个双语预览站 👇
0:45

想让 AI 做出专业级动画，你得先学会怎么跟它描述 Linear 设计工程师 Emil Kowalski 整理了 90+ 个动画术语，涵盖弹性动画、交互反馈等 12 个分类。做网站、做视频动画都能用 为了方便理解每个术语的实际效果，我用 Claude 做了一个双语预览站 👇

Sac

22,491 просмотров • 18 дней назад

开源一个我的数据可视化动画库， 让工作展示+内容制作高级10倍！ 包含11个高级数据可视化效果， 项目的代码+自己的数据丢给AI， 直接做出属于你的专业数据可视化动画！ 项目开源地址：
8:28

开源一个我的数据可视化动画库， 让工作展示+内容制作高级10倍！ 包含11个高级数据可视化效果， 项目的代码+自己的数据丢给AI， 直接做出属于你的专业数据可视化动画！ 项目开源地址：

木子不写代码

29,938 просмотров • 3 месяцев назад

这个帖子应该叫「1 分钟生成超高质 PPT，这款 AI 工具堪比专业设计」😏 刚试用了 Gamma，被惊艳到了，这生成网页的效果不亚于 bolt 啊，没细看代码，但视觉效果，包括动效跟响应式绝对出彩！😍 👇评论放了链接跟 PPT 的生成效果，分分钟可以直接上台演讲了
1:07

这个帖子应该叫「1 分钟生成超高质 PPT，这款 AI 工具堪比专业设计」😏 刚试用了 Gamma，被惊艳到了，这生成网页的效果不亚于 bolt 啊，没细看代码，但视觉效果，包括动效跟响应式绝对出彩！😍 👇评论放了链接跟 PPT 的生成效果，分分钟可以直接上台演讲了

MapleShaw

52,126 просмотров • 1 год назад

使用Claude Fable 5 制作的黑洞诞生过程动画页面 开始只用了一句话，就是描述我要一个黑洞形成的动画页面 出来后效果不好重新告诉它我的目标是需要的是炫酷的动画过程，再配上文字字幕解说，还配音了，但是配音用的本地tts效果不好。 效果还是很炸裂的。 使用感受是以目标为导向，要把你要的效果描述的越清晰越好，它思考的过程很长，而且会自己打开浏览器自己看效果自己调整，全程不需要你干什么。
1:35

使用Claude Fable 5 制作的黑洞诞生过程动画页面 开始只用了一句话，就是描述我要一个黑洞形成的动画页面 出来后效果不好重新告诉它我的目标是需要的是炫酷的动画过程，再配上文字字幕解说，还配音了，但是配音用的本地tts效果不好。 效果还是很炸裂的。 使用感受是以目标为导向，要把你要的效果描述的越清晰越好，它思考的过程很长，而且会自己打开浏览器自己看效果自己调整，全程不需要你干什么。

小互

45,232 просмотров • 16 дней назад

想做网站不是一天两天了， 最近看了不少网页案例，很喜欢那些丝滑炫酷的动画， 一个大神告诉我，新手做网页， 做动画最省事的方式，就是找个开源库， 选择喜欢的效果，然后自定义修改一下就行。 又发现一个，Reactbits，各种动画都分好类的， 几行代码就能用上，也太方便了！！
0:31

想做网站不是一天两天了， 最近看了不少网页案例，很喜欢那些丝滑炫酷的动画， 一个大神告诉我，新手做网页， 做动画最省事的方式，就是找个开源库， 选择喜欢的效果，然后自定义修改一下就行。 又发现一个，Reactbits，各种动画都分好类的， 几行代码就能用上，也太方便了！！

沐阳

69,994 просмотров • 3 дней назад

可以拿来做教育演示的一款动画引擎AI工具，Fogsight，给定一个概念词，它即会生成一段叙事完整的动画 整个动画的叙事完整性、趣味性、视觉效果都还可以，用在教育上，把抽象概念做成教学动画非常实用 生成的动画还配有双语旁白 智能编排，从旁白、视觉元素到动态效果，整个工作流自动完成 有用户界面，可以进一步编辑和优化生成效果 代码作者是开源的，见下条 #AI教学动画 #Fogsight #AI教育
2:57

可以拿来做教育演示的一款动画引擎AI工具，Fogsight，给定一个概念词，它即会生成一段叙事完整的动画 整个动画的叙事完整性、趣味性、视觉效果都还可以，用在教育上，把抽象概念做成教学动画非常实用 生成的动画还配有双语旁白 智能编排，从旁白、视觉元素到动态效果，整个工作流自动完成 有用户界面，可以进一步编辑和优化生成效果 代码作者是开源的，见下条 #AI教学动画 #Fogsight #AI教育

AIGCLINK

56,108 просмотров • 11 месяцев назад

🙇‍♀️❤️🙇‍♂️ 动画效果太可爱了 终于找到了这个动画的出处，等我体验一下做几个好玩的动画再一起分享
0:42

🙇‍♀️❤️🙇‍♂️ 动画效果太可爱了 终于找到了这个动画的出处，等我体验一下做几个好玩的动画再一起分享

meng shao

97,921 просмотров • 1 год назад

新加坡国立大学Show Lab放出了一款教育视频自动生成工具：Code2Video，非常实用 把写教案升级为了自动代码动画生成，同时更好的解决了生成内容逻辑结构和视觉准确性的问题 对老师来说，只需要输入教学主题就能自动获得一个3Blue1Brown风的教学动画 Code2Video核心是让AI先自动写Manim Python代码，然后再渲染出教育视频，并非直接出视频。是一个多智能体架构，包括Planner、Coder和Critic 看给出的效果，跟Veo3、Wan-2.1比，Code2Video在逻辑结构、知识准确性，以及教学清晰度上表现更好一些 视频通过代码生成，对生成的每个元素、动作、公式都可以精准控制，这就比较适合需要逻辑结构和视觉准确性的教学场景 #AI教学视频生成 #AI公式视频 #AI教育 #Code2Video
1:12

新加坡国立大学Show Lab放出了一款教育视频自动生成工具：Code2Video，非常实用 把写教案升级为了自动代码动画生成，同时更好的解决了生成内容逻辑结构和视觉准确性的问题 对老师来说，只需要输入教学主题就能自动获得一个3Blue1Brown风的教学动画 Code2Video核心是让AI先自动写Manim Python代码，然后再渲染出教育视频，并非直接出视频。是一个多智能体架构，包括Planner、Coder和Critic 看给出的效果，跟Veo3、Wan-2.1比，Code2Video在逻辑结构、知识准确性，以及教学清晰度上表现更好一些 视频通过代码生成，对生成的每个元素、动作、公式都可以精准控制，这就比较适合需要逻辑结构和视觉准确性的教学场景 #AI教学视频生成 #AI公式视频 #AI教育 #Code2Video

AIGCLINK

35,757 просмотров • 8 месяцев назад

Codex 重磅更新：Product Design 插件上线！ 以前 Codex 代码强但 UI 审美常被吐槽 上世纪风，这次直接把产品设计思维装进大脑，审美和专业度瞬间拉满！ 下面视频展示了我用最新 Product Design 插件设计的三个网站，完全不输高级设计师～ 先设计，后开发：它不再是直接盲写代码，而是先给你 3 张不同风格的高保真参考图！ 确认了审美，再开始写代码，这种 设计驱动 的流程太专业了。 丝滑的滚动叙事、动态背景、视频卡片，交互细节拉满。 这种先定审美、再定交互、最后落地的流程，才是未来 AI 开发的终极形态！
0:43

Codex 重磅更新：Product Design 插件上线！ 以前 Codex 代码强但 UI 审美常被吐槽 上世纪风，这次直接把产品设计思维装进大脑，审美和专业度瞬间拉满！ 下面视频展示了我用最新 Product Design 插件设计的三个网站，完全不输高级设计师～ 先设计，后开发：它不再是直接盲写代码，而是先给你 3 张不同风格的高保真参考图！ 确认了审美，再开始写代码，这种 设计驱动 的流程太专业了。 丝滑的滚动叙事、动态背景、视频卡片，交互细节拉满。 这种先定审美、再定交互、最后落地的流程，才是未来 AI 开发的终极形态！

爱丽丝呀！

135,452 просмотров • 21 дней назад

2万粉丝福利，贺图（×） 苍影侠的AI动画片（√）其实是最近的ai视频很厉害，干脆要不给我的英雄做一个ai动画片吧？后面做到R18部分我就用漫画来替代。先看个前戏吧😋 感谢各位一直以来的支持，你们的互动就是我更新的动力🥰
1:36

2万粉丝福利，贺图（×） 苍影侠的AI动画片（√）其实是最近的ai视频很厉害，干脆要不给我的英雄做一个ai动画片吧？后面做到R18部分我就用漫画来替代。先看个前戏吧😋 感谢各位一直以来的支持，你们的互动就是我更新的动力🥰

Achai

71,012 просмотров • 4 месяцев назад

Pixel2Motion，一个能把静态 logo 直接变成矢量动画的开源工具 丢一张 PNG 或 JPG 进去，它先用 AI 把像素图转成矢量路径，然后自动生成动画效果，输出无损的 SVG 有几个细节挺讲究的： -转矢量的时候会跟原图做叠拼误差校验，反复迭代直到还原度够高 -动画生成遵循迪士尼动画12法则，所以动起来的节奏感不像是随便加的 -输出格式支持 SVG、HTML代码、GIF、视频 它本身是一个开源的 Codex 和 Claude 技能，也兼容其他多模态 Agent 以前给 logo 加动画要在 After Effects 里一帧帧调，现在一个命令就出来了 GitHub 地址放在评论区了 做设计或者前端的可以看看，尤其是经常被甲方要求"logo能不能动一下"的
0:29

Pixel2Motion，一个能把静态 logo 直接变成矢量动画的开源工具 丢一张 PNG 或 JPG 进去，它先用 AI 把像素图转成矢量路径，然后自动生成动画效果，输出无损的 SVG 有几个细节挺讲究的： -转矢量的时候会跟原图做叠拼误差校验，反复迭代直到还原度够高 -动画生成遵循迪士尼动画12法则，所以动起来的节奏感不像是随便加的 -输出格式支持 SVG、HTML代码、GIF、视频 它本身是一个开源的 Codex 和 Claude 技能，也兼容其他多模态 Agent 以前给 logo 加动画要在 After Effects 里一帧帧调，现在一个命令就出来了 GitHub 地址放在评论区了 做设计或者前端的可以看看，尤其是经常被甲方要求"logo能不能动一下"的

Vincent | 信号＞噪音

20,627 просмотров • 12 дней назад

设计师必备 Design Skill 推荐，整理了我日常高频在用的 5 款实用 Skill，亲测实用性拉满 1、Text to Lottie Skill 上传 SVG + 填写动画描述，快速生成可编辑 Lottie 动画文件。 2、GSAP Skill 一键生成专业网页交互动效，自动输出高性能代码，支持 SVG 动画、鼠标跟随、滚动视差文字等效果。 3、three-scope-map-skill 输入地区即可生成数据大屏 3D 交互地图，多款配色主题，支持缩放、平移、点位、飞线等大屏常用特效，开箱即用。 4、Web to Design md 输入网址一键扒取网页配色、字体、CSS、动效等全套设计规范，输出可被 AI 使用的 design.md 文档。 5、Shadcn/ui Skill 适配前端项目，自动对齐项目配置、统一组件规范、支持多主题，一键生成规整后台页面，省去大量调试工作。
1:06

设计师必备 Design Skill 推荐，整理了我日常高频在用的 5 款实用 Skill，亲测实用性拉满 1、Text to Lottie Skill 上传 SVG + 填写动画描述，快速生成可编辑 Lottie 动画文件。 2、GSAP Skill 一键生成专业网页交互动效，自动输出高性能代码，支持 SVG 动画、鼠标跟随、滚动视差文字等效果。 3、three-scope-map-skill 输入地区即可生成数据大屏 3D 交互地图，多款配色主题，支持缩放、平移、点位、飞线等大屏常用特效，开箱即用。 4、Web to Design md 输入网址一键扒取网页配色、字体、CSS、动效等全套设计规范，输出可被 AI 使用的 design.md 文档。 5、Shadcn/ui Skill 适配前端项目，自动对齐项目配置、统一组件规范、支持多主题，一键生成规整后台页面，省去大量调试工作。

Paidax

68,648 просмотров • 5 дней назад

别再把 Codex 只当聊天工具用了～ 装上这11个官方插件，Codex直接变成你的生产力外挂！ 别人还在手动做图、抠 PPT、抓数据…… 你已经一句话搞定海报、视频、数据分析和日程管理～ 下面我把每个插件的实际效果都录出来了，直接看效果～ 1️⃣视觉 & 设计神器 · Canva：一句话调用百万专业模板，海报、朋友圈图、封面秒出 · Figma：扔需求或代码，一键生成高保真可编辑设计稿 · HyperFrames by HeyGen：HTML/脚本自动渲染高质量视频 · Remotion：专业级视频动效和动画，效果直接拉满 2️⃣办公 & PPT狂魔 · Presentations：给个主题，自动生成高质量PPT初稿+完整大纲 · Spreadsheets：复杂公式、图表、数据分析一气呵成 3️⃣内容 & 数据深度工具 · Documents：长文章提炼、总结、写PPT脚本 · BioRender：科研/医学图表，秒出专业科学插图 · Windsor ai：一键拉全网营销数据并自动分析 4️⃣自动化王炸 · Chrome：Codex直接操控浏览器，自动读网页、抓数据、填表 · Google Calendar：自动创建会议、管理日程，排会效率翻倍 安装方式：Codex App → 左侧「Plugins」→ 搜索名称直接安装（30秒搞定）
0:41

别再把 Codex 只当聊天工具用了～ 装上这11个官方插件，Codex直接变成你的生产力外挂！ 别人还在手动做图、抠 PPT、抓数据…… 你已经一句话搞定海报、视频、数据分析和日程管理～ 下面我把每个插件的实际效果都录出来了，直接看效果～ 1️⃣视觉 & 设计神器 · Canva：一句话调用百万专业模板，海报、朋友圈图、封面秒出 · Figma：扔需求或代码，一键生成高保真可编辑设计稿 · HyperFrames by HeyGen：HTML/脚本自动渲染高质量视频 · Remotion：专业级视频动效和动画，效果直接拉满 2️⃣办公 & PPT狂魔 · Presentations：给个主题，自动生成高质量PPT初稿+完整大纲 · Spreadsheets：复杂公式、图表、数据分析一气呵成 3️⃣内容 & 数据深度工具 · Documents：长文章提炼、总结、写PPT脚本 · BioRender：科研/医学图表，秒出专业科学插图 · Windsor ai：一键拉全网营销数据并自动分析 4️⃣自动化王炸 · Chrome：Codex直接操控浏览器，自动读网页、抓数据、填表 · Google Calendar：自动创建会议、管理日程，排会效率翻倍 安装方式：Codex App → 左侧「Plugins」→ 搜索名称直接安装（30秒搞定）

爱丽丝呀！

228,622 просмотров • 1 месяц назад

HeyGen这次开源，把AI做视频的最后一道门槛拆没了🤯 他们用Claude Code写代码，做了自己的50秒产品发布视频，然后把整个工具链完整开源给了所有人，致敬开源🫡 以后做视频真的能简单到离谱， 给一句话，做一个30秒的产品介绍，给一个PDF，自动生成总结视频， 迭代就是改一句话的事，比如把标题放大两倍，第三秒加一个淡入转场等， 这个工具叫HyperFrames，本质上就是一个纯HTML转MP4的视频渲染框架。 所以其实我们不用学任何剪辑软件，也不用写复杂的React代码， 只要写普通HTML，加几个简单的data属性，就能定义视频的每一帧、时间线、动画和音轨。 HyperFrames从第一天起就是为AI代理原生设计的。 AI天生就会写HTML，现在Claude、Cursor、Gemini所有编码Agent，只要装一个skill，立刻就会做视频。 这妥妥的降维打击啊，以前Remotion把视频变成了代码，但它需要你会React，需要构建流程，属于开发者专属的玩具。 HyperFrames是把视频变成了纯HTML，零构建，无DSL，不需要任何前置知识。 说白了，Remotion是给人写的，HyperFrames是给AI写的。 以前AI能写文字，能生成图片，但视频一直是最后一块硬骨头，现在这块骨头也被啃下来了。 代理现在能端到端完成一整条内容流水线，调研，写脚本，做设计，加动画，最后直接渲染出成品视频，全程不需要人类碰一下。 它还自带50+官方现成组件，社交遮罩、图表、转场，一行命令一键安装。 支持GSAP、Lottie、Three.js所有主流动画库，随便混用。 也就是说，同一份HTML永远出一样的结果，完美适合自动化流水线。 官方甚至把视频语言都标准化了，缓动用snappy，bouncy，转场用能量等级，字幕分Hype/Corporate/Tutorial三种风格。 AI只要学会这套词汇，就能稳定输出专业级视频，这不就是在教AI做导演嘛🤣 这对HeyGen来说也是一步妙棋，他们不再只是一个卖AI头像的SaaS公司，现在能做整个AI视频时代的基础设施了， 未来所有AI代理生成的视频都能跑在HyperFrames上。 然后再无缝接入HeyGen的头像、语音、翻译能力，形成一个完美的闭环。 当然目前也不是完美的，初期输出还有AI味，超过一分钟的复杂长视频，渲染还需要较强算力。 但我觉得这都不重要，关键是它第一次把完整的视频生产力交给了AI Agent，相当于AI内容创作时代的又一个里程碑。 想试的直接去GitHub搜heygen-com/hyperframes。 跑一行npx hyperframes init，然后让Claude帮你做第一个视频。 #HyperFrames #HeyGen #AI视频 #AI代理 #开发者 #内容创作
0:49

HeyGen这次开源，把AI做视频的最后一道门槛拆没了🤯 他们用Claude Code写代码，做了自己的50秒产品发布视频，然后把整个工具链完整开源给了所有人，致敬开源🫡 以后做视频真的能简单到离谱， 给一句话，做一个30秒的产品介绍，给一个PDF，自动生成总结视频， 迭代就是改一句话的事，比如把标题放大两倍，第三秒加一个淡入转场等， 这个工具叫HyperFrames，本质上就是一个纯HTML转MP4的视频渲染框架。 所以其实我们不用学任何剪辑软件，也不用写复杂的React代码， 只要写普通HTML，加几个简单的data属性，就能定义视频的每一帧、时间线、动画和音轨。 HyperFrames从第一天起就是为AI代理原生设计的。 AI天生就会写HTML，现在Claude、Cursor、Gemini所有编码Agent，只要装一个skill，立刻就会做视频。 这妥妥的降维打击啊，以前Remotion把视频变成了代码，但它需要你会React，需要构建流程，属于开发者专属的玩具。 HyperFrames是把视频变成了纯HTML，零构建，无DSL，不需要任何前置知识。 说白了，Remotion是给人写的，HyperFrames是给AI写的。 以前AI能写文字，能生成图片，但视频一直是最后一块硬骨头，现在这块骨头也被啃下来了。 代理现在能端到端完成一整条内容流水线，调研，写脚本，做设计，加动画，最后直接渲染出成品视频，全程不需要人类碰一下。 它还自带50+官方现成组件，社交遮罩、图表、转场，一行命令一键安装。 支持GSAP、Lottie、Three.js所有主流动画库，随便混用。 也就是说，同一份HTML永远出一样的结果，完美适合自动化流水线。 官方甚至把视频语言都标准化了，缓动用snappy，bouncy，转场用能量等级，字幕分Hype/Corporate/Tutorial三种风格。 AI只要学会这套词汇，就能稳定输出专业级视频，这不就是在教AI做导演嘛🤣 这对HeyGen来说也是一步妙棋，他们不再只是一个卖AI头像的SaaS公司，现在能做整个AI视频时代的基础设施了， 未来所有AI代理生成的视频都能跑在HyperFrames上。 然后再无缝接入HeyGen的头像、语音、翻译能力，形成一个完美的闭环。 当然目前也不是完美的，初期输出还有AI味，超过一分钟的复杂长视频，渲染还需要较强算力。 但我觉得这都不重要，关键是它第一次把完整的视频生产力交给了AI Agent，相当于AI内容创作时代的又一个里程碑。 想试的直接去GitHub搜heygen-com/hyperframes。 跑一行npx hyperframes init，然后让Claude帮你做第一个视频。 #HyperFrames #HeyGen #AI视频 #AI代理 #开发者 #内容创作

AYi

36,425 просмотров • 2 месяцев назад

发现个前端圈公认的动画神器，68K stars 真的不是吹的！ anime.js —— 一个轻量级但功能极其强大的 JavaScript 动画引擎。 前端兄弟们又来享福了，这玩意儿简直是“动画师的瑞士军刀”： 🎨 全能型选手 不管是 CSS 属性、SVG、DOM 属性，还是 JavaScript 对象，它都能让你动起来。想搞顺滑的光标特效、复杂的滚动视差、还是丝滑的 UI 过渡，它全包了。 API 直观且轻量 代码写起来非常优雅，像写时间线一样简单。支持模块化引入，你只需要引入你需要的部分，保持 bundle 体积超小，性能拉满。 🛠️ 开箱即用 官网（ Demo，每个动画都直接配好了代码，一键复制就能用，拿去二次创作简直不要太方便。 看它那个相机拆解的动画演示，流畅度真的绝了。搞前端开发、做交互设计的，这个库必须收藏在工具箱里。 项目地址放评论区了👇
0:21

发现个前端圈公认的动画神器，68K stars 真的不是吹的！ anime.js —— 一个轻量级但功能极其强大的 JavaScript 动画引擎。 前端兄弟们又来享福了，这玩意儿简直是“动画师的瑞士军刀”： 🎨 全能型选手 不管是 CSS 属性、SVG、DOM 属性，还是 JavaScript 对象，它都能让你动起来。想搞顺滑的光标特效、复杂的滚动视差、还是丝滑的 UI 过渡，它全包了。 API 直观且轻量 代码写起来非常优雅，像写时间线一样简单。支持模块化引入，你只需要引入你需要的部分，保持 bundle 体积超小，性能拉满。 🛠️ 开箱即用 官网（ Demo，每个动画都直接配好了代码，一键复制就能用，拿去二次创作简直不要太方便。 看它那个相机拆解的动画演示，流畅度真的绝了。搞前端开发、做交互设计的，这个库必须收藏在工具箱里。 项目地址放评论区了👇

Vincent | 信号＞噪音

61,019 просмотров • 1 месяц назад

烧了我 200 元人民币，让 fable-5 给首页加点动效 怎么说呢，我也不知道值不值这 200 块了；动效改动很小，但是的确把整个页面的特效统一了，也很优雅。😄 右边新版，左边老版
0:47

烧了我 200 元人民币，让 fable-5 给首页加点动效 怎么说呢，我也不知道值不值这 200 块了；动效改动很小，但是的确把整个页面的特效统一了，也很优雅。😄 右边新版，左边老版

兔妹_兔子

39,997 просмотров • 16 дней назад

最近不知道怎么回事儿，YouTube 播放页失去焦点的时候会自动停止播放，我习惯把 YouTube 网页放在那里作为背景音写代码，所以十分难受，我就用 avante.nvim 写了个油猴脚本，让它检测到视频暂停后自动恢复播放（识别了用户暂停），现在舒服了 😌 （不过谁能告诉我为啥会自动停止啊，好像有的视频不会
0:44

最近不知道怎么回事儿，YouTube 播放页失去焦点的时候会自动停止播放，我习惯把 YouTube 网页放在那里作为背景音写代码，所以十分难受，我就用 avante.nvim 写了个油猴脚本，让它检测到视频暂停后自动恢复播放（识别了用户暂停），现在舒服了 😌 （不过谁能告诉我为啥会自动停止啊，好像有的视频不会

yetone

37,298 просмотров • 1 год назад