anim-skill · 端到端動畫生成
一個主題進，一支片子出。畫面全部由程式碼逐幀繪製（Remotion + React），不依賴任何素材庫、生成式影片模型或外部圖片。
風格是插件，語音是插件，流程是固定的。 加新風格不改流程，換語音引擎不改流程。
何時用
- "幫我做一支 X 的講解動畫"
- "把這份文件/教案做成影片"
- "給這個片子配上解說"
- "換成 X 風格重做一版"
- "檢查一下這支片子有沒有閃爍/空場"
不要用在：需要實拍素材、需要人物口播、需要 3D 渲染（走 Blender 那套）。
輸入：兩種模式，先判定
| 模式 | 觸發條件 | 多做的一步 |
|---|---|---|
| A · 主題驅動 | 使用者只給了一個主題詞或一句話 | 先做調研（事實、數字、常見誤區），再進入設計 |
| B · 文件驅動 | 使用者已經給了主題文件（教案、白皮書、PPT 稿） | 先做細化與修正（補數據、統一術語、標出無法可視化的段落），再進入設計 |
判定後先複述一遍再動手：我按 A/B 模式、做 N 秒、什麼風格、給誰看。 這四件事裡有兩件不清楚就問，別猜。
六個階段（順序不可跳）
0 PREFLIGHT → 1 內容 → 2 分鏡 → 3 構建 → 4 配音 → 5 驗收交付
↑ ↓
└── 返工 ←──────┘
0 · PREFLIGHT（一次性，2 分鐘）
node <skill>/scripts/preflight.mjs
檢查 node / npm / ffmpeg / 瀏覽器；打印本機可用的語音引擎。 任一項缺失就先說清楚，別到渲染時才發現。
1 · 內容（A 調研 / B 細化）
產出 research.md：一句話論點、3–6 個支撐事實、數字與出處、必須避開的錯誤說法、受眾已知與未知。
- A 模式：查證為主。每個數字都要有來源，查不到就標"待確認"，不許編。
- B 模式：以原文為準，只補不改。原文裡無法可視化的句子要標出來（動畫只能畫動作、對比、變化）。
2 · 分鏡
產出 plan.md（格式見 references/storyboard.md）：每鏡頭一行——幀區間、畫面、動作原語、字幕。
硬性判據（不滿足就重寫）：
- 每鏡頭一個主角，佔內容區高度 ≥1/3（圖形 ≥170px，大字 ≥96px 且整行 ≥300px）
- 主角在第 1 或第 2 個節拍入場
- 尺寸只有三檔：主角 ≥170 / 配角 60–110 / 說明 22–30
- 全片 ≥1 處"高光時刻"（論點句、主角登場、收尾 payoff 三選一），不要靠堆裝飾湊
3 · 構建
node <skill>/scripts/scaffold.mjs <專案目錄> --title "標題" --style <風格id>
按風格 brief（styles/index.json）寫 src/scenes/*.tsx，用 <Series> 串幕。
鐵律（違反會毀掉渲染或讓片子崩）：
- 一切由
useCurrentFrame()推導。禁Math.random()、Date.now()、setState計數器。 隨機要確定性：hash(seed) = fract(sin(seed*127.1+311.7)*43758.5453)。 - 每個
interpolate()必須帶{extrapolateLeft:'clamp', extrapolateRight:'clamp'}。 少一個，鏡頭外的幀會飛出去。 - 禁 CSS
transition/animation/@keyframes。動效只走interpolate與spring。 - 不引外部素材與重依賴（three.js / GSAP / 圖片）。要畫面就畫 SVG 與 CSS 漸變。
- SVG 模糊原語同幀 ≤12 個，
filter: blur()元素 ≤15 個，否則渲染慢十倍。
4 · 配音（可選）
node <skill>/scripts/srt.mjs <專案目錄> # 由分鏡生成 SRT
python <skill>/scripts/narrate.py <video> --provider edge|volc --voice <id>
- 沒配音也能交付（課堂有老師講）。
- 有配音時先出 SRT 再合成，時間軸取自渲染幀號，不靠估算。
- 引擎是插件，見
references/voice.md。
5 · 驗收與交付
python <skill>/scripts/qc.py <video> # 空場 / 主體尺寸
python <skill>/scripts/qc_flicker.py <video> # 閃爍 / 硬切定位
兩條硬指標（見 references/qc.md）：
- 空場：內容區最大物體 <110px 持續 >45 幀 → 缺陷；<80px → 阻斷
- 閃爍：亮度對局部中位數偏移 >6（0/1 跳變）→ 缺陷
交付清單：<slug>.mp4、<slug>.srt、plan.md、research.md、src/（可編輯專案）、
README.md（怎麼改、怎麼重渲）。
風格插件
styles/index.json 內置 15 種，每種是一條可執行的 brief（底色、墨色、七色、線寬、抖動、發光、紋理、字體、氣質、投影可讀性、適合什麼）。
呼叫方式：--style neon / --style paper / --style crayon …
加新風格：往 index.json 追加一條 + 在 styles/ 放一份 brief，
不需要改流程、腳本或模板。見 references/styles.md 的擴展契約。
選風格的經驗：先按"投影可讀性"篩（後排能不能看清），再按"氣質"篩。 紙藝/蠟筆適合幼兒，霓虹/極簡適合投影差的教室。
語音插件
內置兩家：
| provider | 費用 | 需要 | 備註 |
|---|---|---|---|
edge | 免費 | 無 | 微軟 Azure 神經語音，偏播報 |
volc | 0.0003 元/字元 | APPID + API Key | 豆包語音，接近真人；新號有免費額度 |
加新引擎：實現 synthesize(text, voice) -> mp3 bytes 並註冊進
scripts/tts/<provider>.py，narrate.py 不用改。見 references/voice.md。
交付前自檢（逐條打勾）
-
remotion render退出碼 0，ffprobe幀數 = 設計幀數 -
qc.py無阻斷項；qc_flicker.py除章節硬切外無尖峰 - 所有
interpolate帶 clamp（grep -c "interpolate("=grep -c "extrapolateLeft"） - 無
Math.random/Date.now/ CSS animation - 字幕與畫面能對上（抽 3 個節拍核對）
- 中文字體在本機存在（否則渲染出方塊）
一頁速查
node scripts/preflight.mjs
node scripts/scaffold.mjs ./videos/my-film --title "標題" --style paper --seconds 20
cd videos/my-film && npm install
node <skill>/scripts/render.mjs . main out/my-film.mp4
node <skill>/scripts/srt.mjs .
python <skill>/scripts/narrate.py out/my-film.mp4 --provider volc --voice zh_female_cancan_uranus_bigtts
python <skill>/scripts/qc.py out/my-film-volc.mp4
細節在 references/：pipeline.md（每階段展開）、storyboard.md（分鏡模板）、
styles.md（風格目錄與擴展）、voice.md（語音與擴展）、qc.md（驗收判據）、
render-env.md（環境坑：Windows 沙箱、TEMP、瀏覽器路徑、ffmpeg 參數）。