S-42 Learning Reminder

學生端登入與設定設計規格

畫面用途

透過系統推播（Push Notifications）建立穩定的學習節奏。

LearningReminder 🔗 ↗

閱讀完整規格 ↓

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

學習提醒設定

🎨 Figma: Learning_Reminder 🔗

🎯 功能定位

透過系統推播（Push Notifications）建立穩定的學習節奏。

• 習慣養成：讓學生自訂最適合的練習時段。
• 權限引導：確保在開啟開關時，引導用戶授權作業系統的通知權限。
• 自動化排程：與後端及本地排程系統連動，準時發送提醒。

🧱 畫面結構

• Header: < Back Learning Reminder
• Toggle: Enable Notifications → [ Get reminded to practice ] ( ON )
• Timer: Reminder Time → 19 : 00 (07:00 PM) ← 時間選擇 (滾輪型)
• Repeat Options:
  • ( ) Every Day ← 快速選項
  • ( ) Custom Weekdays
  • [ S ] [ M ] [ T ] [ W ] [ T ] [ F ] [ S ] ← 星期選擇器 (多選圓圈)
• CTA: [ Save Settings ]

設計參考: 星期選擇器選中時填充 Coral Accent 色系，未選中為淺灰色輪廓。Toggle 關閉時下方區域呈現 50% 透明度 Grayed-out。

📦 區塊說明

#	區塊	元件	行為/交互	狀態	備註
1	Toggle	Master Switch	點擊切換 ON/OFF	Enabled / Disabled	切換 ON 時若無系統權限需彈窗引導
2	Timer	Time Picker	滾輪滑動選擇 (HH:mm)	Active / Grayed-out	總開關為 OFF 時不可交互
3	Repeat	Frequency Select	單選「每天」或「自訂」	Selected	選中「每天」後下方星期全亮
4	Repeat	Weekday Picker	點擊圓圈進行多選	Toggle Style	視覺上應呈現選中高亮感
5	Action	Save Button	點擊發送 API 並設定本地推播	Loading	保存後顯示 Success Toast

🔁 交互流程圖

流程圖

正在載入流程圖…

⚙️ 狀態管理

狀態	觸發條件	畫面表現
Toggle OFF	開關關閉	Time Picker 與 Repeat Options 呈現 50% 透明度 (Grayed-out)，點擊無反應
Permission Denied	用戶曾永久拒絕	點擊 Toggle 跳轉至手機系統「設定」頁面
Save	點擊保存	取消舊排程，根據新時間註冊 Local Notification
Default	新用戶進入	預設 OFF；若開啟預設時間 19:00，頻率 Every Day

🔎 邏輯自我檢查

1. 時區處理：提醒時間以「設備本地時間」為準。
2. 靜音模式：提醒僅發送通知，不應強行播放聲音。
3. 即時生效：保存後下一個符合時間點的提醒能準時觸發。

---