2026-04-11-yomiya-onboarding-google-stitch-full-context

Yomiya Onboarding Google Stitch Full Context

日期：2026-04-11

中文边界说明：本文是 2026-04-11 的历史 Stitch 上下文材料，不再作为当前 onboarding 事实源。 当前中文事实入口请读 product/YomiyaOnboarding/README.md，维护规则请读 docs/文档唯一来源维护规则.md。

1. 这份文档是什么

这是一份给 Google Stitch 使用的完整上下文文档。

目标不是只给一段简短 prompt，而是把 Yomiya onboarding 的产品目标、目标用户、完整流程、页面职责、交互规则、计划生成逻辑、视觉约束、现有 design token 继承来源、模板拆分和明确禁区一次性说清楚，尽量减少 Stitch 的猜测空间。

这份文档应被理解为：

• 产品上下文
• 流程上下文
• 视觉上下文
• 设计边界
• 第一轮输出范围

合并后的单一真相来源。

2. 项目名称与平台

• 产品名：Yomiya / 每日日语
• 目标平台：iOS 移动端
• 默认设备：iPhone 375px 宽竖屏
• 第一轮只做：Light Mode

3. 这次 onboarding 要解决什么

这次 onboarding 要解决的不是“怎样先卖会员”，而是：

• 用户第一次进入时，能否快速理解产品的开始方式
• 用户能否在很短路径里说出自己的目标、卡点和起点
• 用户能否拿到一份具体、可信的第一周开始方式
• 订阅能否变成“正式开始确认”，而不是孤立销售页

核心 Aha Moment 不是“系统很懂我”，而是：

我现在就能从真实内容开始，而且这条开始方式是可执行的。

4. 明确不做什么

• 不做 paywall-first
• 不做重资料采集
• 不做强测评
• 不做两套完全独立的新手 / 进阶流程
• 不做重复总结页或纯仪式性过场页
• 不在第一轮里重新设计订阅页内部结构

5. 目标用户

当前主要覆盖两类用户：

1. 新手或中断后重启的用户

   • 需要更轻的入口
   • 不想先被课程压力压住

2. 学过一点但真实内容跟不上的用户

   • 不想被当零基础
   • 不想继续空转

对应策略不是拆两套 onboarding，而是：

• 一套骨架
• 一次轻分流
• 后续页面只改文案重心、默认排序和计划变体

6. 为什么从 15 屏收敛成 13 屏

最初按 15 屏增强版 思考，是为了把阶段感、计划感、订阅收口做完整。

但推演后发现，后段存在明显重复：

• 10 已经说明了“你会这样开始”，后面再做一层总结会重复
• 12 如果只是过场，信息增量不足
• 若在后段再展示一遍用户已选内容，会让流程更像 ceremony，而不是 getting started

所以最终收敛为 13 屏主链。原则只有三条：

• 每一屏都必须新增一类信息
• 不允许出现第二个“总结页”
• 不允许让用户为了仪式感多看一屏

7. 最终 13 屏结构

阶段	屏数	目标
阶段 1 品牌进入	01-03	让用户愿意进入流程，并理解这是一个完整克制的产品
阶段 2 先被理解	04-06	收集目标、卡点、起点，完成一次轻分流
阶段 3 安排第一周	07-09	从“说出自己”切到“安排这一周怎么开始”
阶段 4 说明开始方式	10	告诉用户接下来会怎么开始，不做理念宣讲
阶段 5 生成计划	11	把等待变成“正在为我准备”
阶段 6 交付与订阅	12-13	先交付第一周，再进入订阅确认

13 屏逐屏定义：

屏	名称	页面任务
01	品牌开场	建立品牌气质，自动进入
02	动态起始页	告诉用户产品方法，并提供开始入口
03	阶段过场	正式进入“快速找到适合你的学习方式”
04	主目标页	你最想改善什么
05	卡点页	你最容易卡在哪里
06	起点判断页	当前更接近哪一种起点
07	中性过场页	从问答切到“安排第一周”
08	时间承诺页	这周愿意留多少时间
09	内容偏好页	想从哪类内容开始
10	开始方式说明页	告诉用户接下来会怎么开始
11	计划生成页	生成第一周计划
12	第一周计划页	交付节奏、首条内容、功能承接和短期预期
13	订阅页	让订阅变成正式开始确认

