「國語演說比賽訓練 Pro」是阿凱老師為桃園市 / 全國語文競賽選手與指導老師打造的 單檔 5705 行 HTML / 322 KB 自製培訓系統，部署在 cagoooo.github.io/speech/，當前 v2.7.2 累計 57 項功能、進度表獨立 113 KB HTML 檔。從 #25 入門版（Google Sites Embedded）升級重構而來，是「漸進式工具家族」最完整的案例之一。
🎯 核心特色
- 📚 107 道題庫 × 7 大分類 — 品格道德 / 生活體驗 / 自然環境 / 夢想未來 / 社會關懷 / 科技創新 / 文化傳承，真實比賽題目彙整含「113 年新北市語文競賽國語演說參考題庫」等官方資料連結，不是 AI 即時亂生
- ⏱️ 雙階段計時器（正式比賽規格） — 準備倒數 5/10/20/30 分鐘可選（對應正式賽 30 分鐘）+ 演說計時 3/4-5 分鐘 + 真實扣分規則內建（每少超 30 秒扣 1 分）+ 4 分鐘 🟢 5 分鐘 🔴 燈號 + Web Audio 合成倒數最後 1 分鐘三音階漸強提示音
- 🎤 Web Speech API 即時逐字稿（殺手鐧）—
webkitSpeechRecognitionzh-TW 連續辨識 +onend自動重啟 + interim 灰字即時顯示，演說結束後 Gemini 依逐字稿產雷達圖，辨識準確度 90%+ - 📊 Gemini 2.5 Flash 四維雷達圖評分 — 內容組織 45% + 語音表達 40% + 台風儀態 10% + 時間控制，雷達圖用 Canvas 純手繪（沒用 Chart.js）
- ✨ AI 四大產出 + 舞台指示標記 — 演說大綱（含時間配置條視覺化）+ 完整逐字稿 + 5 個創意方向 + 名言金句，Prompt 強制要求至少 5 處
(停頓 0.5 秒)(語氣激昂)(手勢上揚)(重音：xx) - 🎓 三層年級分級 Prompt 工程 — 3-4 年級避艱深成語句不超過 20 字、5-6 年級成語名言社會議題、中高混合切換按鈕改 system instruction
- 📋 老師現場評分量表（雙身分設計） — 五大維度滑桿（內容 / 語音 / 表達 / 臺風 / 儀態）即時加總、長處短處 textarea、可列印正式評分單
- 💌 家長通知信 AI 一鍵生成 — 含「情感色彩四維分析」（激勵感 / 溫情感 / 說服力 / 邏輯感 JSON 回傳）
- ☁️ Supabase Google OAuth 雲端同步 — 抽籤紀錄 vs 完整練習紀錄分開統計、四層保險網（停止鈕 / 安全網重置 / 硬上限自動停 /
beforeunloadkeepalive）
💡 設計理念
技術棧單檔 HTML 純手寫 5705 行 / 322 KB，無 React/Vue/Next、零 npm 依賴 + Gemini API（gemini-2.5-flash-lite 預設）+ Supabase JS SDK v2 + Web Speech API + Web Audio API。神細節：Service Worker 偵測到演說進行中會延後 30 秒再提示更新避免學生練到一半被打斷 — 這種「真懂用戶」的工程考量是 #67 最動人之處。在阿凱「語文競賽三件套」中：#25 入門版 給新手老師、#67 Pro 給比賽選手與正式賽事規格、#95 龍潭區複賽資訊站 給承辦學校。石門國小帶選手實測：老師親自陪練比率從 100% 降到 30%（其他用 AI 自練）、講稿迭代次數從 8-10 次飆到 20 次。
🎒 適合情境
- 國小高年級 / 國中 / 高中演說比賽選手 — 平日自主練習、不用等老師有空
- 帶語文競賽的老師（語文教師、導師、社團指導）— Web Speech 自動轉文字省 80% 校對時間
- 想練口語表達的成人 — 演講、簡報、訪問都通用
- 補習班 / 寒暑假營隊講師 — 學生自學 + AI 評分
第一次用建議從歷屆題庫抽 3 題練 → 看 AI 評分穩定後再進階。MIT 授權可 fork。