yuv-video-director
YUV.AI 影片的指揮。你（代理）決定每個節拍需要什麼，將其路由到正確的引擎，將所有內容組合成一個 HyperFrames 組合，包裹上 YUV.AI Neon Phoenix 品牌，自我驗證，並渲染為 MP4。此技能是路由器和工作參考實作；僅在該引擎啟用時載入參考檔案。
設計真相來源：
yuv-design-system技能（Neon 模式 — 粉紅色#FF1464、青色#00E5FF、深黑/白色、Anton+Inter+JetBrains Mono、神經網路鳳凰圖案）。其影片形式為frame.md— 請參閱 references/frame-md.md。捆綁模板：assets/FRAME.md。將其放入專案根目錄；HyperFrames 會讀取它。
唯一法則（決定一切）
HyperFrames 透過在無頭 Chrome → FFmpeg 中尋找每個影格來渲染（frameIndex = floor(t·fps)，相同輸入 → 相同輸出）。因此，每個視覺元素分為兩類：
| 模式 | 運行方式… | 引擎 | 規則 |
|---|---|---|---|
| 即時可尋找適配器 | 在渲染內部，每個影格驅動至時間 t | GSAP、Lottie（window.__hfLottie）、Three.js、由 GSAP 代理 onUpdate 驅動的畫布 | 必須是時鐘驅動 — 無 Date.now()、Math.random()（種子化 mulberry32）、setTimeout 或 .play() |
| 預渲染資產 | 離線，輸出檔案，作為剪輯匯入 | ManimCE（Python→MP4/alpha）、TTS 音訊、背景移除 | 先渲染，然後作為 <video>/資產剪輯放入 |
如果可以尋找，就是適配器。如果不能，就預渲染。 Manim 始終是預渲染剪輯 — 它有自己的渲染器並在 Python 中執行；永遠不能成為即時適配器。
將每個節拍路由到引擎
"以 TEASER/宣傳片解釋 X（FOMO、懸念、快速）" → references/teaser-explainer.md（公式）
"解釋概念 / 數學 / 神經網路 / 演算法 / 訓練" → ManimCE （預渲染剪輯 — 為宣傳片切割成 BURSTS）
"品牌動態：標誌閃現 · 統計數據揭示 · 圖示彈出 · 脈衝" → Lottie （即時，lottie-web）
"動態字幕 · 標題 · 揭示 · 轉場 · 數據標註" → GSAP （即時）← 預設
"3D / 空間" → Three.js （即時） （不使用 Babylon）
語音 → 字幕 → 轉錄 + 核准網頁應用（參閱 video-edit 技能）
未提供旁白 → TTS（Kokoro：npx hyperframes tts）
品牌顏色 / 字型 / 圖案 → frame.md （前端提取）
GSAP 是文字/動態的可靠預設項。對於設計的品牌圖形，使用 Lottie；對於解釋想法，使用 Manim。
工作流程
- 規劃節拍。 敘事弧線 + 每個節拍所需的引擎。選擇 16:9 和/或 9:16。
- 設定品牌。 確保專案根目錄中有
FRAME.md（複製 assets/FRAME.md）。所有顏色/字型/圖案都來自它 — 絕不發明。每個影片的三個品牌必備要素（參閱 references/brand-kit.md + references/cinematic.md）：在揭示和結束卡上使用真實鳳凰標誌（assets/logo-phoenix.png）、真實特色 Lottie（生成一個 — assets/lottie-burst-generator.py），以及連結結束卡（標誌 + "LET'S FLY HIGH" + 完整連結集 + CTA）。對於宣傳片/社交節奏，參閱 references/editing.md；對於心理/懸念/FOMO 剪輯，參閱 references/cinematic.md。 - 首先預渲染資產節拍（使它們作為剪輯存在）：
- Manim → references/manim.md + assets/manim-scene-template.py。執行
py -m manim render -qh --fps 30 scene.py SceneName，將 MP4 複製到assets/。 - 字幕/TTS → 重複使用
video-edit技能（轉錄 → 核准網頁應用 → 同步）和npx hyperframes tts。
- Manim → references/manim.md + assets/manim-scene-template.py。執行
- 搭建框架 + 組合。 執行
npx hyperframes init <slug> --non-interactive。編寫index.html（hyperframes技能是合約）。使用：- 可尋找的神經網路場背景 → assets/neural-net-field.js
- Lottie 品牌方式 → references/lottie.md + assets/neural-pulse.json
- Manim 渲染作為
<video class="clip" muted playsinline>主體剪輯 - 每個場景的 GSAP 入場、邊界的霓虹閃光轉場、僅在最終場景淡出
- 對於宣傳片 / 社交節奏（快速硬剪輯、動態文字撞擊、鉤子蒙太奇、故障/色度刺擊） → references/editing.md — 像製片人而非幻燈片一樣剪輯
- 自我驗證（閘門）。 references/gates.md：執行
npx hyperframes lint（0 錯誤） → 執行validate（0 控制台錯誤，WCAG AA） → 渲染 → 在時間軸上抽查 5 個影格。修復 → 重新執行。Lottie 必須透過螢幕截圖驗證（Skottie 與 lottie-web 的陷阱）。 - 渲染。 執行
npx hyperframes render --fps 30 --output renders/<name>_FINAL.mp4。對於垂直格式，使用 1080×1920 佈局複製（參閱video-edit）。
先決條件（先檢查；優雅降級）
參閱 references/prereqs.md。需要 Node 22+、FFmpeg、Python 3.11+ 含 pip（Manim/字幕）。在此機器上：真實 Python 是 py → C:\Python313（裸機 python 是 Hermes 的虛擬環境，沒有 pip — 不要使用它）。ManimCE 透過 py -m pip install manim 安裝（如果使用 Text()/MarkupText 而非 Tex/MathTex，則不需要 LaTeX）。如果 Manim 不可用 → 跳過數學節拍或提供安裝選項；絕不硬性失敗整個影片。
此技能捆綁的內容（通過 lint 和渲染的參考實作）
| 檔案 | 說明 |
|---|---|
| assets/FRAME.md | YUV.AI Neon Phoenix 影片影格規格（從 HeyGen 的 Coral 包重新品牌） |
| assets/neural-net-field.js | 確定性、可尋找的神經網路鳳凰畫布背景 |
| assets/neural-pulse.json | 手寫的 Bodymovin Lottie（在 lottie-web 中渲染，不僅僅是 Skottie） |
| assets/gen_content_lotties.py | 生成器，用於 6 個生產級內容 Lottie（WhatsApp-collapse、decode-beam、eye-read、ghost-line hero、orb-extract、brain-fire）— 透明、持久+連續、經 lottie-web 驗證 |
| assets/{wa-collapse,decode-beam,eye-read,ghost-line,orb-extract,brain-fire}.json | 6 個生成的內容 Lottie，可直接放入 |
| assets/manim-scene-template.py | ManimCE 場景模板，霓虹品牌樣式，僅文字（無 LaTeX） |
| assets/what_is_nn.py | "什麼是神經網路" ManimCE 場景（神經元 → 網路 → 訓練，34.5 秒） |
| assets/Anton-Regular.woff2 | 本地 Anton（渲染器不會自動解析；需宣告 @font-face） |
| references/composition-pattern.md | 完整的多引擎 index.html 模式（場 + Lottie + Manim 剪輯 + GSAP + 閃光） |
| references/teaser-explainer.md | 電影宣傳片解釋公式：冷開場撞擊 → manim BURSTS → 對峙 → FOMO 蒙太奇 → 懸念；內容同步的透明 Lottie 節拍；尋找模數修復；宣傳片音樂合成 |
配套技能
hyperframes（組合合約 — 編寫時始終調用）、hyperframes-cli、lottie、video-edit（轉錄 + 核准網頁應用）、yuv-design-system（品牌）。此技能協調它們。