8. 全局交互规则

8.1 顶部结构

• 左上角返回箭头：只在可编辑 / 可决策页显示
• 顶部进度：按 6 个阶段 显示
• 自动页不显示返回，不进入历史栈

8.2 回退与反选规则

屏	是否可回退	返回到
01	否	-
02	否，只有关闭 / 已有账号入口	-
03	否，自动页	-
04	是	02
05	是	04
06	是	05
07	否，自动页	-
08	是	06
09	是	08
10	是	09
11	否，自动页	-
12	是	10
13	是	12

统一规则：

• 回到单选页时，之前的选择保持高亮
• 用户改选后，直接覆盖旧答案并继续自动进入下一步
• 只要 04 / 05 / 06 / 08 / 09 任一答案被改动，11-13 需要按新答案重新生成
• 用户从 13 返回 12，再改前面的内容后重新进入 13，套餐选中状态重置为默认推荐项

8.3 老用户路径

• 老用户若从 02 点击 我已有账号 进入登录流
• 在登录页点击关闭 X 后
• 可直接跳过整个 onboarding 进入产品主界面

这是一条存在于产品规格中的真实流程规则，Stitch 不一定要重点表现，但不能与之冲突。

9. 页面文案原则

• 优先短句，支持多语言
• 不替用户下结论
• 不过度安抚，也不过度承诺
• 不解释系统自己在做什么
• 按钮优先写用户动作

按钮语义示例：

• 开始
• 继续
• 生成我的计划
• 正式开始
• 开始订阅

10. 逐屏详细规格

01 品牌开场

• 页面任务：建立品牌气质
• 页面元素：
  • 品牌名：每日日语
  • 副标题：慢慢长出语感
• 按钮：无
• 动作：自动停留约 1.6s 后进入 02

02 动态起始页

• 页面任务：用最短文案说明产品方法，并给出开始入口
• 页面文案：
  • 主文案：
    • 边听边学
    • 更容易开始
  • 主按钮：开始
  • 次入口：我已有账号
• 页面元素：
  • 顶部阶段进度：阶段 1 / 6
  • 中央主张区
  • 底部主按钮
  • 次入口
• 动作：
  • 点击 开始 → 03
  • 点击 我已有账号 → 登录流
  • 登录流关闭 X → 直接跳过整个 onboarding，进入产品主界面

03 阶段过场页

• 页面任务：把用户带入正式 onboarding
• 页面文案：
  • 快速找到
  • 适合你的
  • 学习方式
• 按钮：无
• 动作：自动停留约 1.2s 后进入 04

04 主目标页

• 页面任务：收集用户当前最想改善的方向
• 页面标题：
  • 你现在最想
  • 改善什么？
• 选项：
  • 听懂一点 / 更容易跟上真实内容
  • 更敢开口 / 说的时候没那么卡
  • 重新开始 / 把学习接回来
• 记录字段：intent_primary
• 动作：
  • 点击任一选项 → 直接进入 05
  • 左上返回 → 02

05 卡点页

• 页面任务：收集最主要阻力
• 页面标题：
  • 你最容易
  • 卡在哪里？
• 选项：
  • 一听就丢 / 速度一快就断掉
  • 连不起来 / 认识词，放进内容就糊
  • 很难开始 / 知道该学，却总没开始
• 记录字段：pain_primary
• 动作：
  • 点击任一选项 → 06
  • 左上返回 → 04

06 起点判断页

• 页面任务：完成轻分流
• 页面标题：
  • 你现在更接近
  • 哪一种？
• 选项：
  • 刚开始 / 想轻松进入
  • 学过一点 / 但还是跟不稳
  • 基础还行 / 想更自然听懂
• 记录字段：level_self_assessed
• 动作：
  • 点击任一选项 → 07
  • 左上返回 → 05

07 中性过场页

• 页面任务：从问答切到“安排第一周”
• 页面文案：
  • 接下来，
  • 安排你的第一周
  • 辅助文案：再看两步，就能开始。
• 按钮：无
• 动作：自动停留约 1.2s 后进入 08

