十五画境 · MG 动画手艺书

这不是模板库。这里写的是怎么从一句「我想要这种感觉」做到一支对味的片子：每种风格靠什么被一眼认出来、关键手法的具体参数、最容易做砸的地方、做完怎么检查。风格不止卡上这些，工具也不止一种：用户要什么效果，你来分析该用哪种风格、哪些手法、哪个工具，自己写代码，做一支新片子。

模型越强，做出来越好；但只要照着流程走、用好脚手架，一般的模型也能做到「像样」。

先判断你走哪条路

• 能写代码、能运行命令（Claude Code、Codex、Cursor、带代码执行的国产 Agent 等）：按「完整流程」做，自己写画面代码，用脚手架导出 MP4。
• 只能聊天、不能运行代码：照样按流程写出完整代码（一个 HTML 文件夹），告诉用户怎么打开和导出（见 references/02-渲染与导出.md 最后一节）。不要说「视频已生成」。

再判断你的能力档位（拿不准就按「一般」）：

• 强：读通用手艺 + 风格卡的全部内容，可以自己设计镜头、写着色器、做复杂角色，按需要混用 Three.js 和 Remotion 镜头卡。
• 一般：完整流程照走，但第 1～3 步只按 references/09-从需求到方案.md 填简报、定一种风格、写分镜（不混风格、不用 Remotion）；手艺只读 references/05-一般模型怎么做.md 和对应风格卡的「最小可行做法」，直接改 starter/ 里的骨架，只用 Canvas 2D，一次只用 2～3 个手法，把它们做干净，比堆一堆半成品好得多。

完整流程（每一步都不要跳）

1. 需求简报：你先填一张简报表（用途、给谁看、要记住的一句话、想要的感觉、时长画幅、必须出现的东西、素材、声音），每行写判断和依据，只问 1～3 个真定不了的事。再定是全权做（默认，自己拍板）还是共同创作（用户想参与，就在简报、方向静帧、分镜三处停下来确认）。见 references/09-从需求到方案.md。
2. 定方案：把用户说的感觉翻译成一种动效性格；选风格（风格卡里有的直接用，要混就一主一辅，卡里没有的先照 references/styles/_新风格卡模板.md 写卡）；给每件要讲的事配一个手法（十五画境自己的，或 video-shotcraft 的镜头卡）；每一镜挑工具（references/10-工具怎么选.md）。要做合集（每种风格一段再拼起来），再读 references/08-单风格与合集.md。
3. 方向静帧和分镜表（还不写动画）：先出 2～3 个方向各 2 张静帧，挑定一个；再写分镜表，一镜一行：时间、画面、唯一的主动作、用什么做、落定后停多久、声音。规则见 references/09-从需求到方案.md 第 6～7 节和 references/00-工作流程.md。
4. 读风格卡（用了几种风格就读几张）：references/styles/<风格>.md。先读「最容易做成不像的原因」那一节——那是对照原版总结的版式、零件和戏，照着搭骨架；再把「必备元素」逐条对到分镜表上，缺哪个补哪个。宁可零件多、画面满，不要几个元素飘在空白里。
5. 先做静帧：用脚手架搭好页面，只做 4～6 个关键时刻的静止画面，截图自己看。构图、字号、配色、留白都过关了再加动画。
6. 再做动画：按 references/01-通用手艺.md 的缓动、错峰、预备、回弹参数来，一次只动一个主体；再按 references/07-动画手艺进阶.md 加三层动、镜头、进退场和段间衔接（工具在 starter/lib/motion.js）。用 Remotion 镜头卡的镜头，按 references/10-工具怎么选.md 第 3 节渲好、换掉品牌和配色，再用 lib/clip.js 拼进来。
7. 配声音：用脚手架的合成器写配乐和音效，卡在画面的节拍点上。
8. 体检、导出、自查：先跑 node tools/check.mjs（字号、反差、平台遮挡、文字重叠、画面停住、节奏、响度），报告里的问题改完再导出 MP4；再按 references/04-自查与评审.md 看一遍，改掉问题再交付。改了一轮就用 node tools/compare.mjs 旧.mp4 新.mp4 并排比，看不出明显变好的不留。
9. 独立复查：能开子 agent 的环境（Claude Code、Codex 等），交付前另开一个新的子 agent 做复查：只给它成片、分镜表和 references/04-自查与评审.md，不给你的聊天记录，让它抽帧看、按评审表打分、列问题。自己看自己的片子，总会替自己说好话。它提的问题改完再交付；开不了子 agent 就自己按评审表逐条查，并在交付说明里写「没做独立复查」。
10. 交付：MP4 + 源码文件夹 + 一段说明（简报表、为什么选这个风格和这些工具、每个必备元素在哪一秒、已知的不足、字体 / 图片 / 音乐 / 镜头卡的来源清单）。

文件地图

想做什么	读
不知道怎么开始	references/00-工作流程.md
用户只说了感觉，怎么定风格、手法、分镜	references/09-从需求到方案.md
这一镜用 Canvas、Three.js 还是 Remotion，怎么拼在一起	references/10-工具怎么选.md + starter/lib/clip.js + starter/tools/remotion.mjs
风格卡里没有的风格	references/styles/_新风格卡模板.md
混风格或没有风格卡时的配色	starter/lib/looks.js
节奏、缓动、排版、配色这些通用手艺	references/01-通用手艺.md
让动画更好看：三层动、镜头、进退场、关键帧、文字动法、段间衔接	references/07-动画手艺进阶.md
单风格出片，或几种风格各一段拼成合集	references/08-单风格与合集.md
搭页面、逐帧渲染、导出 MP4、合成配乐	references/02-渲染与导出.md + starter/
别人踩过的坑	references/03-踩坑清单.md
做完怎么检查、怎么打分	references/04-自查与评审.md + starter/tools/check.mjs
改前改后并排比，决定留哪版	references/04-自查与评审.md「并排打磨」+ starter/tools/compare.mjs
模型不太强时的稳妥做法	references/05-一般模型怎么做.md
字体、图片、音乐、镜头卡能不能用，发布要注意什么	references/06-版权与素材.md + references/10-工具怎么选.md 第 4 节
某种风格的门道	references/styles/<风格>.md
看看完整的代码是怎么写的	examples/（参考作品：学手法，不要照抄内容）

底线

• 原创：风格要学到位——版式、零件、节奏、质感都照风格卡来，这不是抄；但主体、文案、角色、具体构图和配乐必须是自己的。品牌名用用户自己的，没有就编一个。用了镜头卡，示例品牌和示例界面都要换掉。
• 素材合法：字体、图片、音频只用可商用的（OFL、CC0、公有领域、用户自己的）；中文字体把 OFL 的 "Noto Sans SC" 写在最前面；不放别人的商标和 IP 角色。交付时附来源清单，细则见 references/06-版权与素材.md。
• 确定性：每一帧只由时间 t 决定（不用 Date.now()、不用不带种子的随机数），否则导出会抖、会对不上。
• 诚实：没导出成功就说没成功；做不到的风格特征就写进「已知不足」。