【免费下载链接】bang-motion
Agent skill for browser motion graphics — openers, promos, bumpers, kinetic typography, and five explainer styles that move like video, not slides. Single index.html output. Works with Claude Code, Codex, Gemini CLI, Cursor.
Bang Motion 是一个开源的 Agent Skill,把它交给 AI 编程代理后,你只需要输入一句提示词,就能生成一个像视频一样流畅运镜、而不是 PPT 翻页的30 秒产品宣传片——最终交付的是单个index.html文件,双击即可播放、自动循环,还能一键导出 MP4。支持 Claude Code、Codex、Gemini CLI、Cursor 等主流 AI 代理。
一句话提示词为什么够用
大多数人写 AI 提示词会犯两个极端:要么一句话太模糊,产出千篇一律的"标题+配图+淡入淡出";要么写成千字需求文档,代理反而抓不住重点。
Bang Motion 的聪明之处在于:规则、镜头语言、风格菜单都已经写死在 SKILL.md 和 references/ 里,你的提示词只负责回答五个问题:
| 要素 | 说明 | 示例 |
|---|---|---|
| 🎯 产品 | 做什么产品的片 | 笔记 App、HR 看板、票务应用 |
| 🎨 风格 | 从 10 种风格里点一个名字即可 | grainy gradient、flat pop with photos |
| ⏱️ 时长 | 通常 15–40 秒 | 30 秒 |
| 📐 比例 | 默认 16:9,竖屏要说出来 | 9:16 |
| 📎 素材 | logo、截图、录屏等 | 见附件 |
风格命名对照可查 references/opener-konsep.md 里的 19 个概念菜单(比如 "product tour with claims" 专治 SaaS,"flat pop with photos" 专治消费级 App)。注意:说"哪个风格",而不是抄参考视频"哪个场景"——前者得到气质,后者得到复制品。
7 个可直接复制的 Prompt 模板
以下模板中的方括号[]内容替换成你自己的信息即可,其余原样发送。
模板一:最简一句话,快速出片
适合第一次上手、素材还没齐的场景,30 秒 App 宣传片的最小可用提示词:
Make a 30-second opener for my note-taking app. Logo and screenshots attached.中文对照:
给我的笔记 App 做一条 30 秒开场宣传片,logo 和截图见附件。💡 素材越真实越好:附上真 logo、官网链接或 App 截图,配色和图形会从你的品牌推导,而不是随机生成。
模板二:SaaS 产品宣传片——带数据主张的 UI 演示
适合 B2B 看板、团队协作类产品,UI 会被"搬"进画面里真实操作,镜头跟着鼠标点击推进:
Build a 45-second product tour of our HR dashboard in the "product tour with claims" style, 16:9.💡 对应概念 19 "Tur produk berselang klaim":UI 演示与短主张句交替出现,每 2–5 秒停在一个卖点上,非常适合功能多的产品。
模板三:竖版 9:16,投放社交媒体的产品宣传片
短平快投放到短视频平台时,比例和时长都要写进提示词:
Promo for a ticketing app in the flat pop with photos style — generate fictional people, 9:16, 20 seconds.💡 没有真人照片?直接让代理通过图像 MCP生成虚构人物,logo 和文字会在代码里叠加,不需要你后期修图。
模板四:Kinetic Typography,用文字本身当主角
音乐节、发布会、品牌宣言这类"一句话打爆"的场景,文字就是画面,色块跟着节奏砸进来:
Kinetic typography for our festival announcement: "City of Sound, 3 nights, 48 stages". Loud, color-block.💡 直接把要喊的那句话引号包好发给代理,它会逐字拆分、多方向入场、配合节奏。
模板五:Explainer 解说片——视觉新闻风格
不是所有宣传片都卖货,60 秒讲清楚一件事同样重要。风格名 + 时长 + 要不要旁白,三个要素说清即可:
Explain how a container port works in 60 seconds, visual journalism style, no voice-over.💡 6 种解说风格各有独立 starter 模板,文件在 assets/ 目录:
starter-explainer.html(连续动作)、starter-explainer-jurnalisme.html(视觉新闻)、starter-explainer-kartun.html(卡通拼贴)等,具体规则见 references/explainer.md。
模板六:把真机录屏"嵌"进宣传片
已有屏幕录像时,Bang Motion 会把视频当素材图层处理:裁切、打光、加动画,并且与时间轴严格同步——拖动进度条和导出 MP4 都帧帧精准:
Promo for our editing app with a screen recording playing inside a laptop mockup, 30 seconds. Clip attached.💡 视频图层细节(trim、mask、同步机制)写在 references/techniques.md 的 "video as footage layers" 一节。
模板七:卡通科普片,旁白后补同步
教育向、带角色演绎的宣传片。旁白可以先不录,提示词里说明"稍后给音频",时间轴会自动重新对齐:
A cartoon explainer on why volcanoes erupt, for kids, 9:16, I will send a voice-over later.💡 交付时代理会附上完整 VO 稿;你录好音频发回去,它用 scripts/vo-pauses.html 检测停顿点(无需 ffmpeg),让画面节拍跟着你的语音走。
4 个让成片更好看的 Prompt 细节
- 说风格,别说场景:
grainy gradient给你一个"皮";罗列参考视频的镜头顺序,只会得到一份"抄"。 - 交出真品牌素材:logo(矢量最佳)、官网、截图、包装图——配色、字体、图形全部从它们推导。
- 想要特定瞬间就明说:不说,代理会自己新编;想要某个标志性镜头,必须点名。
- 文案保持短:30 秒宣传片承载一个感觉,解说片承载一个论点,贪多必乱。
从 Prompt 到交付:一条片子的完整流程
发送提示词后,流程是固定的,你可以全程干预:
- 风格简报先于代码——代理先给出 3 个概念候选 + 1 个推荐 + 带来源标注的配色表,你改到满意才开工;
- 构建单个
index.html——基于 assets/starter-opener.html 的确定性时间轴架构,无任何随机数,回放永远一致; - 逐帧自检——代理用 scripts/snap.mjs 截取关键秒检查文字是否被裁切、是否还有"PPT 味";
- 你验收并迭代——打开文件加
?debug=1获得拖动条,描述哪里不对劲,反馈直接落到同一个文件上; - 交付三选一——保留 HTML 直接播放 / 用 scripts/export-frames.mjs 逐帧渲染导出 MP4 / 发送旁白做音画同步。
⚠️ 两个老手经验:每条新视频开一个新对话(技能在首次调用时读取,长对话会带着上一个项目的决策);同一仓库只装一份,插件和手动目录二选一,重名会冲突。
快速安装
git clone https://gitcode.com/gh_mirrors/ba/bang-motion把bang-motion目录放进对应代理的技能目录即可(Claude Code 放~/.claude/skills/;其他代理在AGENTS.md/GEMINI.md/.cursor/rules中指向 SKILL.md)。观看成片只需要浏览器 + 网络,零安装;导出 MP4 才需要 Node 与 ffmpeg。
更多规则细节(防 PPT 检查清单、镜头语言、转场菜单)都在仓库内:references/anti-ppt.md、references/techniques.md、references/architecture.md。现在,挑一个上面的模板,替换方括号,发出你的第一句提示词吧 🎬
【免费下载链接】bang-motion
Agent skill for browser motion graphics — openers, promos, bumpers, kinetic typography, and five explainer styles that move like video, not slides. Single index.html output. Works with Claude Code, Codex, Gemini CLI, Cursor.
相关推荐
一句话提示词做出产品宣传片?guizang-product-video-skill 完整入门指南(从安装到成片)
一句话提示词做出产品宣传片?guizang product video skill 完整入门指南(从安装到成片) guizang product video s
零代码做视频:remocn搭配Claude Code,一句话指令生成35秒产品宣传片
零代码做视频:remocn搭配Claude Code,一句话指令生成35秒产品宣传片 想让产品宣传片零代码诞生?remocn 是面向 Remotion 的动效组
独立批评家提示词工程:Motion Video Kit 4类 Critic Prompt 模板实战清单
独立批评家提示词工程:Motion Video Kit 4类 Critic Prompt 模板实战清单 Motion Video Kit 是一个用于制作 高级商
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考