S-30 Trophy Room

學生端挑戰與獎勵設計規格P1 起

P1 版本

畫面用途

S-30 是學生的檢定練習與成就頁。檢定採可配置英文分類；Cambridge YLE Starters／Movers／Flyers 僅為首版候選示例，正式分類、題庫授權與評分依據均待確認，不宣稱已有正式授權題庫或認證評分。

3563:267 ↗trophyroom 🔗 ↗challengeboard 🔗 ↗TRtest1 🔗 ↗2 🔗 ↗3 🔗 ↗4 🔗 ↗5 🔗 ↗pass 🔗 ↗fail 🔗 ↗在系統地圖中查看關係 ↗

原型與規格有待確認事項，請一併閱讀正文中的差異說明。

閱讀完整規格 ↓

變化時間線

1. P1新增 +1移除 −0

第一版式樣草案 · Markdown 來源：02-App畫面-學生.mdGitHub 版本尚未推送；目前以本機手冊為準

取圖紀錄： QL APP，2026-10-18，版本 2410774734466577464；節點 3563:267 。學生 2x／Web 1x。圖片是目前設計稿，文字為 APlus 首版目標規格。 設計稿待更新（F-08、F-09）： 圖中舊品牌、華語內容或待核對項目照實保留；請以本節英語文字規格為目標。設計修改後重新取圖。

榮譽室

🎨 Figma: trophy_room 🔗 · challenge_board 🔗

考試模板: TR_test_1 🔗 · 2 🔗 · 3 🔗 · 4 🔗 · 5 🔗 | 結果: pass 🔗 · fail 🔗

🎯 功能定位

S-30 是學生的檢定練習與成就頁。檢定採可配置英文分類；Cambridge YLE Starters／Movers／Flyers 僅為首版候選示例，正式分類、題庫授權與評分依據均待確認，不宣稱已有正式授權題庫或認證評分。

• 上半部 (Trophy)： 像陳列櫃一樣，展示過去完成模擬考後獲得的勳章與分數，增強成就感。
• 下半部 (Challenge)： 老師即時推送的任務區，只有當老師在教師端點擊「推送」後，這裡才會出現新的練習或考試。
• 任務粒度： 一張 Challenge Card 對應老師的一次派送與一份完整 Exam；Listening／Reading 只在 Exam 內分 Section，不顯示成兩張任務卡。

🧱 畫面結構

Trophy Gallery (上半部 — 橫向滑動)：

• Header: < Trophy Room [🔔]
• Section Title: [🏆 My Trophies]
• Trophy Cards:
  • [🥇] Practice Exam A | [🥈] Movers Practice (example; pending confirmation)
  • Score: 98 / 100 | Score: 85 / 120
  • 2026/03/15 | 2026/02/10
  • < Horizontal Scroll for more >

Challenge List (下半部 — 垂直列表)：

• Section Title: [🔥 Active Challenges]
• Challenge Cards:
  • [!] NEW: Mid-term Mock Exam
  • Issued by: Teacher Lin | Due: 2026-04-05
  • [ START NOW > ]
  • [P] English Practice Sprint
  • Issued by: Teacher Lin | Progress: 40%
  • [ CONTINUE > ]

📦 區塊說明

#	區塊	元件	行為/交互	狀態	備註
1	Trophy Gallery	Trophy Card	點擊卡片可查看詳細錯題報告	Completed	根據分數自動配發高/中/低獎杯，各有3款，隨機獲得
2	Trophy	Score Label	顯示考試成績	靜態	與 A-80 數據連動
3	Challenge List	Challenge Card	顯示待處理任務與 Section 摘要	Active	包含「Start」「Continue（進行中）」「Try Again」；同一 challenge_id 不因 Section 拆卡
4	Challenge	Action Button	點擊進入 S-31	Primary / Grayed-out	過期按鈕變灰不可點擊
5	Challenge	Status Badge	提醒緊急程度	Alert	[!]=新任務；[P]=進行中進度條

獎杯評價標準： Total Score - Passing Score 的分數，前30%為高，中間40%為中，後30%為低。

🔁 交互流程圖

流程圖

正在載入流程圖…

⚙️ 狀態管理

狀態	觸發條件	畫面表現
Push Logic	老師端 API 推送	挑戰項目具 is_pushed 標籤，S-30 加載該內容
Refetch	學生完成測驗	前端立即重新獲取排行榜與榮譽數據
Pause/Resume	答題階段保存並退出	透過 Continue 恢復同一 Attempt；聽力播放不提供音訊暫停／倒帶，不新增逐 Section 設定
Retry Available	最新 Final Submitted Result 為 Fail，且目前時間 < due_at	Active 卡片保留並顯示 Try Again；建立新 Attempt，不重複增加 Assigned／Completed
Passed	任一 Final Submitted Attempt 達 pass_score	Active 卡片移除；Gallery 以同一 challenge_id + student_id 顯示一個 Trophy，分數使用 Effective Result
Expired Failed	目前時間 >= due_at 且仍未 Pass	卡片移至 History／Expired，Try Again 隱藏；進行中 Attempt 依規則 Auto-Submit
Zero State (Challenge)	老師沒發任務	顯示：「No challenges yet. Take a break! ☕」
Zero State (Trophy)	還沒考過試	顯示：「Start your first challenge to win a trophy!」

🔎 邏輯自我檢查

• 權限連動：確保只有該班級的老師能給該班級學生發挑戰。
• 即時性：當老師推送時，S-30 應具備小紅點提醒，讓學生知道有新內容。
• 視覺對比：上半部橫向滑動 (Horizontal Scroll) 更像陳列室；下半部垂直列表 (Vertical List) 更像任務清單，兩者在 UI 上有明顯區隔。
• 任務一致：一份 Exam 無論有幾個 Section，都只有一個 Challenge 狀態、截止日與完成度。
• 重考邊界：只有 Fail 且未到期可 Try Again；Pass 或到期後不得建立新 Attempt，API 必須再次校驗 due_at。
• Trophy 冪等：以 challenge_id + student_id 作唯一發放鍵；重複提交或重試不得產生多枚相同 Trophy，Gallery 只更新 Effective Result 分數。

---