02-20屏原型规格
20 屏原型规格
Section titled “20 屏原型规格”本文档描述当前 onboarding 的 20 个可见页面，并明确它与当前 iOS 18 个实现 step 的映射关系。
1. 计数规则
Section titled “1. 计数规则”1.1 可见页面
Section titled “1.1 可见页面”用户实际能看到的是 01-20。
1.2 实现 step
Section titled “1.2 实现 step”代码里多了一个不可见的 networkWarmup，同时把 02-05 四页轮播收在同一个 welcomeShowcase step 里。
2. 全局交互规则
Section titled “2. 全局交互规则”01 / 07 / 11 / 19为自动页。02-05为单个 step 内的 4 页轮播。08 / 09 / 10 / 12 / 14首次进入时为单选即前进；返回后保留已选状态，并改为显式下一步。13为多选页，未选中任何标签前不能继续。15底部下一步始终存在；默认值是3 次/周，用户即使不调整也可以继续。16的下一步和稍后都进入17。20无顶部返回、无顶部进度条；底部主按钮悬浮在物理屏幕底部。
3. 逐屏规格
Section titled “3. 逐屏规格”01 Brand Intro
Section titled “01 Brand Intro”- 代码 step：
brandIntro - 视觉：白底，真实
logo + mascot - 节奏：约
2.7s - 作用：只做品牌亮相，不显示按钮
02 Welcome Showcase A
Section titled “02 Welcome Showcase A”- 代码 step：
welcomeShowcase - 标题：
边听边学 - 副标题：
更容易开始
03 Welcome Showcase B
Section titled “03 Welcome Showcase B”- 代码 step：
welcomeShowcase - 标题：
随时随地 - 副标题：
口袋里的学习材料
04 Welcome Showcase C
Section titled “04 Welcome Showcase C”- 代码 step：
welcomeShowcase - 标题：
坚持听懂 - 副标题：
长出语感
05 Welcome Showcase D
Section titled “05 Welcome Showcase D”- 代码 step：
welcomeShowcase - 标题：
真实材料 - 副标题：
毫不枯燥
统一规则：
- 4 页按同一锚点轮播
- 每页约
3.0s - 主按钮：
开始 - 次入口：
我已有账号
06 Coach Intro
Section titled “06 Coach Intro”- 代码 step：
coachIntro - 标题：
你好! - 文案：
我是你的日语教练，接下来想问你一些问题，以便给你打造你的个人专属计划 - 视觉：复用 coach 图；
👋emoji 当前已收口为36 - 主按钮：
我准备好了
07 Phase Intro
Section titled “07 Phase Intro”- 代码 step：
phaseIntro - 文案：
- 眉标题：
第一部分 - 主标题：
快速找到适合你的\n学习方式
- 眉标题：
- 视觉：全红自动过场
08 Goal Question
Section titled “08 Goal Question”- 代码 step：
goalQuestion - 标题：
你现在最想改善什么？ - 选项：
听懂一点更敢开口重新开始
09 Level Question
Section titled “09 Level Question”- 代码 step：
levelQuestion - 标题：
你现在更接近哪一种？ - 选项：
刚开始学过一点基础还行
10 Pain Question
Section titled “10 Pain Question”- 代码 step：
painQuestion - 标题：
你最容易卡在哪里？ - 选项：
一听就丢连不起来很难开始
11 Week Intro
Section titled “11 Week Intro”- 代码 step：
weekIntro - 文案：
- 眉标题：
第二部分 - 主标题：
接下来，安排适合\n你的第一周
- 眉标题：
- 视觉：全红自动过场
12 Start Type Question
Section titled “12 Start Type Question”- 代码 step：
startTypeQuestion - 标题：
你想从哪种内容开始？ - 副文案：
我们先按你更容易进入的方式来安排。 - 选项：
轻松一点贴近日常更有目标感
13 Interest Tags
Section titled “13 Interest Tags”- 代码 step：
interestTags - 标题：
你对哪些内容更感兴趣？ - 副文案：
可多选，我们会优先安排这些主题。 - 标签：
动漫日常对话综艺娱乐日本旅行留学学习JLPT 备考职场商务文化生活
- 主按钮：
下一步
14 Daily Time Question
Section titled “14 Daily Time Question”- 代码 step：
dailyTimeQuestion - 标题：
这周你想留多少时间？ - 选项：
每天 5 分钟每天 10 分钟每天 20 分钟
15 Weekly Frequency
Section titled “15 Weekly Frequency”- 代码 step：
weeklyFrequency - 标题：
你想要一周练习几次？ - 副文案：
练习听力的基础频次 - 交互：
- 默认值：
3 次/周 - 支持调整到更高频次
下一步始终显示- 如果用户未调整，继续时自动沿用
3 次/周
- 默认值：
16 Notification Prompt
Section titled “16 Notification Prompt”- 代码 step：
notificationPrompt - 标题：
更快地达成目标 - 副文案：
开启提醒后，更容易把练习放进每天的节奏里。 - 现状：
- 当前只做界面承接
- 还没有触发真实系统通知授权
17 Encouragement
Section titled “17 Encouragement”- 代码 step：
encouragement - 标题：
你的潜力很大 - 高亮：
一周后，就能感受到一些变化 - 主按钮：
下一步
18 Explanation
Section titled “18 Explanation”- 代码 step：
explanation - 标题：
你会这样开始 - 三段说明：
先给你一条真实材料把听、看、查拆成小步按你的节奏推进一周
- 主按钮：
生成我的计划 - 视觉补充：
- badge 已统一为圆形红底白勾
19 Generating
Section titled “19 Generating”- 代码 step：
generating - 标题：
正在为你生成个性化练习材料 - 视觉：
- 环形进度
- 五条条件摘要
- 当前摘要维度：
- 目标
- 起点 + 卡点
- 开始方式
- 每日时长 + 每周频次
- 兴趣主题
- 节奏：按当前实现约
5.6s
20 Plan Result
Section titled “20 Plan Result”- 代码 step：
plan - 标题：
七天，听见进步 - 顶部规则：
- 不显示顶部壳层
- 不显示返回
- 不显示进度条
- 页面性质：
- 整页可向下滚动
- 底部主按钮
出发吧！悬浮在物理屏幕底部 - 按钮不再带白色底托，底下内容仍应可见
- 当前内容顺序：
- coach 提示气泡
- 成功暗示图
- 计划摘要卡
真实日语，每天更新听读同步，高亮注解逐句精听，啃下难句点词即查，阅读不断线逐句 AI 解惑
- 主按钮动作：
- 打开全屏 paywall
4. 当前实现与可见页面的映射补充
Section titled “4. 当前实现与可见页面的映射补充”| 可见页面 | 实现 step | 说明 |
|---|---|---|
01 | brandIntro | 一一对应 |
02-05 | welcomeShowcase | 4 页轮播收在一个 step 内 |
06 | coachIntro | 一一对应 |
07 | phaseIntro | 一一对应 |
08 | goalQuestion | 一一对应 |
09 | levelQuestion | 一一对应 |
10 | painQuestion | 一一对应 |
11 | weekIntro | 一一对应 |
12 | startTypeQuestion | 一一对应 |
13 | interestTags | 一一对应 |
14 | dailyTimeQuestion | 一一对应 |
15 | weeklyFrequency | 一一对应 |
16 | notificationPrompt | 一一对应 |
17 | encouragement | 一一对应 |
18 | explanation | 一一对应 |
19 | generating | 一一对应 |
20 | plan | 一一对应 |
另有一个不可见 step：
networkWarmup- 位于
01与02之间 - 当前用于 opening 段前置网络预热
- 位于