正在打开每日关注
正在打开每日关注
用真实组件库、设计稿与 Remotion，通过多轮迭代制作产品演示动效。
惊到了，纯靠 AI 做动画效果能做到什么程度。果然工具好坏，还是要看用的人是什么水平 关键是作者还不是设计出身，全片都是拿 Claude Code + Remotion 实现的，没有做任何剪辑 作者分享了他的创作思路 - 背景和 UI 都是通过手工完成 - 提供完整代码库给 Claude，所有资源都是真实生产环境的效果 - 让 AI 基于已有的设计稿编排一些样式，再按照作者喜欢的方式编排成动画 - 找了一些参考视频作为 Claude 的动画灵感 - 花费了大量的时间来调整动画缓动曲线 - 音效比较靠谱的方式还是通过 Gumroad 上的付费资源来做匹配 - 需要多轮迭代，不是一次性能达到的效果
EVERYTHING you see in the video below was generated using Claude Code. Turns out, you can vibe animate your way to a demo video with some super cool motion graphics elements. Doesn't mean it's an easy task, but you'd be surprised by what it's capable of. #Claude #Remotion https://t.co/Yp2jtdszBu
是什么 这条内容记录了一种“代码即时间线”的产品演示制作流程：创作者先手工确定背景、UI 与设计稿，再把真实代码库、组件库和生产资源交给 Claude Code，使用 Remotion 编排镜头、转场与动效，最后通过多轮提示和人工调整完成视频。它的价值不在“AI 一键出片”，而在于把平台本身的界面与组件直接变成可运行、可复用的动画素材。
核心设计 设计起点仍是人工定义的视觉语言，AI 主要承担样式编排、运动实现和迭代执行。真实组件库让演示避免了在 After Effects 中重新临摹 UI；Remotion 的单一时间线也便于统一管理转场、缓动和界面状态。作者特别强调缓动曲线、参考视频、音效匹配与多轮修订，说明质感来自细节控制，而非模型第一次输出。
关键洞察 这是一条连接设计系统、前端工程和内容生产的工作流：组件资产越完整、约束越清晰，Agent 越容易复现一致体验，产品演示也更接近真实产品。对有工程能力的设计或产品团队，它降低了从交互原型到动态说明片的转换成本。
边界与风险 代码“能播放”不等于代码可维护；作者承认时间线代码较乱，且当前没有视觉证据，无法验证最终画面质量。复杂镜头仍需要人判断节奏、叙事、可读性与声音版权，因此更适合把 Agent 当作高执行力的动效协作者，而不是替代设计决策者。