---
name: ai_ancient_chat_creator
description: 當使用者要求「製作AI古人聊天室」、「設計古人聊天室」、「古人聊天室」、「AI歷史人物聊天室」、「古人LINE聊天室」、「建立古人對話網頁」、「古人教學網頁」或指定歷史人物（如蘇軾、李白、白居易、辛棄疾等）要求製作聊天室與自學學習單時觸發。此 Skill 指引 AI 遵循階段一至六標準流程，一條龍完成角色考證、對話劇本庫、鋼鐵人設 System Prompt、原生 LINE 風格 HTML/CSS/JS 網頁、課堂無感驗證機制，並自動產出 A4 雙面 2 頁之 Word/PDF 學生學習單與朱紅教師解答版。
---

# AI 古人聊天室與互動教材開發指南 (AI Ancient Chat Creator)

本 Skill 為**全域專屬 Skill**（安裝於 `~/.gemini/config/skills/ai_ancient_chat_creator/`），適用於國語文、歷史或跨領域教學專案。當老師提供古人名號、經典課文，並說出「製作AI古人聊天室」、「古人聊天室」、「設計古人LINE對話」等需求時，AI 應扮演專屬教材與互動開發引擎，遵循以下標準作業流程（SOP），產出**兼具離線備援與 AI 即時對話**的原生網頁，並同步生成**A4 雙面精準排版學習單**。

---

## 1. 觸發關鍵字與啟動條件

### 觸發關鍵字清單
- **完整功能詞**：「製作AI古人聊天室」、「設計古人聊天室」、「古人LINE聊天室」、「AI歷史人物聊天室」
- **簡短指令詞**：「古人聊天室」、「古人對話網頁」、「做古人聊天」
- **人物教學情境**：「幫我做[人物]的聊天室與學習單」、「將[人物]做成AI聊天室」（如：蘇軾、白居易、李白、辛棄疾、歐陽脩、陶淵明等）

---

## 2. 標準開發流程（SOP 六大階段）

```mermaid
flowchart LR
    A[階段一：角色史料考證與人物建模] --> B[階段二：精選劇本與考核題庫]
    B --> C[階段三：鋼鐵人設 System Prompt]
    C --> D[階段四：LINE 風格前端 UI 開發]
    D --> E[階段五：課堂防呆驗證與 API 串接]
    E --> F[階段六：A4 雙面自學學習單產出]
```

---

### 階段一：角色史料考證與人物建模（人設卡）

在撰寫程式碼前，AI 必須先建立結構化「人物設定卡」：

1. **基本檔案庫**：
   - 姓名、字號、朝代、生卒年、代表官職與別稱（例：白居易／字樂天／香山居士／唐代／詩魔、詩奴）。
2. **性格特質與語氣規範**：
   - 說話口吻（如豪放灑脫、憂國傷時、詼諧自嘲、恬淡安詳）。
   - 習慣稱謂（自稱：老夫、不才、山人、某；對學生稱呼：小友、同窗、使君、諸生）。
3. **生平關鍵事件軌跡**：
   - 貶謫與遷徙歷程（如江州司馬、黃州團練副使、嶺南流放）。
   - 文人朋友圈與互動（如元白之交、蘇黃佛印、辛陳鵝湖之會）。
4. **核心教材名篇與名句彈藥庫**：
   - 嚴選 6～10 篇中小學課綱核心選文（如〈長恨歌〉、〈琵琶行〉、〈慈烏夜啼〉、〈問劉十九〉），作為聊天引經據典的核心。

---

### 階段二：對話劇本與預設內容設計（離線備援模式）

為避免課堂遇到無網路或 API 額度用盡的窘境，必須內建**免金鑰預設輪替對話庫**（放在 `app-data.js`）：

1. **四大固定主題選單**：
   - 👦 **自我介紹**：家世、字號由來、個人癖好（品茗、釀酒、寫詩成癖等）。
   - 📜 **得意作品**：針對課綱必讀名篇，透露創作背景、心情與幕後花絮。
   - 🍵 **八卦趣聞**：古籍野史與文壇掌故（如長安米貴居大不易、老嫗能解、東坡肉由來）。
   - 👥 **文人朋友圈**：與當代名流互贈詩文、交誼互虧或友情考核。
2. **多輪替對話結構**：
   - 每個主題至少規劃 3～5 組隨機輪替對話（含逐句文字、語音/貼圖提示）。
3. **「友情考核」闖關題庫**：
   - 5～6 題具高誘答力之選擇題或填空題，答對或答錯古人皆有生動詼諧的反饋點評。

---

### 階段三：鋼鐵人設 System Prompt 與 AI 動態機制

當使用者切換至「自由 AI 對話」時，System Prompt 必須具備三層安全約束：

