DESIGN.md — 備課神隊友簡報系統設計文件

這份文件是本簡報模板專案的品牌脊柱（Brand Spine），記錄所有視覺決策、排版規則、色彩系統與內容架構，供 AI 工具與協作者對齊使用。

1. Product Context（產品定位）

核心訊息：AI 工具能降低教師備課門檻，讓創意教學回歸人的本質——好奇心與互動。

2. Aesthetic Direction（美學方向）

整體風格定義

一句話描述：乾淨現代的教育科技風，以高可讀性為底，用局部視覺強調引導注意力。

關鍵風格關鍵字：

• Modern Educational（現代教育感）
• Clean & Structured（整潔有結構）
• Approachable Tech（親切科技感）
• Content-first（內容優先）

刻意避免的設計模式（Anti-patterns）

3. Design Tokens（設計語彙）

色彩系統

強調色 #FFCC00 源自簡報內 YAML 樣式範例的 Modern Business 主題，與好奇學院的活潑教育定位一致。

字型系統

字重使用原則：

• 頁面唯一主標 → Extra-bold
• 重點詞彙強調 → Bold + color-accent 底色
• 說明性內文 → Regular，行高 1.6

間距系統

4. Content Architecture（內容架構）

簡報整體結構

封面頁
├── 主標題：備課神隊友
├── 副標題：用 AI 工具解放你的教學創造力
├── 說明文：從靈感發想到課堂簡報的一站式解法
├── 講師：好奇學院 潘怡安
└── 頁腳：圖/文：好奇學院

講師介紹頁
├── 姓名：潘怡安
├── 核心理念引言
└── 經歷條列

目標與預期成果頁（Learning Objectives）
├── NotebookLM 成果預覽
├── Napkin AI 成果預覽
└── Canva Code 成果預覽

─────────── Section 1 ───────────
Section Divider：深度解析 / Section 1

1｜ Notebook LM 是什麼？（工具定義）
2｜ 運作模式（4步驟流程）
3｜ Notebook LM vs ChatGPT/Gemini（比較表）
4｜ 功能一覽（功能表格）
5｜ 台灣地區功能可用性（方案對照表）
6｜ Audio Overview（音訊功能介紹）
7｜ Video Overview（影片功能介紹）
8｜ 簡報生成與編輯（操作步驟）
9｜ 簡報生成與編輯：修改內文
10｜ 進階技巧：YAML 提示詞（含步驟說明）
11｜ YAML 提示詞模板（Prompt 文字框）
12｜ YAML 風格描述與簡報範例對照（9種風格卡）
13｜ 第三方工具：NotebookLM 簡報編輯器
14｜ 教師為何需要 Notebook LM？（4大效益卡）
15｜ 教師應用情境（場景表格）
16｜ 學生應用情境（3大能力圖示）
17｜ 10 個教師實用場景（清單）
實戰訓練頁：Notebook LM 學習目標

─────────── Section 2 ───────────
Section Divider：圖表神器 / Section 2

1｜ Napkin AI 是什麼？（工具定義）
2｜ Napkin AI 介面一覽（截圖說明）
3｜ Napkin AI 功能示範（操作展示）
實戰訓練頁：Napkin AI

─────────── Section 3 ───────────
Section Divider：打造互動內容 / Section 3

1｜ Canva Code 是什麼？（工具定義）
2｜ 操作示範：抽籤機（含提示詞）
3｜ 操作示範：時間軸（含提示詞）
4｜ 操作示範：配對遊戲（含提示詞）
5｜ 操作示範：閃卡（含提示詞）
6｜ 操作示範：互動網頁幻燈片（含提示詞）
7｜ Canva Code 分享方式（操作步驟）
8｜ 操作示範：可編輯簡報（功能說明）
實戰訓練頁：Canva Code

─────────── 補充介紹 ───────────
1｜ 認識 Manus：全能 AI 助手（工具對照）

5. Slide Patterns（投影片模板類型）

每種模板對應反覆出現的版面結構，便於 AI 工具或設計者快速套用。

Pattern A：封面頁（Cover）

• 全版背景（白或淺色）
• 大型中文主標題（Extra-bold，居中或左對齊）
• 英文或小字副標題
• 講師資訊左下角
• 品牌 Logo 右下角

Pattern B：Section Divider（章節分隔頁）

• 背景可用深色或強調色填滿
• 超大中文標題（如「深度解析」）置中
• 「Section N」英文標籤，細字，位於標題下方
• 無其他文字元素，強調過渡節奏

Pattern C：工具定義頁（Tool Intro）

• 左側：圖示 + 工具名稱（大標）
• 右側或下方：3–4 個功能要點（條列）
• 每條要點前有 Emoji 或幾何圖示

Pattern D：比較表頁（Comparison Table）

• 標題：「A vs B」
• 全寬表格，列為功能維度，欄為工具
• 末行或頁腳加一句結論語

Pattern E：功能卡片頁（Feature Cards）

• 標題區（頂部）
• 主體：2×2 或 1×4 卡片陣列
• 每卡片：圖示 + 小標題 + 1–2 行說明

Pattern F：步驟流程頁（Step Flow）

• 編號圓形（1 / 2 / 3 / 4）橫向或縱向排列
• 每步驟：標題 + 說明文
• 可加箭頭連結符號

Pattern G：提示詞展示頁（Prompt Showcase）

• 深色代碼區塊（code block 風格）放置提示詞原文
• 說明文字在上方或側邊
• 標注欄說明各提示詞參數位置

Pattern H：截圖說明頁（Screenshot Walkthrough）

• 左側：操作截圖（帶標注圈圈 ❶❷❸）
• 右側：對應操作步驟文字
• 頁腳：注意事項或使用限制說明

Pattern I：實戰訓練頁（Hands-on Training）

• 大標「XXX 學習目標 / 實戰訓練」
• 單一核心任務說明
• 提示詞範例（code block）
• 視覺簡潔，留白充足

Pattern J：人物介紹頁（Speaker Bio）

• 左側：個人照片或圖示
• 右側：姓名、職稱、核心引言
• 下方：條列式經歷

6. Recurring UI Elements（反覆出現的 UI 元素）

7. Content Tone（內容語氣）

8. Decisions Log（設計決策紀錄）

本文件應與簡報主檔案放置於同一目錄，版本迭代時同步更新 Decisions Log。