08 时间承诺页

• 页面任务：决定一周内的节奏强度
• 页面标题：
  • 这周你想留
  • 多少时间？
• 选项：
  • 每天 5 分钟 / 轻一点，先开始
  • 每天 10 分钟 / 更稳一点，也不重
  • 每天 20 分钟 / 想更集中地往前走
• 记录字段：weekly_commitment_minutes
• 动作：
  • 点击任一选项 → 09
  • 左上返回 → 06

09 内容偏好页

• 页面任务：决定首条内容入口方向
• 页面标题：
  • 你想从哪类
  • 内容开始？
• 选项：
  • 轻松听一听 / 更容易进入真实内容
  • 日常对话 / 更接近生活里会遇到的表达
  • 更有结构感 / 更适合想稳一点往前走
• 记录字段：interest_cluster_primary
• 动作：
  • 点击任一选项 → 10
  • 左上返回 → 08

10 开始方式说明页

• 页面任务：说明接下来会如何开始，不宣讲产品理念
• 页面标题：你会这样开始
• 内容模块：
  • 先开始一条内容 / 先走一小步，更容易开始。
  • 卡住时再看一点 / 精听、AI 解析、查词，都会接住你。
  • 按你的节奏继续 / 先坚持一周，你会更容易听进去。
• 主按钮：生成我的计划
• 动作：
  • 点击主按钮 → 11
  • 左上返回 → 09

11 计划生成页

• 页面任务：生成第一周计划
• 页面文案：
  • 你的第一周，
  • 快整理好了
• 生成中状态：
  • 正在匹配第一条内容
  • 正在整理这一周节奏
  • 正在准备辅助功能入口
• 顶部阶段条：隐藏
• 动作：
  • 至少停留 2.0s
  • 且第一周计划数据准备完成后进入 12
  • 若数据未完成，则继续停留在生成中状态

12 第一周计划页

• 页面任务：第一次真正交付具体计划
• 页面标题：
  • 这是你的
  • 第一周
• 内容模块：
  • 每天 10 分钟 / 先把开始做顺，再慢慢加深。
  • 第一条内容：轻松听一听 / 一条更容易进入的真实内容，适合重新接回语感。
  • 遇到卡点时 / 精听、AI 解析、查词都会在你需要时出现。
  • 先坚持一周 / 你会更容易听进去，也更容易继续下去。
• 主按钮：正式开始
• 动作：
  • 点击主按钮 → 13
  • 左上返回 → 10

13 订阅页

• 页面任务：让订阅变成“正式开始确认”
• 说明：本页沿用既有订阅体系设计，当前 onboarding 文档只定义进入时机与主次动作，不在本轮重订内部结构
• 页面标题：开始这一周
• 辅助文案：
  • 你的第一周已经准备好了。
  • 订阅后，现在就可以开始。
• 套餐区：
  • 推荐项：
    • 年订阅
    • 更适合想稳定学下去的人
    • ¥298 / 年
  • 次选项：
    • 月订阅
    • 先按月开始，也能随时继续
    • ¥39 / 月
• 主按钮：开始订阅
• 次动作：暂不订阅
• 动作：
  • 主按钮 → 拉起 iOS 支付
  • 次动作 → 返回 12 或进入欢迎页
  • 次动作 → 进入产品主界面

11. 计划生成逻辑

当前先固定这些字段：

• intent_primary
• pain_primary
• level_self_assessed
• weekly_commitment_minutes
• interest_cluster_primary
• onboarding_plan_variant
• first_content_id

原则：

• 只保留能影响计划生成和首条推荐的字段
• 不采与第一周开始无关的资料

11.1 四个计划变体

• light_restart_start
  • 适合刚开始 / 想重新接回学习
• easy_listening_start
  • 适合想先听进去一点的用户
• daily_dialog_start
  • 适合更想从对话内容进入的人
• structured_progress_start
  • 适合基础还行、想更稳往前走的人

11.2 变体触发规则

• light_restart_start
  • 当 intent_primary = 重新开始 时优先触发
  • 若 level_self_assessed = 刚开始，继续保持该变体
