個人資料#
頁面位置#
/profile 或 /users/me/profile
功能說明#
個人資料頁面是用戶管理自己帳號資訊、查看學習成就的中心。
頁面結構#
個人資訊區#
顯示資訊：
- 頭像 - Google 帳號頭像或預設頭像
- 用戶名稱 - 顯示名稱
- Email - 註冊 Email（僅自己可見）
- 當前等級 - Lv.1 到 Lv.36
- 當前經驗值 - 累積的總 XP
- 稱號 - 根據等級顯示的稱號
- 全站排名 - 在排行榜上的名次
編輯功能：
- 點擊「編輯個人資料」按鈕
- 可以修改：
- 顯示名稱
- 個人簡介
- 頭像（上傳自訂頭像）
- 點擊「儲存」完成修改
等級進度條#
視覺化顯示：
Lv.15 ▓▓▓▓▓▓▓▓▓▓░░░░░░ 65% ► Lv.16
15,000 XP / 23,000 XP顯示內容：
- 當前等級
- 到下一級還需要多少經驗值
- 進度百分比
- 進度條視覺效果
範例：
- 小美目前 Lv.15，有 15,000 XP
- 升到 Lv.16 需要 23,000 XP
- 還需要：23,000 - 15,000 = 8,000 XP
- 進度：15,000 / 23,000 = 65%
學習統計#
課程統計：
- 已購買課程數量
- 進行中的課程
- 已完成的課程
- 總學習時數
任務統計：
- 已完成影片數量
- 已領取獎勵數量
- 總完成率
挑戰統計：
- 已完成道館數量
- 通過的挑戰數
- 挑戰通過率
- 獲得的挑戰經驗值
已購買課程列表#
顯示內容： 每個課程顯示：
- 課程封面
- 課程名稱
- 購買日期
- 學習進度（百分比）
- 「繼續學習」按鈕
操作：
- 點擊課程卡片或「繼續學習」進入學習旅程
- 顯示最近一次觀看的位置
- 自動從上次停止的地方繼續
成就徽章（未來功能）#
預留區域：
- 完成特定目標可獲得徽章
- 例如：
- 完成第一門課程
- 連續學習 7 天
- 通過所有道館
- 達到 Lv.20
- 進入排行榜前 10 名
隱私設定#
公開資訊#
其他用戶可以看到：
- 用戶名稱
- 頭像
- 等級
- 經驗值
- 稱號
- 排行榜排名
私密資訊#
只有自己可以看到：
- 購買課程清單
- 學習進度詳情
- 影片觀看記錄
- 挑戰提交內容
隱私控制（未來功能）#
計劃新增的隱私設定：
- 是否顯示在排行榜
- 是否公開個人資料頁面
- 是否允許其他用戶查看成就
帳號管理#
修改密碼#
針對 Email 帳號：
- 點擊「修改密碼」
- 輸入當前密碼
- 輸入新密碼
- 確認新密碼
- 點擊「儲存」
針對 Google 帳號：
- Google OAuth 用戶無需設定密碼
- 密碼由 Google 管理
- 顯示「透過 Google 登入」標記
刪除帳號（未來功能）#
計劃新增的帳號刪除功能：
- 點擊「刪除帳號」
- 確認刪除（需要輸入密碼）
- 所有資料將被永久刪除
- 包含：學習記錄、購買記錄、挑戰提交
登出#
- 點擊右上角頭像選單
- 選擇「登出」
- 清除本地登入狀態
- 返回首頁
範例：小美的個人資料頁面#
╔═══════════════════════════════════════════════════════════╗
║ 👤 小美的個人資料 ║
╠═══════════════════════════════════════════════════════════╣
║ ║
║ [頭像] 小美 (Mary Wang) ║
║ mary@example.com ║
║ Lv.15 - 中級冒險者 ║
║ 15,000 XP ║
║ 全站排名：#6 ║
║ ║
║ [編輯個人資料] ║
║ ║
╠═══════════════════════════════════════════════════════════╣
║ 📊 等級進度 ║
║ ║
║ Lv.15 ▓▓▓▓▓▓▓▓▓▓░░░░░░ 65% ► Lv.16 ║
║ 15,000 XP / 23,000 XP ║
║ 還需要 8,000 XP 即可升級！ ║
║ ║
╠═══════════════════════════════════════════════════════════╣
║ 📚 學習統計 ║
║ ║
║ 課程： ║
║ • 已購買：2 門課程 ║
║ • 進行中：1 門 ║
║ • 已完成：1 門 ║
║ • 總學習時數：25 小時 ║
║ ║
║ 任務： ║
║ • 已完成影片：30 支 ║
║ • 已領取獎勵：28 次 ║
║ • 完成率：93% ║
║ ║
║ 挑戰： ║
║ • 已完成道館：3 個 ║
║ • 通過挑戰：6 題 ║
║ • 通過率：100% ║
║ ║
╠═══════════════════════════════════════════════════════════╣
║ 🎓 已購買課程 ║
║ ║
║ ┌─────────────────────────────────────────┐ ║
║ │ 軟體設計模式精通之旅 │ ║
║ │ 講師：水球 │ ║
║ │ 購買日期：2024-10-15 │ ║
║ │ 進度：▓▓▓▓▓▓▓▓░░ 80% │ ║
║ │ [繼續學習] │ ║
║ └─────────────────────────────────────────┘ ║
║ ║
║ ┌─────────────────────────────────────────┐ ║
║ │ AI x BDD 測試驅動開發 │ ║
║ │ 講師：水球 │ ║
║ │ 購買日期：2024-11-01 │ ║
║ │ 進度：▓░░░░░░░░░ 10% │ ║
║ │ [繼續學習] │ ║
║ └─────────────────────────────────────────┘ ║
║ ║
╚═══════════════════════════════════════════════════════════╝用戶旅程範例#
新手用戶（小明）#
第一次登入：
- 使用 Google 帳號登入
- 系統自動創建帳號
- 進入個人資料頁面
- 顯示：
- Lv.1
- 0 XP
- 無已購買課程
- 全站排名：#50
一週後：
- 購買了第一門課程
- 完成 5 支影片
- 領取 500 XP
- 升級到 Lv.3
- 個人資料更新：
- 顯示 1 門已購買課程
- 進度 20%
- 排名上升到 #30
進階用戶（小華）#
持續學習三個月：
- 購買 3 門課程
- 完成 2 門課程（100% 進度）
- 完成 8 個道館挑戰
- 累積 25,000 XP
- 達到 Lv.16
- 個人資料顯示：
- 3 門已購買課程
- 2 門已完成
- 總學習時數 80 小時
- 全站排名：#5
查看成就：
- 完成度：67%（2/3 門課程）
- 挑戰通過率：95%
- 獲得稱號：「高級冒險者」
- 接近「技術專家」稱號（需要 Lv.18）
激勵設計#
進度視覺化#
- 等級進度條讓用戶清楚看到離升級還有多遠
- 課程完成度百分比激勵繼續學習
- 統計數字展示學習成果
目標設定#
個人資料頁面幫助用戶設定目標：
- 「再 8,000 XP 就能升級了！」
- 「這門課程只剩 20% 就能完成！」
- 「再完成 2 個道館就能達成目標！」
成就感#
看到自己的進步：
- 等級提升
- 排名上升
- 課程完成數增加
- 學習時數累積