bangtutorial/bang-motion

解决什么问题

Bang Motion 防止 AI 编码代理在被要求制作视频时创建“幻灯片式”动画（简单的淡入淡出和静态部分）。它提供了一套专业运动设计规则、架构起始模板和风格指南的框架，使代理能够构建连续的电影级运动图形——例如产品宣传片、SaaS 演示和解释视频——并以单个 index.html 文件交付。

工作原理

它作为一个“Agent Skill”（一组指令和参考）运行，可以作为 Claude Code 的插件安装，或手动添加到其他 AI 代理（如 Cursor、Gemini CLI 等）。该系统引导代理遵循特定的工作流程：

1. 风格简报：代理在编写代码之前，提出基于品牌的调色板和结构。
2. 架构起始模板：代理使用预定义的 HTML/CSS/JS 模板（使用 GSAP 和 Three.js）以确保专业的基础。
3. 基于规则的验证：代理根据“反幻灯片”规则（例如，确保持续的主题、避免简单的淡入淡出、保持移动相机）检查其代码。
4. 交付：输出是一个自动播放的 HTML 文件，可以通过提供的 Node.js 脚本导出为 MP4。

适用人群

• 使用 AI 编码代理创建高质量营销资产的开发人员和设计师。
• 需要为产品发布、应用推广或教育解释视频快速制作原型的团队。
• 希望自动化运动设计的 Claude Code、Cursor 或 Gemini CLI 用户。

亮点

• 多样化的输出类型：支持开场白、SaaS 产品导览、动态排版和复杂的解释视频。
• 品牌驱动的美学：风格源自用户的品牌资产，而非通用模板。
• 专业的运动逻辑：实现了诸如“呼吸漂移”、有动机的镜头推进和帧精确的视频图层等概念。
• 灵活的导出：交付物主要是用于即时查看的 HTML，但可以渲染为 MP4。
• 外部集成：可以通过 Higgsfield MCP 桥接直接在 Adobe After Effects 中构建特定风格。