• easy_listening_start
  • 当 interest_cluster_primary = 轻松听一听 时优先触发
  • 若用户没有命中更强规则，且整体目标是先低门槛进入真实内容，也落到该变体
• daily_dialog_start
  • 当 interest_cluster_primary = 日常对话 时触发
• structured_progress_start
  • 当 interest_cluster_primary = 更有结构感 时触发
  • 或 level_self_assessed = 基础还行 且没有更强的兴趣偏好覆盖时触发

优先级：

1. intent_primary = 重新开始 → light_restart_start
2. 否则按 interest_cluster_primary 分到对应变体
3. 若兴趣未命中，再用 level_self_assessed 兜底到 light_restart_start 或 structured_progress_start

11.3 每个计划变体至少定义

• 第一条内容池
• 每天建议时长
• 计划页 4 张卡片的默认文案
• 订阅页默认推荐套餐

11.4 第一条内容选择规则

第一条内容不要只按热门推，优先看：

• 进入门槛低不低
• 10 分钟左右能否形成完整体验
• 能否自然带出精听 / AI 解析 / 查词
• 看完后能否继续第二条

12. 当前视觉方向总纲

采用：

方案 B：前段有情绪，后段回归产品主语言

这意味着：

• onboarding 不是一套完全脱离现有产品的子品牌视觉
• 但前段也不能和现有内容页一样平，必须建立足够清楚的进入感和开始感
• 前 2-3 类模板允许更强的情绪氛围和插画表达
• 中后段页面必须明显回归现有 EveryDayJapanese-iOS 的轻壳层产品语言

整体气质关键词：

• 明亮
• 鼓励
• 开始感强
• 轻
• 克制
• 可信

不希望的气质：

• 过强营销化
• 过强成就体系感
• 过强健身 App 激励感
• 过强教材 / 课程系统感

13. 第一轮 Stitch 输出范围

第一轮只做 5 类模板，不包含订阅页。

模板列表：

1. Hero 启动页
2. 单选决策页
3. 说明型 CTA 页
4. 生成中页
5. 计划交付页

映射关系：

• 01 / 02 / 03 / 07 → Hero 启动页
• 04 / 05 / 06 / 08 / 09 → 单选决策页
• 10 → 说明型 CTA 页
• 11 → 生成中页
• 12 → 计划交付页

明确不在第一轮范围内：

• 13 订阅页
• 暗色模式
• 完整 13 屏高保真展开
• 第二层转化页
• 更复杂的教育页和权益页

14. 现有设计语言继承来源

Google Stitch 需要继承现有 iOS 工程中的设计语言，而不是从零重新发明一套视觉。

主要继承来源：

• EveryDayJapanese/Controller/YomiyaDemo/Theme/YomiyaDesignTokens.swift
• EveryDayJapanese/Extension/SwiftUI/Spacing/Spacing.swift
• EveryDayJapanese/Extension/SwiftUI/TextStyle.swift
• EveryDayJapanese-iOS 中已经确立的轻壳层、无边框、低阴影设计原则

15. Design Token 精确继承信息

以下数值和语义对 Stitch 很重要。

15.1 Surface / Text / Accent

来自 YomiyaDesignTokens.swift：

• pageBackground = Color.background
• surfacePrimary = Color.background
• surfaceRaised = Color(uiColor: .fill2).opacity(0.5)
• surfaceMuted = Color(uiColor: .fill2).opacity(0.82)
• textPrimary = Color.textFill1
• textSecondary = Color.textFill2
• textTertiary = Color.textFill3
• accentStrong = Color.brand1
• dividerSubtle = Color.borderCommon
• floatingShadow = Color.textFill1.opacity(0.06)

Stitch 应将其翻译为：

• 页面外壳轻，不厚重
• 大部分页面使用浅底和柔和表面层级
• 卡片靠浅表面色差和圆角成立
• 默认不使用描边
• 默认不使用悬浮阴影
• shadow 不是默认视觉语言

15.2 Spacing

全局 spacing tokens：

• 2
• 4
• 8
• 12
• 16
• 24
• 32
• 40
• 48

Yomiya 额外 spacing：

