跳转到内容

04-20屏线性流程图

这份文档把当前 onboarding 同时用两层方式表达清楚:

  • 用户视角的 20 个可见页面
  • 工程视角的 18 个实现 step
flowchart TD
    V01[01 Brand Intro]
    V02[02 Showcase A]
    V03[03 Showcase B]
    V04[04 Showcase C]
    V05[05 Showcase D]
    V06[06 Coach Intro]
    V07[07 Phase Intro]
    V08[08 Goal]
    V09[09 Level]
    V10[10 Pain]
    V11[11 Week Intro]
    V12[12 Start Type]
    V13[13 Interest Tags]
    V14[14 Daily Time]
    V15[15 Weekly Frequency]
    V16[16 Notification Prompt]
    V17[17 Encouragement]
    V18[18 Explanation]
    V19[19 Generating]
    V20[20 Plan Result]
    PAY[Paywall]

    V01 --> V02 --> V03 --> V04 --> V05 --> V06 --> V07 --> V08 --> V09 --> V10 --> V11 --> V12 --> V13 --> V14 --> V15 --> V16 --> V17 --> V18 --> V19 --> V20 --> PAY
flowchart TD
    S01[brandIntro]
    S02[networkWarmup]
    S03[welcomeShowcase]
    S04[coachIntro]
    S05[phaseIntro]
    S06[goalQuestion]
    S07[levelQuestion]
    S08[painQuestion]
    S09[weekIntro]
    S10[startTypeQuestion]
    S11[interestTags]
    S12[dailyTimeQuestion]
    S13[weeklyFrequency]
    S14[notificationPrompt]
    S15[encouragement]
    S16[explanation]
    S17[generating]
    S18[plan]
    PAY[Paywall]

    S01 --> S02 --> S03 --> S04 --> S05 --> S06 --> S07 --> S08 --> S09 --> S10 --> S11 --> S12 --> S13 --> S14 --> S15 --> S16 --> S17 --> S18 --> PAY
flowchart TD
    V01[01 Brand Intro] --> S01[brandIntro]
    H1[(hidden)] --> S02[networkWarmup]
    V02[02-05 Showcase 4 pages] --> S03[welcomeShowcase]
    V06[06 Coach Intro] --> S04[coachIntro]
    V07[07 Phase Intro] --> S05[phaseIntro]
    V08[08 Goal] --> S06[goalQuestion]
    V09[09 Level] --> S07[levelQuestion]
    V10[10 Pain] --> S08[painQuestion]
    V11[11 Week Intro] --> S09[weekIntro]
    V12[12 Start Type] --> S10[startTypeQuestion]
    V13[13 Interest Tags] --> S11[interestTags]
    V14[14 Daily Time] --> S12[dailyTimeQuestion]
    V15[15 Weekly Frequency] --> S13[weeklyFrequency]
    V16[16 Notification Prompt] --> S14[notificationPrompt]
    V17[17 Encouragement] --> S15[encouragement]
    V18[18 Explanation] --> S16[explanation]
    V19[19 Generating] --> S17[generating]
    V20[20 Plan Result] --> S18[plan]
flowchart TD
    P20[20 Plan Result] -->|返回| P18[18 Explanation]
    P18 -->|返回| P17[17 Encouragement]
    P17 -->|返回| P16[16 Notification Prompt]
    P16 -->|返回| P15[15 Weekly Frequency]
    P15 -->|返回| P14[14 Daily Time]
    P14 -->|返回| P13[13 Interest Tags]
    P13 -->|返回| P12[12 Start Type]
    P12 -->|返回| P10[10 Pain]
    P10 -->|返回| P09[09 Level]
    P09 -->|返回| P08[08 Goal]
    P08 -->|返回| P06[06 Coach Intro]
    P06 -->|返回| P0205[02-05 Welcome Showcase]

说明:

  • 11 Week Intro07 Phase Intro 为自动过场,不单独作为回退落点
  • 14 Daily Time 返回时会回到 13 Interest Tags
  • 15 Weekly Frequency 返回时会回到 14 Daily Time
  • 20 Plan Result 返回时直接回到 18 Explanation
flowchart TD
    SHOW[02-05 Welcome Showcase]
    AUTH[Full-screen AuthViewController]
    HOME[Home]
    SHELL[Onboarding Shell]
    PLAN[20 Plan Result]
    PAY[Full-screen PaywallViewController]

    SHOW -->|我已有账号| AUTH
    AUTH -->|取消关闭| SHELL
    AUTH -->|登录成功| HOME

    PLAN -->|出发吧!| PAY
    PAY -->|关闭| HOME
flowchart TD
    subgraph A[阶段 1 沉浸进入]
        A1[01-06]
    end

    subgraph B[阶段 2 先被理解]
        B1[07-10]
    end

    subgraph C[阶段 3 安排第一周]
        C1[11-17]
    end

    subgraph D[阶段 4 说明开始方式]
        D1[18]
    end

    subgraph E[阶段 5 生成计划]
        E1[19]
    end

    subgraph F[阶段 6 交付第一周]
        F1[20]
    end

    A --> B --> C --> D --> E --> F