S-31 Test In Progress
內容依原始規格呈現 · 查看 Markdown 來源 ↗需具備倉庫查看權限
正式考試頁
🎨 Figma: TR_test_1 🔗 · TR_test_2 🔗 · TR_test_3 🔗 · TR_test_4 🔗 · TR_test_5 🔗
🎯 功能定位
模擬正式考試環境，支援多種題型模板。考試分為兩個階段：聽力階段與答題階段。提供暫停/繼續功能，考試風格 UI 含計時。
🧱 全局邏輯
考試流程：兩階段制
- 階段 1 — 聽力播放（如有聽力題）：
- 先判斷本次考試是否包含聽力題
- 若有聽力題，音檔自動連續播放，時長 20-30 分鐘，中間不間斷
- 學生無法暫停或倒帶聽力音檔
- 頂部顯示
[ 🔊 Audio Playing... ]狀態條
- 階段 2 — 答題（閱讀理解等題型）：
- 聽力結束後進入答題階段
- 學生可自由點擊
< Previous或Next >切換題目 - 畫面下方有左右滑動，顯示當前進度（e.g.
18 / 30）與剩餘時間
- 暫停： 考試可以暫停，之後再做，透過 S-30 畫面的 Continue 繼續
- 冷色調視覺： 全站採用深藍/冷灰，確保學生在壓力下保持冷靜
設計參考: 冷色調視覺使用深藍灰色系，避免使用 Coral Accent 等溫暖色系。
🧱 畫面結構（4 種模板適配）
共通元素：
- 畫面下方有左右滑動，學生可以自由選擇下一題或者上一題
- 顯示當前進度，e.g.
18 / 30 - 顯示剩下的時間
模板 1： 適配文字選擇題，文字是非題
模板 2： 適配題目圖片選擇題，題目圖片是非題
模板 3： 適配圖片選擇題
模板 4： 適配圖片6選1，文字6選1 (題組模式)
🔁 交互流程圖
正在載入流程圖…
⚙️ 狀態管理
| 狀態 | 觸發條件 | 畫面表現 |
|---|---|---|
| Listening | 進入聽力階段 | 音檔自動連續播放，頂部顯示 🔊 Audio Playing...，不可暫停或倒帶 |
| Answering | 聽力結束或無聽力題 | 學生可自由切換題目，計時繼續 |
| Pause | 學生暫停考試 | 記錄進度，透過 S-30 Continue 恢復 |
| Auto-Submit | 計時歸零 | 系統自動強制跳轉結算 S-32 |
🔎 邏輯自我檢查
- 聽力階段音檔 20-30 分鐘不間斷播放 ✔
- 聽力結束後自動進入答題階段（建議 1 秒轉場提示）✔
- 答題階段可自由 Previous/Next 切換 ✔
- 考試可暫停後續做，進度持久化保存 ✔