• pageHorizontalInset = 16
• pageBottomInset = 24
• headerClusterSpacing = 10
• moduleClusterSpacing = 22
• sectionClusterSpacing = 14
• rowClusterSpacing = 12
• compactTextSpacing = 4
• regularTextSpacing = 6
• feedCardSpacing = 24
• railCardSpacing = 10

Stitch 应把 16px 视为页面主边距基线。

15.3 Radius / Size

• featureCardCorner = 16
• featureArtworkCorner = 10
• heroCardHeight = 132
• heroArtworkSize = 60
• collectionRowArtworkSize = 68
• railCardWidth = 152
• railArtworkHeight = 112
• feedCardHeight = 160

虽然 onboarding 不是内容前台页面，但这些数值透露出一个明确语言：

• 中等圆角
• 不夸张
• 不厚重
• 不用极端大卡

15.4 Typography

来自 TextStyle.swift 和 YomiyaDesignTokens.swift：

• display1 / display2 = 28 semibold
• display4 = 22
• title1 = 17 semibold
• title2 = 17 regular
• headline1 = 16 medium
• headline2 = 16
• body1 = 14
• body2 = 14
• body3 = 12

Yomiya 额外文本 token：

• sectionTitleFont = 18 semibold
• sectionAccessoryFont = 13 medium
• sectionChevronFont = 11 semibold
• heroTitleFont = 16 semibold
• heroSubtitleFont = 12 regular
• rowTitleFont = 15 semibold
• rowSubtitleFont = 12 regular
• cardTitleFont = 16 semibold
• cardSubtitleFont = 12 regular
• cardMetaFont = 11 regular
• tabFont = 13 medium
• searchFieldFont = 14 regular
• actionButtonFont = 14 semibold

Stitch 应理解为：

• 类型层级干净、理性、接近 iOS 原生
• 不做广告式大开大合
• 大标题可以比现有 token 更强一点，但不能完全脱离这套层级

16. 视觉硬约束

16.1 模式与平台

• 第一轮只做 Light Mode
• 设备默认 iPhone 375px 宽竖屏
• 使用 iOS 原生布局语言

16.2 主色策略

• 主强调色直接沿用现有 brand1 / accentStrong
• 不新造第二套 onboarding 品牌色
• 主色只做点缀，不做大面积铺底

主色允许出现的位置：

• 主按钮
• 单选卡选中态的小面积强调
• 顶部阶段进度的命中部分
• 计划交付页的关键行动点
• 少量 icon / 提示点

主色不应出现的方式：

• 整屏主色背景
• 大面积高饱和铺色
• 每一屏都用主色做主要视觉重量
• 用主色替代信息层级

16.3 卡片策略

• 页面允许存在卡片分组
• 但必须参考前端实验中的 无边框、无阴影卡片
• 主要靠 surfaceMuted / surfaceRaised 一类轻表面色差和圆角成立
• 禁止厚重卡片堆叠感

16.4 顶部进度

• 顶部进度存在感应当 清楚但克制
• 更像阶段提示，不像考试式任务进度条
• 在 单选决策页 和 说明型 CTA 页 中保持一致
• 在 生成中页 中隐藏

16.5 插画策略

• 插画只出现在：
  • Hero 启动页
  • 生成中页
• 其余页面回归纯产品界面

插画人物画像：

• 22-30 岁
• 城市年轻人
• 更像通勤、独处、轻学习、自主安排生活的人

场景策略：

• Hero 启动页 偏通勤 / 城市移动 / 开始感
• 生成中页 偏室内轻学习 / 安静准备感

日语学习线索：

• 中等露出
• 可以包含少量：
  • 日文字符碎片
  • 字幕感
  • 听力波形
  • 对话气泡
  • 学习卡片片段
• 但不能堆满屏幕

17. 视觉禁区

以下方向在第一轮中明确禁止：

• 健身 App 式强激励、强对抗、强成就海报感
• 大面积高饱和蓝底、紫底、霓虹渐变
• 过强广告感的 paywall 语气提前渗入前五类模板
• 厚描边卡片
• 悬浮阴影卡片
• 玻璃拟态卡片
• 二次元海报风
• 日漫封面风
• 过强教材产品感
• 樱花、鸟居、和风纹样等刻板日本意象堆砌
• 大量日文文本铺陈
• 把计划页做成总结页、成就页或报告页
• 把决策页做成设置页或问卷系统

