✦ 工作室精选
Halden Solace · 16:9
由此 Skill 渲染
一个开源 Skill，让 AI 助手变成动效设计师。它从你的品牌推导风格，提出三个构思并推荐一个，然后搭出一个 index.html：镜头在动，主体始终在场，色块换色都有看得见的触发。10 种风格、19 种开场结构、6 种讲解视频风格，还能逐帧导出 MP4。
更新于 2026年11月2日
你将得到
- 一个播放起来像视频的 index.html：自动播放、循环，加 ?debug=1 有进度条
- 一份风格简报：三个构思、一个推荐、注明来源的配色
- 按 Skill 防幻灯片规则做的关键帧检查
- 可选的逐帧 MP4 导出，60fps
适合
- 新品发布和网店宣传
- App 开场、SaaS 导览和品牌片头
- 用照片、抠图或卡通做的讲解视频
不适合
- 剪辑你已经拍好的实拍素材
- 真人出镜的视频
关于此 Skill
你只需说
/bang-motion 用 flat pop with photos 风格给我们的跑鞋做一支 30 秒宣传片，16:9。用我们的产品照片，再生成一位穿着这双鞋的虚构跑者。最后落在 logo 和「Shop the drop」上。
让 AI 助手做宣传片、开场片、产品导览或讲解视频。Bang Motion 让它像真正的动效设计师一样工作：风格来自你的品牌，结构从一份构思菜单里挑，成片动起来像电影。人物和产品从画面边缘弹进来，标签贴在它们身上，巨大的单词压在它们身后，色块被触发才换色，镜头推进到下一个场景，而不是淡入淡出。
工作流程
- 简报：告诉助手产品、受众、时长和画面比例，交给它你的 logo、网站、截图或照片。
- 风格简报：它给出三个构思、一个推荐、结构大纲，以及每种颜色都注明来源的配色。你在写任何代码之前确认或修改。
- 素材：优先用你自己的照片和 logo；没有的话，可以用图像工具生成虚构的人物和产品，或者选一个不需要照片的构思。
- 搭建：它用 HTML、CSS 和 GSAP 写出一个 index.html，按自己的规则检查关键帧（不能有淡入淡出的幻灯片、主体始终在场、文字最多两层、手机上看得清），不合格就修。
- 交付：双击文件就能播放，加上 ?debug=1 可以拖动进度，也可以用附带的脚本逐帧导出 MP4（需要 Node.js、Puppeteer 和 FFmpeg）。
小贴士
- 说风格，别列场景：「flat pop with photos」「grainy gradient」「poster color-block」或「product tour with claims」。
- 交出真实的品牌素材，配色和形状都从这里推导。
- 文字要短：开场片只传达一种感觉，讲解视频只讲一个论点。
- 每支新视频开一个新对话，免得之前的决定带进来。
开源
Bang Motion 由 Bang Tutorial 制作（bangtutorial/bang-motion），以 MIT 许可证开源。下载的是 GitHub 上发布的 Skill。它的说明文件是印尼语写的，README 是英文；AI 助手两种都能读，并用你的语言工作。
开始前需要准备
- 你需提供
- 你的产品、logo 和品牌素材，时长和画面比例，有照片就带上；没有也可以生成虚构的人物和产品。
- 依赖
- Google Chrome（或 CHROME_PATH）——必需 · 图像模型密钥——可选
- 外部费用
- 搭建和观看都不花钱。用图像模型生成照片是可选的，由该服务商收费。
- 最近测试
- v1.19.0 —
用户评价
还没有评价。安装这个 Skill，成为第一个评分的人。
常见问题
为什么看起来不像幻灯片？
这个 Skill 会检查自己的代码里有没有幻灯片习惯：不能有淡入淡出的段落，主体或场景要一直在，文字最多两层，背景始终在动，换色一定有看得见的触发。
能做哪些风格？
10 种视觉风格，从电影感暗色、海报色块到 flat pop with photos 和颗粒渐变，搭配 19 种开场结构和 6 种讲解风格。你可以点名一种，也可以让它推荐。
能拿到 MP4 吗？
你会拿到一个在任何浏览器都能播放的 HTML 文件。附带的导出脚本会逐帧渲染成 MP4，不丢帧；需要 Node.js、Puppeteer 和 FFmpeg。
为什么免费？
Bang Motion 是 Bang Tutorial 的开源 Skill。我们原样上架，样片是在我们自家的运动鞋 Halden Solace 上运行它做出来的。
