T-42 Exam Analytics

教師端查看檢定設計規格

畫面用途

提供該次模擬考的「大數據面」，幫助老師快速找出全班的集體薄弱環節（Top 10 錯誤率題目）。

Exam Analytics 🔗 ↗

閱讀完整規格 ↓

內容依原始規格呈現 · 查看 Markdown 來源 ↗需具備倉庫查看權限

班級檢定分析報告

🎨 Figma: Exam Analytics 🔗

T-40 / T-42 / T-43 共用同一 Figma node 151-636

🎯 功能定位

提供該次模擬考的「大數據面」，幫助老師快速找出全班的集體薄弱環節（Top 10 錯誤率題目）。

🧱 畫面結構

Web 佈局：12-col grid，1280px max-width（無 Sidebar）

• Header:

  • < Back — 返回 T-40
  • Exam: HSK-2 Mock A | Date: 2026/03/25 | Class: 2-A
  • [🔔] [👤] → T-03 / T-04

• Main Content:

  • Exam Summary — KPI Cards × 4:
    • Avg. Score: 172 Pass Rate: 88% Highest: 198 Lowest: 95
  • Top 10 Most Errored Questions — DataTable:
    • Columns: Rank | Question | Category | Err Rate | Action
    • [👁️] → 彈窗：題目內容 + 正解 + 錯誤分佈
  • [📂 View Student Matrix >] → T-43
  • [Preview Test] → 手機模擬器展示 S-31（不記錄答題數據）

📦 區塊說明

#	區塊	元件	行為/交互	備註
1	Exam Summary	KPI Cards × 4	顯示該場考試的全班統計	平均分、及格率、最高分、最低分
2	Top 10 錯誤題	DataTable	按錯誤率降序排列。點擊 [👁️] 彈窗查看題目內容、正解及錯誤分佈	自動計算全班錯誤頻率最高前 10 題
3	Student Matrix Link	Button	點擊跳轉 T-43 學生答題矩陣	—
4	Preview Test	Button	點擊開啟手機模擬器視窗，展示學生端 S-31 考試畫面	🆕 方便老師在課堂上向學生說明考試內容

手機模擬器預覽 (Preview Test)

點擊 [Preview Test] 按鈕時，彈出一個手機模擬器視窗（模擬學生端 S-31 Test In Progress 畫面），展示該次 Challenge 的完整考題與 UI。此功能設計目的為：

• 課堂說明： 老師可以在投影螢幕上展示學生視角，講解答題方式
• 完全模擬： 模擬器渲染與學生端 App 完全一致的 UI（含手機外框、375×812 基準）
• 僅預覽模式： 不記錄任何答題數據，僅供展示用途

🔁 交互流程圖

流程圖

正在載入流程圖…

⚙️ 狀態管理

狀態	觸發條件	畫面表現
正常	數據載入	顯示 Summary + Top 10
加載中	頁面首次載入	Loading
空狀態	尚無考試數據	引導提示

🔎 邏輯自我檢查

• 錯誤率計算： Error Rate = 該題錯誤人數 / 總作答人數。
• 數據來源： 同一場 Challenge 的所有學生答題記錄。

---