宝玉把 Claude Design 动画导出能力做成了本地 skill,原理讲得很透,声明式引擎加 f(t) 直接抽帧的思路让开发者能零成本复现,想要高质量 AI 动画输出的创作者可以立即用起来。
baoyu-design(本地运行 Claude Design 的 Skill)新增动画视频导出功能。其声明式动画引擎基于 f(t) 设计:任意时间点 t 可绝对确定画面状态。导出采用无头 Chromium 逐帧截图 + ffmpeg 编码,每帧等待两帧 requestAnimationFrame 确保渲染完成。截图以 2 倍 DPR(3840×2160)再缩回 1080p,保证细节清晰。95 秒 30fps 动画需 2850 次截图循环,帧帧精确。项目已开源(MIT),获 1.2K star。此前 baoyu-design 已支持 PPT 本地生成和导出可编辑 PPTX。
baoyu-design skill 可以在本地生成动画视频,导出 mp4 格式,就像附件视频这个。
Claude Design 网页版可以用提示词创建动画视频,但你需要在网页上才能看到视频,无法下载。也有人基于第三方插件录屏软件实现过,不过很麻烦,效果也不是很好。
在这套 Skill 基础上,我已经实现了直接把动画导出成 mp4 视频的能力。
生成动画和导出视频,其实原理差不多,就是每一帧画面,都是根据所在时间坐标算出来的,就像一个函数 f(t),你传入给动画引擎任意一个时间点 t,它能直接算出那一瞬间屏幕上每个元素的位置、透明度、大小,所有视觉状态完全由 t 决定。不需要从头播放到那个时刻,也不需要记住之前发生了什么。