全站原型对照 · 37 屏 HTML
产品不是「五个能力并列首页」,而是:先帮用户做完一份能投递的简历(主路径),导出 PDF 后再逐步开放模拟面试、投递追踪、课程等能力。 底部始终只有 四个 Tab:首页 · 简历 · 助手 · 我的。
自上而下:外部渠道把人带进来 → 微信登录 → 在四个 Tab 里生活 → 绝大多数新用户先走「优化简历」五步漏斗 → 导出后能力变多。
flowchart TB
subgraph GROW["增长 / 渠道(未登录也可看)"]
G2["渠道落地页
秋招/高校/Boss"]
G4["短视频落地"]
LAND["默认落地 · 微信登录"]
end
subgraph SHELL["登录后 · 四 Tab 壳层(始终可见)"]
HOME["首页 Tab"]
RES["简历 Tab"]
ASST["助手 Tab"]
ME["我的 Tab"]
end
subgraph MAIN["主路径 · 无底部 Tab(沉浸)"]
F2["简历摸底"]
F4["分段初稿"]
JD["粘贴 JD"]
F1["JD 对齐"]
E2["HR 预览"]
EXP["PDF 导出"]
end
subgraph AFTER["导出 PDF 之后"]
F7["模拟面试"]
F6["投递追踪"]
G1["诊断报告卡"]
MORE["规划 / 课程 / 成长…"]
end
G2 --> LAND
G4 --> LAND
LAND --> HOME
HOME -->|"开始优化简历"| F2
F2 --> F4 --> JD --> F1 --> E2 --> EXP
EXP --> F7
EXP --> F6
EXP --> G1
EXP --> MORE
HOME --- RES
HOME --- ASST
HOME --- ME
投放链接、短视频、应用商店等先进渠道页,看到活动价值与宣传图,再点「微信登录」;老用户也可从落地页直达首页。
flowchart LR
AD["广告 / 高校 / Boss 链接"] --> G2["18 渠道落地"]
DY["抖音等短视频"] --> G4["31 短视频落地"]
STORE["搜索小程序"] --> LAND["01 默认落地"]
G2 --> LAND
G4 --> LAND
LAND -->|"微信一键登录"| HOME["02 产品首页"]
G2 -->|"已登录"| HOME
用户不会看到五个「面试 / 情绪 / 课程」并列首页。底部 Tab 固定四个角色;具体能力从首页宫格、助手宫格或「我的」菜单进入。
flowchart TB
subgraph TABS["底部 Tab 栏"]
H["首页
推进度 · 主按钮"]
R["简历
列表 · 新建"]
A["助手
能力宫格"]
M["我的
账户 · 设置"]
end
H --> H1["大按钮:开始/继续优化简历"]
H --> H2["工具箱:我的简历、投递、面试…"]
R --> R1["简历列表 · + 新建"]
R --> R2["点某份 → 编辑初稿 / 在线预览"]
A --> A1["模拟面试 · 投递 · 诊断卡"]
A --> A2["职业规划 · 技能课程 · 成长日记"]
A --> A3["能力中心:全部入口一览"]
M --> M1["能量点 · 充值"]
M --> M2["订单 · 邀请有礼 · 留言板"]
M --> M3["设置 · 协议 · 退款"]
从首页点「开始优化简历」进入无 Tab 的全屏步骤。步骤条始终可见:摸底 → 初稿 → 对齐 → 预览 → 导出。 摸底可跳过;HR 预览也可跳过直接导出——但中间「写初稿 → 贴 JD → 对齐」是价值核心。
flowchart TD START(["首页 · 开始优化简历"]) --> F2["03 简历摸底
上传/粘贴 · AI 待改清单"] F2 -->|"可跳过"| F4 F2 -->|"去改简历"| F4["04 分段初稿
分模块填写/AI 生成"] F4 --> JD["05 粘贴 JD
岗位描述"] JD --> F1["06 JD 对齐
原文 vs 建议"] F1 --> E2["07 HR 第一视角预览
6 秒扫读模拟"] E2 -->|"稍后预览,直接导出"| EXP E2 -->|"下一步"| EXP["08 PDF 导出
下载/保存"] E2 -.-> PV["33 在线完整预览"] EXP -.-> PV EXP --> DONE(["主路径完成 · 解锁更多能力"])
避免一进来功能太多吓跑用户。完成关键步骤后,首页工具箱与助手宫格会从「锁」变为可点。
flowchart LR
subgraph U1["新用户"]
LOCK["投递/面试/诊断卡:锁定"]
end
subgraph U2["写完初稿"]
F1E2["JD 对齐 · HR 预览 可用"]
end
subgraph U3["导出 PDF"]
OPEN["模拟面试 · 诊断卡 · 投递追踪"]
EXT["职业规划 · 技能课程 · 成长日记等"]
end
subgraph U4["投递里标记受挫"]
E5D["挫败急救包 · 情绪倾听"]
end
U1 --> U2
U2 --> U3
U3 --> U4
| 用户做到哪一步 | 新开放的能力(举例) |
|---|---|
| 完成分段初稿 | 粘贴 JD、JD 对齐、HR 预览 |
| 完成 PDF 导出 | 模拟面试、诊断报告卡、投递追踪、规划/课程入口 |
| 投递记录标记「受挫」 | 挫败急救包(带该条投递上下文)、情绪倾听 |
| 全站没有上架课程 | 技能课程入口隐藏(有课才显示) |
汇总页原型:能力中心
助手是「职业能力超市」。未导出前底部有主按钮拉回简历主路径;导出后宫格全部点亮。
flowchart TB ASST["23 助手 Tab"] ASST --> GRP1["简历相关"] GRP1 --> F7["17 文字模拟面试
对话练问答"] GRP1 --> F6["13 投递追踪
公司/状态/受挫"] GRP1 --> G1["12 诊断报告卡
分享前须打码邮箱"] ASST --> GRP2["成长扩展"] GRP2 --> PLAN["19 职业规划"] GRP2 --> COURSE["20 技能课程列表"] GRP2 --> DIARY["22 成长日记"] GRP2 --> F8["28 语音演练"] GRP2 --> EMO["29 情绪倾听"] F6 -->|"标记受挫"| E5["30 挫败急救包"] EMO --> EMO2["36 表情采集
可选"] ASST --> HUB["14 能力中心 · 完整列表"]
flowchart LR ME["10 我的"] ME --> PAY["09 充值/套餐"] ME --> RES["15 我的简历"] ME --> ORD["26 我的订单"] ME --> INV["27 邀请有礼"] INV --> POST["27 邀请海报
选款 · 保存分享"] ME --> FB["16 留言板
图文留言 · 看官方回复"] ME --> SET["11 设置"] SET --> LEG["39 法务文档
协议/隐私/AI说明"] SET --> REF["34 退款申请
选订单 · 等审批"] SET --> NET["37 网络与系统状态
弱网/维护提示"]
留言/退款提交后由运营在后台处理;系统状态文案由后台配置同步到本页。对照见 §10 C↔B · B-Admin 流程图。
视频在 App 内播放(非甩外链浏览器)。运营在后台上传课程;用户从助手/首页/规划报告等入口进入列表。
flowchart LR IN["入口:助手/首页/规划/能力中心"] --> L["20 课程列表
按简历缺口推荐"] L -->|"无匹配"| EMPTY["空态:去优化简历"] L -->|"点某一门"| D["21 课程详情
目录 · 开始学习"] D --> P["38 课时播放
App 内播放器"]
flowchart LR ME["我的 / 首页横幅"] --> G6["27 邀请有礼
规则 · 邀请码 · 复制链接"] G6 --> POST["27 邀请海报页
选款式 · 大图+二维码"] POST --> SAVE["保存到相册 / 分享好友"] SAVE --> FRIEND["好友打开 → 渠道/落地 → 登录"]
下表供评审对照;点击可在新标签打开 HTML 原型(Finder 双击亦可)。
| 分区 | 页面 | 用户理解 | 原型 |
|---|---|---|---|
| 增长 | 默认落地 | 微信登录、协议 | 01 |
| 渠道落地 | 秋招/高校/Boss 活动页 | 18 | |
| 短视频落地 | 抖音等占位 | 31 | |
| 四 Tab | 产品首页 | 主按钮、进度、工具箱 | 02 ★ |
| 我的简历 | 列表、新建、预览 | 15 | |
| 助手 | 能力宫格 | 23 ★ | |
| 我的 | 能量、订单、设置入口 | 10 ★ | |
| 主路径 | 简历摸底 | 上传/粘贴、待改清单 | 03 |
| 分段初稿 | 分模块编辑 | 04 | |
| 粘贴 JD | 岗位描述 | 05 | |
| JD 对齐 | 缺口与改写建议 | 06 | |
| HR 预览 | 6 秒扫读模拟 | 07 | |
| PDF 导出 | 下载、后续入口 | 08 | |
| 在线预览 | 完整简历只读 | 33 | |
| 充值 | 能量点套餐 | 09 | |
| 导出后 | 诊断报告卡 | 分享、邮箱打码 | 12 |
| 投递追踪 | 投递记录、受挫 | 13 | |
| 模拟面试 | 文字对话练习 | 17 | |
| 扩展能力 | 能力中心 | 全部入口 | 14 |
| 职业规划 | AI 规划报告 | 19 | |
| 技能课程 | 列表→详情→播放 | 20–21–38 | |
| 成长日记 | 记录与周摘要 | 22 | |
| 语音演练 / 情绪 | 按住说话、倾听 | 28 · 29 | |
| 挫败急救包 | 受挫后 debrief | 30 | |
| 我的·系统 | 设置 / 法务 | 协议、注销、退款入口 | 11 · 39 |
| 留言板 | 投诉建议 · 后台回复后本页可见 | 16 ↔ B 01 | |
| 订单 / 邀请 | 支付记录、海报 | 26 · 27 | |
| 退款 | 申请与审批进度 | 34 ↔ B 02 | |
| 系统状态 | 弱网/维护 · 后台可配文案 | 37 ← B 16 |
阅读顺序:① 先读「0 总览 + 3 主路径」② 看 首页 三个状态 Tab(新用户 / 进行中 / 已导出)③ 在 index 机模里点一遍「开始优化简历」。
更细产品说明见 docs/03.prd/AI简历优化-prd.md §2.4、§4.1。
用户在小程序里的留言、退款、系统提示、渠道页、课程等,多数要在运营后台处理或配置。 下图为双向对照(非用户界面路径)。运营侧完整场景见 B-Admin 使用流程图(含待办、Playbook、公众号内部告警)。
flowchart LR
subgraph C["C 端 · 用户可见"]
FB["16 留言板"]
RF["34 退款"]
ST["37 系统状态"]
CH["18 渠道落地"]
CR["20 课程列表"]
end
subgraph B["B 端 · 运营后台"]
BFB["01 留言处理"]
BRF["02 退款审批"]
BST["16 系统状态配置"]
BCH["11 渠道 CMS"]
BCR["10 课程 CMS"]
end
FB -->|"POST 留言"| BFB
BFB -->|"PATCH 官方回复"| FB
RF -->|"POST 申请"| BRF
BRF -->|"审批通过/拒绝"| RF
BST -->|"GET 维护文案"| ST
BCH -->|"hero_image_url"| CH
BCR -->|"上架/章节"| CR
| C 端页面 | 用户做什么 | 后台谁处理 / 配置 |
|---|---|---|
| 16 留言板 | 文字/截图留言 · 查看官方回复 | 留言列表 · 未回复 Tab · 详情回复 |
| 34 退款 | 选订单 · 填原因 · 看 pending/通过/拒绝 | 退款审批 · 待审批 Tab |
| 37 系统状态 | 弱网/维护/正常三态提示 | 系统状态 · 文案与全局模式 |
| 18 渠道 | 活动 Hero · 登录入口 | 渠道落地 · 上传宣传图 |
| 20 课程 | 列表 → 详情 → 播放 | 课程 CMS · 章节管理 |