正向约束：

• 明亮，但不刺眼
• 鼓励开始，但不喊口号
• 有情绪，但不营销化
• 有卡片分组，但不厚重
• 有品牌识别，但不靠满屏品牌色
• 有学习线索，但不做教材感

18. 模板级设计要求

18.1 Hero 启动页

覆盖 screens：

• 01
• 02
• 03
• 07

页面任务：

• 建立第一印象
• 同时立住品牌与情绪标题
• 让用户感到“现在就能开始”

信息结构：

• 顶部安全区 / 状态栏
• 品牌名
• 情绪标题
• 可选副标题或阶段提示
• 主 CTA 或自动推进提示
• 背景插画 / 场景氛围

设计要求：

• 这是整套 onboarding 中情绪最强的一类页
• 但不能像广告海报或开屏硬广
• 品牌名和情绪标题并重
• 品牌不是 splash logo，也不能完全退到角落
• 主色只做局部点亮
• 背景主要由浅色氛围、场景插画和轻空气感成立

细节要求：

• 01 更像品牌开场，无 CTA
• 02 有清楚 CTA，是开始感最强的一屏
• 03 / 07 更像阶段转场页，保留情绪但降低操作性

18.2 单选决策页

覆盖 screens：

• 04
• 05
• 06
• 08
• 09

页面任务：

• 承担 onboarding 的主骨架
• 快速收集关键偏好
• 让用户点选后自然前进

信息结构：

• 返回箭头
• 顶部阶段进度
• 双行标题
• 3 个单选项
• 每个选项两行信息

设计要求：

• 回归现有产品主语言
• 页面浅底、轻容器、强可读
• 不再依赖插画
• 选项卡有卡片感，但必须无边框、无阴影
• 靠轻表面变化、圆角、留白成立

选中态要求：

• 清楚但不过分
• 通过轻表面变化、小面积主色点缀、字重变化和细标记来表达
• 不得做成大按钮感

18.3 说明型 CTA 页

覆盖 screens：

• 10

页面任务：

• 把“你会这样开始”讲清楚
• 建立开始路径的可信度
• 为进入生成态做心理预备

信息结构：

• 返回箭头
• 顶部阶段进度
• 页面标题
• 3 个说明模块
• 主按钮

设计要求：

• 比单选页更多一点说明感
• 但不能变成详情页或价值宣讲页
• 三个模块应像明确的行动步骤，而不是营销卖点
• 模块继续采用轻卡片或轻分组
• 无边框、无阴影

18.4 生成中页

覆盖 screens：

• 11

页面任务：

• 把等待转化成“正在为你准备”的体验
• 建立被认真准备的感受
• 为计划交付页蓄势

信息结构：

• 主标题
• 生成中状态文案列表
• 插画场景
• 可选的轻量进度暗示
• 无返回
• 无顶部阶段条

设计要求：

• 这是第二个允许使用插画的模板
• 情绪上比 Hero 更安静、更专注
• 不是技术化 loading page
• 更像“系统正在整理你的开始方式”

18.5 计划交付页

覆盖 screens：

• 12

页面任务：

• 真正交付第一周计划
• 让用户感到“现在就可以开始”
• 把主按钮变成自然的下一步动作

信息结构：

• 返回箭头
• 页面标题
• 4 个计划模块
• 主按钮

设计要求：

• 更像行动页，不像摘要页
• 4 个模块要有主次关系，而不是平均排布成 checklist
• 继续使用轻卡片语言
• 无边框、无阴影
• 比单选页更稳一点，但仍然轻

优先级建议：

1. 节奏
2. 第一条内容
3. 卡住时的承接功能
4. 一周预期

主按钮要求：

• 按钮要明显
• 但计划内容仍应是页面主体
• 不得让页面看起来像 paywall 前置页

19. 第一轮应直接使用的 screen 文案

Hero 启动页

• 01
  • 每日日语
  • 慢慢长出语感
• 02
  • 边听边学
  • 更容易开始
  • 开始
  • 我已有账号
• 03
  • 快速找到
  • 适合你的
  • 学习方式
