S-10-A Inbox / Mailbox

學生端學習與練習設計規格P1 起

P1 版本

畫面用途

將首頁信箱圖標落成可追蹤的彈窗畫面，集中展示教師與系統通知，並以未讀 Badge 維持回訪動機。

5558:4465 ↗overlayinbox · 5558:4465 🔗 ↗在系統地圖中查看關係 ↗

閱讀完整規格 ↓

變化時間線

1. P1新增 +1移除 −0

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

取圖紀錄： QL APP，2026-10-18，版本 2410774734466577464；節點 5558:4465 。學生 2x／Web 1x。圖片是目前設計稿，文字為 APlus 首版目標規格。

首頁信箱彈窗

🎨 Figma: overlay_inbox · 5558:4465 🔗 · mailbox component 5581:4630

🎯 功能定位

將首頁信箱圖標落成可追蹤的彈窗畫面，集中展示教師與系統通知，並以未讀 Badge 維持回訪動機。

🧱 畫面結構

• Header：Inbox、未讀數量與關閉按鈕
• Message List：來源、標題、時間與已讀／未讀狀態
• Message Types：Teacher、System、Reward
• Dismiss：點擊外部或 × 返回 S-10，打開項目後立即標記已讀

🔁 交互流程圖

流程圖

正在載入流程圖…

⚙️ 狀態管理

狀態	畫面表現
Empty	顯示空狀態插畫與「No new messages」
Unread	卡片高亮、信箱 Badge 顯示數量
Read	卡片降階，保留來源與時間
Offline	顯示本地快取，禁止重新整理並提示離線

---