1. **鋼鐵防護罩（防出戲／Roleplay Anchor）**：
   - 嚴格鎖定時代視野：古人不知道當代科技產品，若學生提及手機、網路、AI，古人應以古典視角視其為「西洋奇巧之物」或「傳信靈符」，不得出戲承認自己是語言模型。
   - 嚴格禁止出現任何現代 AI 助手腔（如「我是由 Google 開發的模型...」）。
2. **教學特色互動彩蛋（靈魂機制）**：
   - **詩意抽考**：隨機向學生抽考名作名句的意境或字義，由古人親自判讀評分。
   - **文風診斷所 / 仿作挑戰**：例如白居易的「老嫗能解診斷所」（替學生的白話隨筆把脈）或蘇軾的「豁達人生解憂雜貨店」。
3. **回覆規格約束**：
   - 單次回覆長度嚴格控制在 150～250 字內，契合手機通訊軟體閱讀體驗。
   - 支援動態模型輪詢（Dynamic Model Discovery）機制，防止 API 廢棄中斷。

---

### 階段四：前端視覺與 LINE 風格 UI/UX 開發

依據奕鈞老師開發規範：**最乾淨的原生 HTML/CSS/JS**，點擊兩下即可直接開啟，不需編譯安裝。

1. **介面佈局（LINE 風格）**：
   - **頂部導航列**：綠白或古典淡米色主題，標註人物頭像、姓名、朝代、連線狀態綠燈與稱號標籤。
   - **中央訊息滾動區**：獨立捲動（`overflow-y: auto`），支援左右對話氣泡、打字中動畫（Typing indicator）、表情貼圖渲染。
   - **底部控制區**：固定於底部，具備主題切換選單、友情考核按鈕、AI 對話切換鈕與訊息輸入框。
2. **響應式設計 (RWD)**：
   - 手機直式滿版操作（`100dvh`），虛擬鍵盤彈出時不遮蔽輸入框與最新對話。
   - 電腦端以擬真手機外框（480px～600px）居中呈現，背景襯以雅致古典底圖。
3. **主題圖像資產**：
   - 調用生圖工具或使用現有素材，於 `assets/` 放置彩色漫畫風人物頭像及特色表情貼圖。

---

### 階段五：課堂存取與金鑰安全機制（零摩擦進場）

讓全班 30 位學生免註冊、免填 Key、一秒直接進入：

1. **通關密碼驗證（Classroom Passcode）**：
   - 點擊 AI 對話時跳出通關碼輸入框，輸入課堂 6 位數代碼即解鎖。
2. **URL 帶參自動免密登入**：
   - 投影 QR Code 直接帶入參數（如 `index.html?code=2762625`），學生掃碼免輸入直接對話。
3. **訪客自備 Key 備用通道**：
   - 支援外校老師或自學者自行填入 Gemini / Groq API Key。
4. **安全代理轉發架構**：
   - 若有伺服端需求，透過 Cloudflare Worker 代理驗證 pass-code，不洩漏官方 API Key。

---

### 階段六：教學配套延伸（A4 雙面自學學習單一條龍）

將聊天室互動直接轉化為課堂學習成果：

1. **標準 A4 雙面 2 頁規格（絕不爆頁）**：
   - **正面（第 1 頁）**：
     - 作家履歷小檔案（字號、朝代、文學地位）。
     - 聊天室初探任務（自我介紹與得意作品的對話觀察筆記）。
     - 核心課文詩意精讀。
   - **背面（第 2 頁）**：
     - 八卦冷知識與典故考證。
     - 友情大考驗闖關（精選選擇題 + 典故填空）。
     - 人機協作任務（如「AI 詩意抽考通關記」或「寄物託志四句詩創作」）。
2. **雙軌實體檔案輸出規範**：
   - **學生練習版**：供列印書寫的底線填空與問答框。
   - **教師解答版**：所有空格填入**朱紅色加粗底線答案**，附上白話教學語譯與創作示範。
3. **產出實體檔案**：
   - 統一使用 Python 腳本（`python-docx` / `playwright`）產出 Word (`.docx`) 與 PDF (`.pdf`) 至 `output/`。

---

## 3. 專案目錄結構標準

每次建立新的古人聊天室專案，統一遵循以下乾淨結構：

```text
├── index.html                  # LINE 風格古人聊天室主程式
├── styles.css                 # 響應式現代 CSS 樣式
├── app.js                     # 互動核心邏輯與 AI 串接
├── app-data.js                # 離線備援：主題對話劇本庫與友情考核題庫
├── assets/                    # 人物漫畫立繪、頭像、表情包貼圖
├── scripts/
│   └── build_worksheet_docx.py # 自動化排版生成雙面 A4 Word 學習單腳本
└── output/
    ├── word/
    │   ├── [人物]學習單_學生版.docx
    │   └── [人物]學習單_教師解答版.docx
    └── pdf/
        ├── [人物]學習單_學生版.pdf
        └── [人物]學習單_教師解答版.pdf
```