• 07
  • 接下来，
  • 安排你的第一周
  • 再看两步，就能开始。

单选决策页

• 04
  • 你现在最想
  • 改善什么？
  • 听懂一点 / 更容易跟上真实内容
  • 更敢开口 / 说的时候没那么卡
  • 重新开始 / 把学习接回来
• 05
  • 你最容易
  • 卡在哪里？
  • 一听就丢 / 速度一快就断掉
  • 连不起来 / 认识词，放进内容就糊
  • 很难开始 / 知道该学，却总没开始
• 06
  • 你现在更接近
  • 哪一种？
  • 刚开始 / 想轻松进入
  • 学过一点 / 但还是跟不稳
  • 基础还行 / 想更自然听懂
• 08
  • 这周你想留
  • 多少时间？
  • 每天 5 分钟 / 轻一点，先开始
  • 每天 10 分钟 / 更稳一点，也不重
  • 每天 20 分钟 / 想更集中地往前走
• 09
  • 你想从哪类
  • 内容开始？
  • 轻松听一听 / 更容易进入真实内容
  • 日常对话 / 更接近生活里会遇到的表达
  • 更有结构感 / 更适合想稳一点往前走

说明型 CTA 页

• 10
  • 你会这样开始
  • 先开始一条内容 / 先走一小步，更容易开始。
  • 卡住时再看一点 / 精听、AI 解析、查词，都会接住你。
  • 按你的节奏继续 / 先坚持一周，你会更容易听进去。
  • 生成我的计划

生成中页

• 11
  • 你的第一周，
  • 快整理好了
  • 正在匹配第一条内容
  • 正在整理这一周节奏
  • 正在准备辅助功能入口

计划交付页

• 12
  • 这是你的
  • 第一周
  • 每天 10 分钟 / 先把开始做顺，再慢慢加深。
  • 第一条内容：轻松听一听 / 一条更容易进入的真实内容，适合重新接回语感。
  • 遇到卡点时 / 精听、AI 解析、查词都会在你需要时出现。
  • 先坚持一周 / 你会更容易听进去，也更容易继续下去。
  • 正式开始

20. Stitch 应输出什么

Google Stitch 在第一轮应输出：

1. 整体视觉方向摘要
2. 5 类模板页的设计稿
3. 每类模板的组件说明
4. 模板与实际 screens 的映射关系
5. 从现有 iOS 设计语言推导出的 spacing / type / surface guidance

输出优先级：

• 先建立模板语言
• 再说明这些模板如何派生出具体 screens
• 不要试图在第一轮覆盖完整 13 屏

额外要求：

• 明确区分哪些是模板，哪些是实际 screen 的实例
• 所有页面均基于 Light Mode
• 所有页面均遵守现有 token 语言的轻量化约束
• 订阅页不在本轮范围内

21. 成功标准

如果第一轮 Stitch 结果正确，应该满足：

• 前段有进入感，但没有变成营销海报
• 中后段能清楚看出与现有产品属于同一家族
• 单选决策页看起来清楚、轻、好选，不像设置页
• 说明页不显得啰嗦
• 生成中页有“正在为你准备”的感受，而不是普通 loading
• 计划交付页更像“现在就能开始”的行动页，而不是总结页
• 后续扩展到完整 13 屏时，不需要推翻这 5 类模板

22. 相关来源文件

本文件合并并继承了以下来源：

• product/YomiyaOnboarding/README.md
• product/YomiyaOnboarding/01-方案总览.md
• product/YomiyaOnboarding/02-13屏原型规格.md
• product/YomiyaOnboarding/03-落地与验证.md
• docs/superpowers/specs/2026-04-11-yomiya-onboarding-google-stitch-design.md
• docs/superpowers/specs/2026-04-11-yomiya-onboarding-google-stitch-prompt.md
• EveryDayJapanese-iOS/EveryDayJapanese/Controller/YomiyaDemo/Theme/YomiyaDesignTokens.swift
• EveryDayJapanese-iOS/EveryDayJapanese/Extension/SwiftUI/Spacing/Spacing.swift
• EveryDayJapanese-iOS/EveryDayJapanese/Extension/SwiftUI/TextStyle.swift