技能：極簡解說動畫 — Dracula 暗色（MinutePhysics / 思想啟發風格）
產生符合極簡手繪概念解說影片視覺與節奏風格的分鏡、時間表、視覺腳本及製作提示。
1. 視覺識別與美學規則
- 畫布： Dracula 夜晚背景 (
#282A36)，無漸層、無陰影。 - 線稿： 手繪墨水風格（粉筆/單線條，帶有細微的有機粗糙感），線條粗細一致（
3px–4px），Dracula 前景色 (#F8F8F2)。手機安全下限： 1080p 下所有圖示線條不得低於3px；地平面線使用4px。 - 手機安全字型下限（單一 16:9 YouTube 母版）： 1080p 下所有螢幕文字不得小於
36px。次要標籤36–44px，關鍵標籤48–56px，標題72–80px。若標籤無法以36px容納，則刪減該文字或將其移至旁白，不可縮小字型。 - 調色盤（Dracula）：
- 基底色：Dracula 背景 (
#282A36) + 前景 (#F8F8F2)。 - 表面色：Dracula 當前行 (
#44475A) 用於高亮/活躍卡片；標準面板使用#313342，凹陷區域/螢幕使用#1E1F29。 - 功能性強調色 A：Dracula 紅 (
#FF5555) — 損失、裁員、負面平衡、摩擦。 - 功能性強調色 B：Dracula 綠 (
#50FA7B) — 收益、就業、替代、平衡。 - 輔助強調色（謹慎使用）：粉紅 (
#FF79C6)、紫 (#BD93F9)、青 (#8BE9FD)、橙 (#FFB86C)、黃 (#F1FA8C)。 - 中性填充：Dracula 當前行 (
#44475A) — 用於物體細微填充（桌子、建築物）。 - 深色填充：Dracula 註解 (
#6272A4) — 僅用於較大的填充形狀，不可用於正文。
- 基底色：Dracula 背景 (
- 字體排印：
- 字型風格：乾淨的手寫無襯線字體或休閒字體（例如 Caveat、Patrick Hand）。
- 文字密度：每個標註最多 1–5 個單詞。切勿將整段旁白轉錄至螢幕上。
- 位置：直接放置在相關視覺錨點的上方、下方或旁邊。
- 禁止低對比文字： 次要標籤、說明文字與字幕必須在暗色背景上保持可讀性：使用 Dracula 前景 (
#F8F8F2) 或薰衣草灰 (#B8B9C5)。切勿使用 Dracula 註解 (#6272A4) 或褪色灰色作為文字；在投影機上會消失。 - 禁止左上角場景標題： 不要在內容場景頂部重複旁白作為標題+副標題。旁白傳遞句子；圖表僅傳遞簡短的功能性標籤。這避免了「先讀左上角，再看中間」的眼球乒乓效應。
- 章節卡片是唯一的例外： 章節編號 + 單一圖案可用於全螢幕轉場。保持精簡，切勿添加段落。
2. 角色與隱喻設計
- 角色： 簡單的線條或豆子人。極簡臉部（點狀眼睛、中性/輕微弧度的嘴巴）。透過簡單道具（帽子、桌子、電話）區分角色。
- 概念隱喻：
- 任務/工作：圓形叢集，虛線輪廓淡入/淡出。
- 宏觀經濟：天平、二維折線圖、點狀網格/陣列（例如 1,000 個點）。
- 機構：基本幾何建築線稿，代表進入/職缺的門框。
3. 時間、同步與節奏規則
- 語音同步觸發： 視覺元素在對應單詞被說出的精確音節上繪製或彈出。
- 順序交錯： 將複雜概念分解為離散的視覺元件，並逐一引入（例如 任務 1 $\rightarrow$ 任務 2 $\rightarrow$ ATM 機械臂拉動任務 1）。
- 「呼吸空間」規則（至關重要）：
- 切勿在資產出現後立即轉場。
- 在該點旁白結束後，將完成的畫面保留 1.5 至 3.0 秒 或更長時間。我們需要確保使用者有足夠時間處理所有資訊。
- 觀看者需要時間閱讀標註、理解關係並吸收見解，然後才能繼續動畫。
- 最低處理停留時間（硬性規則）：
- 場景中最後的視覺展示在剪輯前必須至少有 2.0 秒 的螢幕時間。若旁白使其無法實現，則在語境允許時提前展示，或將場景延長至下一個自然停頓處。
- 切勿在完成圖表的同一個詞上進行剪接。
- 如果旁白的最後一句只是過渡語（例如「讓我們來算算數字」、「轉接器能解決這個問題」），則將該段文字移至下一個場景，而不是讓它在螢幕上停留 0.1–0.8 秒。
- 密集場景（多部分圖表、數學、架構）需要將最終狀態保留 2.5–3.5 秒。簡化最後一個節拍，而不是急於剪輯。
- 轉場 = 通過 Dracula 背景的短暫淡出（硬性規則）：
- 使用 4–6 幀 的淡出效果，在 30 fps 下透過
#282A36淡出（0.13–0.2 秒）。不要使用從左到右的擦拭效果；它會讓剪輯感覺機械化。 - 預先載入下一個場景的第一個視覺元素，使暗色間隙僅如眨眼般短暫，絕不留下空白場景。切勿讓空白畫布暴露超過約 0.2 秒。
- 如果場景確實需要章節卡片，請在螢幕上保留一個圖案，使卡片絕非空白文字幻燈片。
- 使用場景開始 + 0.4 秒 的靜止畫面進行驗證。若其為 80% 以上的空白區域，則將第一個視覺元素提前。
- 使用 4–6 幀 的淡出效果，在 30 fps 下透過
4. 構圖與留白
- 留白： 保持畫布的 60%–80% 始終為空白。
- 地平面/基準線： 將人物和建築物錨定在一條不間斷的水平底部導引線上。
- 焦點隔離： 每個節拍保持 1 個活躍焦點區域（左、中或右）。不要同時動畫多個不相關的象限。
- 轉場： 通過 Dracula 背景
#282A36的短暫淡出（4–6 幀）、沿地平面的水平平移，或突然清除至暗色。沒有從左到右的擦拭、炫目的縮放或旋轉。 - 保持大字型
5. 分鏡生成工作流程
當給定旁白腳本或概念主題時：
- 任務層級分解： 將旁白分段為 3–7 秒的視覺節拍。
- 視覺隱喻映射： 為抽象的經濟/技術主張分配具體、極簡的隱喻。
- 螢幕文字選擇： 每個節拍選擇最多 $\le$ 3 個關鍵字進行螢幕強調。
- 時間與停留分配： 標記確切的同步點 (
[SYNC]) 和暫停/停留時間 ([HOLD: Xs])。
6. 輸出模板
對於每個影片場景，依下列格式輸出：
### 場景 [編號]：[場景標題]
**音訊時間戳：** [MM:SS - MM:SS]
**旁白：** "[確切的轉錄段落]"
* **視覺描述：** (1-2 句描述視覺佈局與資產)
* **螢幕文字：** "[確切的文字]" | 位置：[例如，上方-中央] | 顏色：[例如，Dracula 紅]
* **動畫序列：**
1. `[00:00.0 - 單詞]` 在基準線上繪製 [資產 A]。
2. `[00:02.0 - 單詞]` 將 [資產 B] 淡入/滑入 [資產 A]。
3. `[00:03.5 - 單詞]` 標籤伴隨小幅彈跳彈出。
* **動畫後停留：** [X.X 秒]（靜止畫面停留以確保理解，再進行轉場）
* **轉場輸出：** [剪輯 / 地平面向左平移 / 淡出至暗色]
---
#### 1. 線稿與隱喻引擎：**Rough.js**
- **原因：** 若要達到 MinutePhysics 有機手繪感覺，就不能依賴靜態 SVG。[Rough.js](https://www.google.com/url?sa=E&q=https%3A%2F%2Froughjs.com%2F) 是一個輕量級的畫布/SVG 庫，它接收幾何形狀、線條和路徑，並以可調整的「粗糙度」、「彎曲度」和草圖風格的筆觸進行渲染。
- **LLM 友好度：** 非常高。不需要複雜的樣條曲線座標，LLM 只需呼叫：
codeTsx
```
rc.line(x1, y1, x2, y2, { roughness: 1.5, stroke: '#F8F8F2', strokeWidth: 3 });
rc.circle(x, y, diameter, { fill: '#50FA7B', fillWeight: 3, roughness: 1.2 });
```
#### 2. 動畫與時間執行環境：**Remotion (React + TypeScript)**
- **原因：**
- 與傳統的 CSS/瀏覽器動畫（可能掉幀）不同，Remotion 逐幀渲染（fps = 30 或 60）。
- 具有內建鉤子，例如 `interpolate()` 和 `spring()` 用於彈入和線性書寫效果。
- 透過 `useCurrentFrame()` 原生處理音訊時間。
- **實作「繪製」效果：** 對於 SVG 線條筆劃，LLM 將 `strokeDashoffset` 從路徑的總長度動畫至 `0`。
#### 3. 字體排印：**Google Fonts (Caveat 或 Patrick Hand)**
- 透過 `@remotion/google-fonts` 或本地 `@font-face` 直接嵌入字體。
- 將樣式嚴格設定為 `#F8F8F2`，每個標註最多 1–5 個單詞。
#### 4. 音訊同步管線（上游）：**OpenAI Whisper（逐詞時間戳）**
- 在 LLM 進行動畫之前，原始配音會以逐詞 JSON 時間戳（例如透過 Whisper 的 `timestamp_granularities=["word"]`）進行轉錄。
- LLM 接收帶有時間戳的轉錄文字，並將其轉換為幀數：
```
目標幀 = 時間戳（秒） × FPS
```