# Drama Ling 完整用戶流程圖 **文檔名稱**: 基於現行規格的完整用戶流程設計 **建立日期**: 2025-09-10 **基於規格**: `/docs/02_design/function-specs/` 完整規格 **涵蓋平台**: Mobile App + Web App ## 🎯 總體用戶流程概覽 ```mermaid graph TD START([用戶訪問應用]) --> AUTH_CHECK{已登入?} AUTH_CHECK -->|否| AUTH_FLOW[認證流程] AUTH_CHECK -->|是| MAIN_APP[主應用程序] AUTH_FLOW --> REGISTER[註冊流程] AUTH_FLOW --> LOGIN[登入流程] AUTH_FLOW --> FORGOT[忘記密碼] REGISTER --> PROFILE_SETUP[個人資料設定] LOGIN --> MAIN_APP FORGOT --> RESET_PASSWORD[密碼重設] PROFILE_SETUP --> ONBOARDING[新手引導] RESET_PASSWORD --> LOGIN ONBOARDING --> MAIN_APP MAIN_APP --> LEARNING_MAP[學習地圖] MAIN_APP --> VOCAB[詞彙學習] MAIN_APP --> DIALOGUE[情境對話] MAIN_APP --> SHOP[道具商店] MAIN_APP --> PROFILE[個人資料] style START fill:#e1f5fe style MAIN_APP fill:#c8e6c9 style AUTH_FLOW fill:#fff3e0 style LEARNING_MAP fill:#f3e5f5 style VOCAB fill:#e8f5e8 style DIALOGUE fill:#fff9c4 style SHOP fill:#fce4ec ``` ## 🔐 用戶認證流程 ### 完整認證流程圖 ```mermaid graph TD LANDING[Landing Page] --> LOGIN_CHOICE{選擇登入方式} LOGIN_CHOICE -->|新用戶| REGISTER_START[開始註冊] LOGIN_CHOICE -->|舊用戶| LOGIN_START[開始登入] LOGIN_CHOICE -->|第三方| OAUTH[第三方認證] %% 註冊流程 REGISTER_START --> EMAIL_INPUT[輸入Email] EMAIL_INPUT --> EMAIL_VERIFY[Email驗證] EMAIL_VERIFY --> PASSWORD_SET[設定密碼] PASSWORD_SET --> PROFILE_INFO[基本資料] PROFILE_INFO --> LEARNING_LEVEL[學習程度設定] LEARNING_LEVEL --> TRIAL_OFFER[試用方案選擇] %% 登入流程 LOGIN_START --> CREDENTIALS[輸入帳密] CREDENTIALS --> LOGIN_VERIFY[驗證登入] LOGIN_VERIFY -->|成功| CHECK_SUBSCRIPTION[檢查訂閱狀態] LOGIN_VERIFY -->|失敗| LOGIN_ERROR[登入錯誤處理] LOGIN_ERROR --> FORGOT_PASSWORD[忘記密碼?] %% 第三方登入 OAUTH --> OAUTH_VERIFY[第三方驗證] OAUTH_VERIFY --> ACCOUNT_LINK[帳戶關聯] %% 最終導向 TRIAL_OFFER --> WELCOME_SCREEN[歡迎頁面] CHECK_SUBSCRIPTION --> WELCOME_SCREEN ACCOUNT_LINK --> WELCOME_SCREEN FORGOT_PASSWORD --> PASSWORD_RESET[密碼重設流程] PASSWORD_RESET --> LOGIN_START WELCOME_SCREEN --> MAIN_DASHBOARD[主控制台] style REGISTER_START fill:#e8f5e8 style LOGIN_START fill:#fff3e0 style OAUTH fill:#f3e5f5 style WELCOME_SCREEN fill:#c8e6c9 ``` ### 用戶角色與權限流程 ```mermaid graph LR USER_LOGIN[用戶登入] --> ROLE_CHECK{檢查用戶角色} ROLE_CHECK -->|免費用戶| FREE_USER[免費用戶權限] ROLE_CHECK -->|試用用戶| TRIAL_USER[試用用戶權限] ROLE_CHECK -->|訂閱用戶| SUBSCRIBER[訂閱用戶權限] ROLE_CHECK -->|管理員| ADMIN[管理員權限] FREE_USER --> FREE_LIMITS[基礎對話練習 3次/日
基礎詞庫
簡化版報告] TRIAL_USER --> TRIAL_LIMITS[無限對話練習(7天)
完整詞庫
詳細版報告
離線模式] SUBSCRIBER --> SUB_LIMITS[無限制存取
完整功能
詳細分析
數據匯出] ADMIN --> ADMIN_LIMITS[完整管理功能
系統監控
用戶管理] style FREE_USER fill:#ffebee style TRIAL_USER fill:#fff3e0 style SUBSCRIBER fill:#e8f5e8 style ADMIN fill:#e3f2fd ``` ## 🗺️ 學習地圖流程 ### 學習路徑導航流程 ```mermaid graph TD MAP_ENTRY[進入學習地圖] --> PROGRESS_LOAD[載入學習進度] PROGRESS_LOAD --> MAP_OVERVIEW[地圖總覽顯示] MAP_OVERVIEW --> LEVEL_SELECT{選擇關卡} LEVEL_SELECT -->|已解鎖| LEVEL_AVAILABLE[可用關卡] LEVEL_SELECT -->|未解鎖| LEVEL_LOCKED[鎖定關卡] LEVEL_SELECT -->|已完成| LEVEL_COMPLETED[已完成關卡] LEVEL_AVAILABLE --> LEVEL_DETAILS[關卡詳情頁] LEVEL_LOCKED --> UNLOCK_CONDITION[解鎖條件說明] LEVEL_COMPLETED --> REVIEW_OPTION{重複練習?} LEVEL_DETAILS --> DIFFICULTY_SELECT[選擇難度] UNLOCK_CONDITION --> PROGRESS_NEEDED[需要完成的前置關卡] REVIEW_OPTION -->|是| LEVEL_DETAILS REVIEW_OPTION -->|否| ACHIEVEMENT_CHECK[查看成就] DIFFICULTY_SELECT --> LEARNING_TYPE{學習類型} PROGRESS_NEEDED --> MAP_OVERVIEW LEARNING_TYPE -->|詞彙學習| VOCAB_FLOW[進入詞彙學習] LEARNING_TYPE -->|情境對話| DIALOGUE_FLOW[進入對話練習] ACHIEVEMENT_CHECK --> BADGE_DISPLAY[徽章展示] BADGE_DISPLAY --> MAP_OVERVIEW style MAP_ENTRY fill:#f3e5f5 style LEVEL_AVAILABLE fill:#e8f5e8 style LEVEL_LOCKED fill:#ffebee style LEVEL_COMPLETED fill:#fff3e0 ``` ### 成就系統流程 ```mermaid graph LR ACHIEVEMENT_TRIGGER[成就觸發事件] --> ACHIEVEMENT_CHECK{檢查成就條件} ACHIEVEMENT_CHECK -->|達成| ACHIEVEMENT_UNLOCK[解鎖成就] ACHIEVEMENT_CHECK -->|未達成| PROGRESS_UPDATE[更新進度] ACHIEVEMENT_UNLOCK --> REWARD_GRANT[發放獎勵] REWARD_GRANT --> NOTIFICATION[成就通知] NOTIFICATION --> BADGE_ADD[添加徽章] BADGE_ADD --> XP_REWARD[經驗值獎勵] XP_REWARD --> DIAMOND_REWARD[鑽石獎勵] DIAMOND_REWARD --> ACHIEVEMENT_GALLERY[成就畫廊更新] PROGRESS_UPDATE --> ACHIEVEMENT_GALLERY style ACHIEVEMENT_UNLOCK fill:#e8f5e8 style REWARD_GRANT fill:#fff3e0 style BADGE_ADD fill:#f3e5f5 ``` ## 📚 詞彙學習流程 ### 完整詞彙學習流程 ```mermaid graph TD VOCAB_START[開始詞彙學習] --> VOCAB_TYPE{選擇學習模式} VOCAB_TYPE -->|新詞學習| NEW_VOCAB[新詞彙介紹] VOCAB_TYPE -->|複習模式| REVIEW_VOCAB[複習詞彙] VOCAB_TYPE -->|測驗模式| TEST_VOCAB[詞彙測驗] %% 新詞學習流程 NEW_VOCAB --> VOCAB_INTRO[詞彙介紹頁面] VOCAB_INTRO --> PRONUNCIATION[發音播放] PRONUNCIATION --> EXAMPLES[例句展示] EXAMPLES --> MEMORY_TIPS[記憶提示] MEMORY_TIPS --> PRACTICE_START[開始練習] %% 複習模式流程 REVIEW_VOCAB --> DUE_CHECK[檢查待複習詞彙] DUE_CHECK -->|有待複習| REVIEW_SESSION[複習會話] DUE_CHECK -->|無待複習| NO_REVIEW[沒有待複習詞彙] NO_REVIEW --> NEW_VOCAB %% 測驗模式流程 TEST_VOCAB --> TEST_TYPE{選擇測驗類型} TEST_TYPE -->|選擇題| CHOICE_TEST[選擇題測驗] TEST_TYPE -->|配對題| MATCHING_TEST[配對測驗] TEST_TYPE -->|填空題| FILL_BLANK[填空測驗] %% 練習流程 PRACTICE_START --> PRACTICE_TYPE{練習類型} REVIEW_SESSION --> PRACTICE_TYPE CHOICE_TEST --> PRACTICE_TYPE MATCHING_TEST --> PRACTICE_TYPE FILL_BLANK --> PRACTICE_TYPE PRACTICE_TYPE -->|選擇題練習| CHOICE_PRACTICE[選擇題練習] PRACTICE_TYPE -->|流暢度配對| FLUENCY_MATCHING[流暢度配對] PRACTICE_TYPE -->|句子重組| SENTENCE_REORG[句子重組] %% 答題處理 CHOICE_PRACTICE --> ANSWER_CHECK{答案檢查} FLUENCY_MATCHING --> ANSWER_CHECK SENTENCE_REORG --> ANSWER_CHECK ANSWER_CHECK -->|正確| CORRECT_FEEDBACK[正確回饋] ANSWER_CHECK -->|錯誤| INCORRECT_FEEDBACK[錯誤回饋] CORRECT_FEEDBACK --> XP_GAIN[經驗值獲得] INCORRECT_FEEDBACK --> LIFE_CONSUME[消耗命條] XP_GAIN --> PROGRESS_UPDATE[更新學習進度] LIFE_CONSUME --> LIFE_CHECK{命條檢查} LIFE_CHECK -->|命條>0| PROGRESS_UPDATE LIFE_CHECK -->|命條=0| LIFE_DEPLETED[命條耗盡] PROGRESS_UPDATE --> MASTERY_CHECK{掌握度檢查} MASTERY_CHECK -->|未掌握| CONTINUE_PRACTICE[繼續練習] MASTERY_CHECK -->|已掌握| MASTERY_ACHIEVED[詞彙掌握] CONTINUE_PRACTICE --> PRACTICE_TYPE MASTERY_ACHIEVED --> SESSION_COMPLETE[學習會話完成] LIFE_DEPLETED --> LIFE_RECOVER[命條恢復選項] LIFE_RECOVER --> WATCH_AD[觀看廣告] LIFE_RECOVER --> BUY_LIVES[購買命條] LIFE_RECOVER --> WAIT_TIMER[等待恢復] WATCH_AD --> PRACTICE_TYPE BUY_LIVES --> SHOP_FLOW[前往商店] WAIT_TIMER --> END_SESSION[結束會話] SESSION_COMPLETE --> RESULTS_DISPLAY[結果展示] END_SESSION --> RESULTS_DISPLAY style NEW_VOCAB fill:#e8f5e8 style REVIEW_VOCAB fill:#fff3e0 style TEST_VOCAB fill:#f3e5f5 style CORRECT_FEEDBACK fill:#c8e6c9 style INCORRECT_FEEDBACK fill:#ffcdd2 style LIFE_DEPLETED fill:#ffebee ``` ### 間隔複習算法流程 ```mermaid graph TD WORD_REVIEW[詞彙複習] --> ANSWER_QUALITY{回答品質評估} ANSWER_QUALITY -->|Again(1)| RESET_INTERVAL[重置間隔 = 1天] ANSWER_QUALITY -->|Hard(2)| HARD_INTERVAL[間隔 × 1.2] ANSWER_QUALITY -->|Good(3)| GOOD_INTERVAL[間隔 × ease_factor] ANSWER_QUALITY -->|Easy(4)| EASY_INTERVAL[間隔 × ease_factor × 1.3] RESET_INTERVAL --> UPDATE_EASE_FACTOR[更新容易度因子] HARD_INTERVAL --> UPDATE_EASE_FACTOR GOOD_INTERVAL --> UPDATE_EASE_FACTOR EASY_INTERVAL --> UPDATE_EASE_FACTOR UPDATE_EASE_FACTOR --> CALCULATE_NEXT[計算下次複習時間] CALCULATE_NEXT --> UPDATE_MASTERY[更新掌握度] UPDATE_MASTERY --> MASTERY_CHECK{掌握度 ≥ 80%?} MASTERY_CHECK -->|是| MASTERED[標記為已掌握] MASTERY_CHECK -->|否| SCHEDULE_NEXT[安排下次複習] MASTERED --> GRADUATION[從複習池移除] SCHEDULE_NEXT --> REVIEW_QUEUE[加入複習佇列] style RESET_INTERVAL fill:#ffcdd2 style HARD_INTERVAL fill:#fff3e0 style GOOD_INTERVAL fill:#e8f5e8 style EASY_INTERVAL fill:#c8e6c9 style MASTERED fill:#a5d6a7 ``` ## 💬 情境對話流程 ### 完整對話練習流程 ```mermaid graph TD DIALOGUE_START[開始對話練習] --> SCENARIO_SELECT[選擇對話場景] SCENARIO_SELECT --> CHARACTER_INTRO[角色介紹] CHARACTER_INTRO --> CONTEXT_SETUP[情境背景說明] CONTEXT_SETUP --> KEYWORDS_PREVIEW[關鍵詞預覽] KEYWORDS_PREVIEW --> DIALOGUE_BEGIN[開始對話] DIALOGUE_BEGIN --> AI_RESPONSE[AI角色回應] AI_RESPONSE --> USER_INPUT{用戶輸入方式} USER_INPUT -->|文字輸入| TEXT_INPUT[文字輸入框] USER_INPUT -->|語音輸入| VOICE_INPUT[語音輸入] USER_INPUT -->|選擇回應| QUICK_REPLY[快速回應選項] TEXT_INPUT --> INPUT_ANALYSIS[輸入分析] VOICE_INPUT --> SPEECH_RECOGNITION[語音識別] QUICK_REPLY --> INPUT_ANALYSIS SPEECH_RECOGNITION --> PRONUNCIATION_CHECK[發音檢查] PRONUNCIATION_CHECK --> INPUT_ANALYSIS INPUT_ANALYSIS --> AI_EVALUATION[AI評估回應] AI_EVALUATION --> GRAMMAR_CHECK[語法檢查] GRAMMAR_CHECK --> SEMANTIC_CHECK[語意檢查] SEMANTIC_CHECK --> CONTEXT_CHECK[情境適配檢查] CONTEXT_CHECK --> FEEDBACK_GENERATE[生成回饋] FEEDBACK_GENERATE --> RESPONSE_QUALITY{回應品質} RESPONSE_QUALITY -->|優秀| EXCELLENT_FEEDBACK[優秀回饋] RESPONSE_QUALITY -->|良好| GOOD_FEEDBACK[良好回饋] RESPONSE_QUALITY -->|需改進| IMPROVEMENT_FEEDBACK[改進建議] RESPONSE_QUALITY -->|不當| INAPPROPRIATE_FEEDBACK[不當回應處理] EXCELLENT_FEEDBACK --> HIGH_XP[高經驗值獲得] GOOD_FEEDBACK --> MEDIUM_XP[中等經驗值] IMPROVEMENT_FEEDBACK --> LOW_XP[低經驗值] INAPPROPRIATE_FEEDBACK --> NO_XP[無經驗值] HIGH_XP --> DIALOGUE_CONTINUE{對話繼續?} MEDIUM_XP --> DIALOGUE_CONTINUE LOW_XP --> CORRECTION_OPTION[提供修正建議] NO_XP --> LIFE_CONSUME[消耗命條] CORRECTION_OPTION --> DIALOGUE_CONTINUE LIFE_CONSUME --> LIFE_CHECK{命條檢查} LIFE_CHECK -->|命條>0| DIALOGUE_CONTINUE LIFE_CHECK -->|命條=0| DIALOGUE_END[對話結束] DIALOGUE_CONTINUE -->|是| NEXT_TURN[下一輪對話] DIALOGUE_CONTINUE -->|否| DIALOGUE_COMPLETE[對話完成] NEXT_TURN --> AI_RESPONSE DIALOGUE_COMPLETE --> DIALOGUE_ANALYSIS[對話分析] DIALOGUE_END --> DIALOGUE_ANALYSIS DIALOGUE_ANALYSIS --> PERFORMANCE_REPORT[表現報告] PERFORMANCE_REPORT --> GRAMMAR_ANALYSIS[語法分析] GRAMMAR_ANALYSIS --> VOCABULARY_USAGE[詞彙使用分析] VOCABULARY_USAGE --> FLUENCY_SCORE[流暢度評分] FLUENCY_SCORE --> IMPROVEMENT_SUGGESTIONS[改進建議] IMPROVEMENT_SUGGESTIONS --> RESULTS_DISPLAY[結果展示] style EXCELLENT_FEEDBACK fill:#c8e6c9 style GOOD_FEEDBACK fill:#e8f5e8 style IMPROVEMENT_FEEDBACK fill:#fff3e0 style INAPPROPRIATE_FEEDBACK fill:#ffcdd2 style LIFE_CONSUME fill:#ffebee ``` ### 對話AI分析流程 ```mermaid graph LR USER_INPUT[用戶輸入] --> NLP_PROCESSING[NLP處理] NLP_PROCESSING --> TOKENIZATION[詞元化] TOKENIZATION --> POS_TAGGING[詞性標註] POS_TAGGING --> SYNTAX_ANALYSIS[語法分析] SYNTAX_ANALYSIS --> GRAMMAR_CHECK[語法檢查] SYNTAX_ANALYSIS --> SEMANTIC_ANALYSIS[語意分析] SYNTAX_ANALYSIS --> CONTEXT_MATCHING[情境匹配] GRAMMAR_CHECK --> SCORE_GRAMMAR[語法分數] SEMANTIC_ANALYSIS --> SCORE_SEMANTIC[語意分數] CONTEXT_MATCHING --> SCORE_CONTEXT[情境分數] SCORE_GRAMMAR --> OVERALL_SCORE[總體評分] SCORE_SEMANTIC --> OVERALL_SCORE SCORE_CONTEXT --> OVERALL_SCORE OVERALL_SCORE --> FEEDBACK_GENERATION[回饋生成] FEEDBACK_GENERATION --> AI_RESPONSE[AI回應生成] style NLP_PROCESSING fill:#e1f5fe style OVERALL_SCORE fill:#e8f5e8 style AI_RESPONSE fill:#f3e5f5 ``` ## 🛒 道具商店流程 ### 完整商店購買流程 ```mermaid graph TD SHOP_ENTER[進入商店] --> SHOP_CATEGORIES[商品分類] SHOP_CATEGORIES --> CATEGORY_SELECT{選擇分類} CATEGORY_SELECT -->|命條道具| LIFE_ITEMS[命條相關道具] CATEGORY_SELECT -->|學習道具| LEARNING_ITEMS[學習增效道具] CATEGORY_SELECT -->|裝飾道具| COSMETIC_ITEMS[裝飾道具] CATEGORY_SELECT -->|訂閱服務| SUBSCRIPTION_PLANS[訂閱方案] LIFE_ITEMS --> ITEM_DETAILS[道具詳情頁] LEARNING_ITEMS --> ITEM_DETAILS COSMETIC_ITEMS --> ITEM_DETAILS SUBSCRIPTION_PLANS --> PLAN_DETAILS[方案詳情頁] ITEM_DETAILS --> PURCHASE_CHECK{購買檢查} PLAN_DETAILS --> SUBSCRIPTION_CHECK{訂閱檢查} PURCHASE_CHECK -->|鑽石足夠| CONFIRM_PURCHASE[確認購買] PURCHASE_CHECK -->|鑽石不足| INSUFFICIENT_DIAMONDS[鑽石不足] SUBSCRIPTION_CHECK -->|可訂閱| SUBSCRIPTION_PAYMENT[訂閱付款] SUBSCRIPTION_CHECK -->|已訂閱| ALREADY_SUBSCRIBED[已有訂閱] INSUFFICIENT_DIAMONDS --> DIAMOND_PURCHASE[購買鑽石] ALREADY_SUBSCRIBED --> MANAGE_SUBSCRIPTION[管理訂閱] CONFIRM_PURCHASE --> PAYMENT_PROCESS[處理付款] SUBSCRIPTION_PAYMENT --> PAYMENT_GATEWAY[付款閘道] DIAMOND_PURCHASE --> PAYMENT_GATEWAY PAYMENT_PROCESS --> DIAMOND_DEDUCTION[扣除鑽石] PAYMENT_GATEWAY --> PAYMENT_VERIFY[驗證付款] DIAMOND_DEDUCTION --> ITEM_DELIVERY[道具發放] PAYMENT_VERIFY -->|成功| PAYMENT_SUCCESS[付款成功] PAYMENT_VERIFY -->|失敗| PAYMENT_FAILED[付款失敗] PAYMENT_SUCCESS --> DIAMOND_CREDIT[鑽石入帳/訂閱啟用] PAYMENT_FAILED --> PAYMENT_RETRY[重試付款] DIAMOND_CREDIT --> PURCHASE_COMPLETE[購買完成] ITEM_DELIVERY --> INVENTORY_UPDATE[更新道具庫存] PAYMENT_RETRY --> PAYMENT_GATEWAY INVENTORY_UPDATE --> PURCHASE_COMPLETE PURCHASE_COMPLETE --> TRANSACTION_RECORD[交易記錄] TRANSACTION_RECORD --> SHOP_RETURN[返回商店] MANAGE_SUBSCRIPTION --> CANCEL_SUBSCRIPTION[取消訂閱] MANAGE_SUBSCRIPTION --> UPGRADE_SUBSCRIPTION[升級訂閱] style INSUFFICIENT_DIAMONDS fill:#ffebee style PAYMENT_SUCCESS fill:#e8f5e8 style PAYMENT_FAILED fill:#ffcdd2 style PURCHASE_COMPLETE fill:#c8e6c9 ``` ### 虛擬貨幣經濟流程 ```mermaid graph LR CURRENCY_SOURCES[貨幣來源] --> EARN_DIAMONDS{鑽石獲得} CURRENCY_SOURCES --> EARN_XP{經驗值獲得} CURRENCY_SOURCES --> EARN_COINS{學習幣獲得} EARN_DIAMONDS -->|每日登入| DAILY_LOGIN[每日獎勵: 2鑽石] EARN_DIAMONDS -->|完成成就| ACHIEVEMENT_REWARD[成就獎勵: 10-50鑽石] EARN_DIAMONDS -->|觀看廣告| AD_REWARD[廣告獎勵: 1鑽石/次 max 5] EARN_DIAMONDS -->|內購| IAP[應用內購買] EARN_XP -->|詞彙學習| VOCAB_XP[100 XP] EARN_XP -->|對話練習| DIALOGUE_XP[200 XP] EARN_XP -->|連續學習| STREAK_BONUS[20% 加成] EARN_XP -->|完美表現| PERFECT_BONUS[50 XP] EARN_COINS -->|每日任務| DAILY_TASK[50 學習幣] EARN_COINS -->|學習活動| STUDY_REWARD[基於表現] DAILY_LOGIN --> DIAMOND_WALLET[鑽石錢包] ACHIEVEMENT_REWARD --> DIAMOND_WALLET AD_REWARD --> DIAMOND_WALLET IAP --> DIAMOND_WALLET VOCAB_XP --> XP_COUNTER[經驗值計數] DIALOGUE_XP --> XP_COUNTER STREAK_BONUS --> XP_COUNTER PERFECT_BONUS --> XP_COUNTER DAILY_TASK --> COIN_WALLET[學習幣錢包] STUDY_REWARD --> COIN_WALLET DIAMOND_WALLET --> SPENDING[消費項目] XP_COUNTER --> LEVEL_SYSTEM[等級系統] COIN_WALLET --> SPENDING style DAILY_LOGIN fill:#e8f5e8 style ACHIEVEMENT_REWARD fill:#fff3e0 style IAP fill:#f3e5f5 style LEVEL_SYSTEM fill:#e1f5fe ``` ## 🔄 命條系統流程 ### 命條管理流程 ```mermaid graph TD LIFE_SYSTEM[命條系統] --> LIFE_CHECK{當前命條狀態} LIFE_CHECK -->|充足 5個| FULL_LIVES[命條充足] LIFE_CHECK -->|部分 1-4個| PARTIAL_LIVES[命條部分] LIFE_CHECK -->|耗盡 0個| NO_LIVES[命條耗盡] FULL_LIVES --> LEARNING_ACTIVITY[學習活動] PARTIAL_LIVES --> RECOVERY_OPTION{恢復選項} NO_LIVES --> FORCED_RECOVERY[強制恢復選項] LEARNING_ACTIVITY --> ACTIVITY_RESULT{活動結果} ACTIVITY_RESULT -->|成功| SUCCESS_REWARD[成功獎勵] ACTIVITY_RESULT -->|失敗| LIFE_CONSUME[消耗命條] SUCCESS_REWARD --> XP_GAIN[經驗值獲得] LIFE_CONSUME --> LIFE_DEDUCTION[命條 -1] LIFE_DEDUCTION --> LIFE_CHECK XP_GAIN --> LEARNING_ACTIVITY RECOVERY_OPTION -->|自然恢復| AUTO_RECOVERY[4小時自動恢復] RECOVERY_OPTION -->|觀看廣告| WATCH_AD[觀看廣告恢復] RECOVERY_OPTION -->|鑽石購買| BUY_LIVES[購買命條] RECOVERY_OPTION -->|繼續學習| LEARNING_ACTIVITY FORCED_RECOVERY -->|觀看廣告| AD_RECOVERY[廣告恢復 +1命條] FORCED_RECOVERY -->|鑽石購買| DIAMOND_RECOVERY[鑽石恢復 +5命條] FORCED_RECOVERY -->|等待| WAIT_TIMER[等待4小時] AUTO_RECOVERY --> TIMER_CHECK{恢復計時器} WATCH_AD --> AD_LIMIT_CHECK{廣告次數檢查} BUY_LIVES --> DIAMOND_COST[50鑽石/命條] TIMER_CHECK -->|時間到| ADD_LIFE[+1命條] TIMER_CHECK -->|未到時間| CONTINUE_TIMER[繼續計時] AD_LIMIT_CHECK -->|次數內 <3次/日| AD_REWARD_LIFE[+1命條] AD_LIMIT_CHECK -->|超過次數| AD_LIMIT_REACHED[廣告次數已滿] DIAMOND_COST --> DIAMOND_CHECK{鑽石是否足夠} DIAMOND_CHECK -->|足夠| PURCHASE_LIVES[購買成功 +1命條] DIAMOND_CHECK -->|不足| INSUFFICIENT_DIAMONDS[鑽石不足] ADD_LIFE --> LIFE_CHECK AD_REWARD_LIFE --> LIFE_CHECK PURCHASE_LIVES --> LIFE_CHECK AD_RECOVERY --> LIFE_CHECK DIAMOND_RECOVERY --> LIFE_CHECK AD_LIMIT_REACHED --> FORCED_RECOVERY INSUFFICIENT_DIAMONDS --> BUY_DIAMONDS[前往購買鑽石] CONTINUE_TIMER --> AUTO_RECOVERY WAIT_TIMER --> AUTO_RECOVERY style NO_LIVES fill:#ffebee style LIFE_CONSUME fill:#ffcdd2 style SUCCESS_REWARD fill:#e8f5e8 style ADD_LIFE fill:#c8e6c9 style PURCHASE_LIVES fill:#a5d6a7 ``` ## 📊 學習分析與統計流程 ### 學習數據收集與分析 ```mermaid graph TD LEARNING_EVENT[學習事件發生] --> EVENT_CAPTURE[事件捕捉] EVENT_CAPTURE --> DATA_CLASSIFICATION{數據分類} DATA_CLASSIFICATION -->|學習行為| BEHAVIOR_DATA[行為數據] DATA_CLASSIFICATION -->|學習成果| PERFORMANCE_DATA[表現數據] DATA_CLASSIFICATION -->|時間數據| TIME_DATA[時間數據] DATA_CLASSIFICATION -->|錯誤數據| ERROR_DATA[錯誤數據] BEHAVIOR_DATA --> BEHAVIOR_ANALYSIS[行為分析] PERFORMANCE_DATA --> PERFORMANCE_ANALYSIS[表現分析] TIME_DATA --> TIME_ANALYSIS[時間分析] ERROR_DATA --> ERROR_ANALYSIS[錯誤分析] BEHAVIOR_ANALYSIS --> LEARNING_PATTERN[學習模式識別] PERFORMANCE_ANALYSIS --> PROGRESS_TRACKING[進度追蹤] TIME_ANALYSIS --> EFFICIENCY_CALC[效率計算] ERROR_ANALYSIS --> WEAKNESS_IDENTIFICATION[弱點識別] LEARNING_PATTERN --> PERSONALIZED_RECOMMENDATION[個人化推薦] PROGRESS_TRACKING --> ACHIEVEMENT_TRACKING[成就追蹤] EFFICIENCY_CALC --> OPTIMIZATION_SUGGESTION[優化建議] WEAKNESS_IDENTIFICATION --> TARGETED_PRACTICE[針對性練習] PERSONALIZED_RECOMMENDATION --> DASHBOARD_UPDATE[儀表板更新] ACHIEVEMENT_TRACKING --> DASHBOARD_UPDATE OPTIMIZATION_SUGGESTION --> DASHBOARD_UPDATE TARGETED_PRACTICE --> DASHBOARD_UPDATE DASHBOARD_UPDATE --> USER_INSIGHTS[用戶洞察展示] style LEARNING_EVENT fill:#e1f5fe style DASHBOARD_UPDATE fill:#e8f5e8 style USER_INSIGHTS fill:#c8e6c9 ``` ## 🌍 跨平台功能流程差異 ### Mobile vs Web 平台特有流程 ```mermaid graph TD PLATFORM_CHECK[平台檢測] --> MOBILE{Mobile App} PLATFORM_CHECK --> WEB{Web App} MOBILE -->|專有功能| MOBILE_FEATURES[Mobile專有功能] WEB -->|專有功能| WEB_FEATURES[Web專有功能] MOBILE_FEATURES -->|觸覺回饋| HAPTIC_FEEDBACK[震動回饋] MOBILE_FEATURES -->|推播通知| PUSH_NOTIFICATION[學習提醒] MOBILE_FEATURES -->|相機掃描| CAMERA_SCAN[掃描書籍] MOBILE_FEATURES -->|離線學習| OFFLINE_MODE[完全離線] MOBILE_FEATURES -->|語音喚醒| VOICE_WAKE["Hey Drama"] WEB_FEATURES -->|多標籤| MULTI_TAB[多標籤學習] WEB_FEATURES -->|快捷鍵| KEYBOARD_SHORTCUTS[鍵盤快捷鍵] WEB_FEATURES -->|數據匯出| DATA_EXPORT[CSV/PDF匯出] WEB_FEATURES -->|列印| PRINT_OPTIMIZE[學習報告列印] WEB_FEATURES -->|多螢幕| MULTI_SCREEN[多顯示器支援] WEB_FEATURES -->|即時協作| REAL_TIME_COLLAB[多人學習] %% 共同功能適配 MOBILE -->|適配| MOBILE_ADAPT[Mobile適配] WEB -->|適配| WEB_ADAPT[Web適配] MOBILE_ADAPT -->|觸控操作| TOUCH_INTERFACE[觸控介面] MOBILE_ADAPT -->|小螢幕優化| SMALL_SCREEN[小螢幕布局] MOBILE_ADAPT -->|原生感受| NATIVE_FEEL[原生體驗] WEB_ADAPT -->|滑鼠操作| MOUSE_INTERFACE[滑鼠介面] WEB_ADAPT -->|大螢幕優化| LARGE_SCREEN[大螢幕布局] WEB_ADAPT -->|瀏覽器整合| BROWSER_INTEGRATION[瀏覽器功能] style MOBILE_FEATURES fill:#e8f5e8 style WEB_FEATURES fill:#f3e5f5 style MOBILE_ADAPT fill:#fff3e0 style WEB_ADAPT fill:#e1f5fe ``` ## 🎯 完整用戶旅程地圖 ### 新用戶完整學習旅程 ```mermaid graph TD NEW_USER[新用戶訪問] --> FIRST_IMPRESSION[首次印象] FIRST_IMPRESSION --> TRIAL_REGISTRATION[試用註冊] TRIAL_REGISTRATION --> ONBOARDING[新手引導] ONBOARDING --> LEVEL_ASSESSMENT[程度評估] LEVEL_ASSESSMENT --> LEARNING_PATH[學習路徑規劃] LEARNING_PATH --> FIRST_LESSON[第一堂課] FIRST_LESSON --> VOCABULARY_INTRO[詞彙介紹] VOCABULARY_INTRO --> DIALOGUE_PRACTICE[對話練習] DIALOGUE_PRACTICE --> IMMEDIATE_FEEDBACK[即時回饋] IMMEDIATE_FEEDBACK --> SUCCESS_FEELING[成功感建立] SUCCESS_FEELING --> HABIT_FORMATION[習慣養成] HABIT_FORMATION --> DAILY_PRACTICE{每日練習} DAILY_PRACTICE -->|堅持| PROGRESS_VISIBLE[進度可見] DAILY_PRACTICE -->|中斷| RE_ENGAGEMENT[重新參與] PROGRESS_VISIBLE --> ACHIEVEMENT_UNLOCK[成就解鎖] ACHIEVEMENT_UNLOCK --> SOCIAL_SHARING[社交分享] RE_ENGAGEMENT --> PUSH_NOTIFICATION[推播提醒] RE_ENGAGEMENT --> EMAIL_REMINDER[郵件提醒] PUSH_NOTIFICATION --> COMEBACK_INCENTIVE[回歸獎勵] EMAIL_REMINDER --> COMEBACK_INCENTIVE SOCIAL_SHARING --> COMMUNITY_ENGAGEMENT[社群參與] COMEBACK_INCENTIVE --> DAILY_PRACTICE COMMUNITY_ENGAGEMENT --> LONG_TERM_ENGAGEMENT[長期參與] LONG_TERM_ENGAGEMENT --> SUBSCRIPTION_CONSIDERATION[考慮訂閱] SUBSCRIPTION_CONSIDERATION --> PREMIUM_TRIAL[高級試用] PREMIUM_TRIAL --> CONVERSION_DECISION{轉換決策} CONVERSION_DECISION -->|訂閱| PREMIUM_USER[付費用戶] CONVERSION_DECISION -->|不訂閱| FREE_USER_JOURNEY[免費用戶旅程] PREMIUM_USER --> ADVANCED_FEATURES[高級功能體驗] ADVANCED_FEATURES --> RETENTION[長期留存] FREE_USER_JOURNEY --> LIMITED_FEATURES[功能限制體驗] LIMITED_FEATURES --> UPGRADE_PROMPTS[升級提示] UPGRADE_PROMPTS --> CONVERSION_DECISION style NEW_USER fill:#e1f5fe style SUCCESS_FEELING fill:#c8e6c9 style ACHIEVEMENT_UNLOCK fill:#fff3e0 style PREMIUM_USER fill:#a5d6a7 style RETENTION fill:#4caf50 ``` ## 📈 性能與監控流程 ### 系統監控與錯誤處理 ```mermaid graph LR SYSTEM_MONITOR[系統監控] --> METRICS_COLLECTION[指標收集] METRICS_COLLECTION --> PERFORMANCE_ANALYSIS[性能分析] PERFORMANCE_ANALYSIS --> THRESHOLD_CHECK{閾值檢查} THRESHOLD_CHECK -->|正常| NORMAL_OPERATION[正常運行] THRESHOLD_CHECK -->|異常| ALERT_TRIGGER[告警觸發] ALERT_TRIGGER --> ERROR_CLASSIFICATION{錯誤分類} ERROR_CLASSIFICATION -->|輕微| LOG_ERROR[記錄錯誤] ERROR_CLASSIFICATION -->|嚴重| IMMEDIATE_ACTION[立即響應] ERROR_CLASSIFICATION -->|致命| SYSTEM_RECOVERY[系統恢復] LOG_ERROR --> ERROR_TRACKING[錯誤追蹤] IMMEDIATE_ACTION --> USER_NOTIFICATION[用戶通知] SYSTEM_RECOVERY --> FALLBACK_MODE[降級模式] NORMAL_OPERATION --> CONTINUOUS_MONITORING[持續監控] ERROR_TRACKING --> IMPROVEMENT_PLAN[改進計劃] USER_NOTIFICATION --> ERROR_RESOLUTION[錯誤解決] FALLBACK_MODE --> SERVICE_RESTORATION[服務恢復] style ALERT_TRIGGER fill:#fff3e0 style IMMEDIATE_ACTION fill:#ffcdd2 style SYSTEM_RECOVERY fill:#ffebee style SERVICE_RESTORATION fill:#e8f5e8 ``` --- ## 🎯 總結 本文檔基於 `/docs/02_design/function-specs/` 完整規格,繪製了Drama Ling語言學習應用的全套用戶流程圖,涵蓋: ### ✅ **已包含的完整流程** 1. **認證系統流程** - 註冊、登入、角色權限管理 2. **學習地圖流程** - 關卡導航、成就系統 3. **詞彙學習流程** - 學習模式、間隔複習算法 4. **情境對話流程** - AI對話分析、表現評估 5. **道具商店流程** - 購買流程、虛擬貨幣經濟 6. **命條系統流程** - 生命值管理、恢復機制 7. **分析統計流程** - 數據收集、個人化推薦 8. **跨平台差異** - Mobile vs Web 功能適配 9. **用戶旅程地圖** - 從新用戶到長期留存 10. **系統監控流程** - 性能監控、錯誤處理 ### 📊 **規格一致性確認** - ✅ 完全對應 5個核心功能模組 - ✅ 涵蓋 Mobile + Web 雙平台特性 - ✅ 整合共同業務規則和API規格 - ✅ 包含完整的用戶角色權限邏輯 - ✅ 反映平台功能對應表的差異化設計 **文檔狀態**: 🟢 已完成 **基於版本**: function-specs v1.1 **最後更新**: 2025-09-10