全站原型对照 · 37 屏 HTML

AI 简历优化 · 小程序怎么用?

产品不是「五个能力并列首页」,而是:先帮用户做完一份能投递的简历(主路径),导出 PDF 后再逐步开放模拟面试、投递追踪、课程等能力。 底部始终只有 四个 Tab:首页 · 简历 · 助手 · 我的。

■ 主路径(首期核心) ■ 四 Tab 壳层 ■ 增长 / 渠道 ■ 导出后或后续扩展

0一张图看懂产品结构

自上而下:外部渠道把人带进来 → 微信登录 → 在四个 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

1用户从哪进来?

投放链接、短视频、应用商店等先进渠道页,看到活动价值与宣传图,再点「微信登录」;老用户也可从落地页直达首页。

flowchart LR
  AD["广告 / 高校 / Boss 链接"] --> G2["18 渠道落地"]
  DY["抖音等短视频"] --> G4["31 短视频落地"]
  STORE["搜索小程序"] --> LAND["01 默认落地"]
  G2 --> LAND
  G4 --> LAND
  LAND -->|"微信一键登录"| HOME["02 产品首页"]
  G2 -->|"已登录"| HOME
        

原型页:渠道落地 · 短视频 · 登录落地

2登录后:四个 Tab 各管什么?

用户不会看到五个「面试 / 情绪 / 课程」并列首页。底部 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["设置 · 协议 · 退款"]

原型:首页 · 简历 · 助手 · 我的

3核心体验:优化简历主路径(约 15 分钟)

从首页点「开始优化简历」进入无 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(["主路径完成 · 解锁更多能力"])

4能力什么时候开放?(节点解锁)

避免一进来功能太多吓跑用户。完成关键步骤后,首页工具箱与助手宫格会从「锁」变为可点。

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 导出模拟面试、诊断报告卡、投递追踪、规划/课程入口
投递记录标记「受挫」挫败急救包(带该条投递上下文)、情绪倾听
全站没有上架课程技能课程入口隐藏(有课才显示)

汇总页原型:能力中心

5助手 Tab:导出前后两套宫格

助手是「职业能力超市」。未导出前底部有主按钮拉回简历主路径;导出后宫格全部点亮。

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 能力中心 · 完整列表"]

6我的 Tab:账户、订单与合规

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 流程图

7技能课程:列表 → 详情 → 播放(三跳)

视频在 App 内播放(非甩外链浏览器)。运营在后台上传课程;用户从助手/首页/规划报告等入口进入列表。

flowchart LR
  IN["入口:助手/首页/规划/能力中心"] --> L["20 课程列表
按简历缺口推荐"] L -->|"无匹配"| EMPTY["空态:去优化简历"] L -->|"点某一门"| D["21 课程详情
目录 · 开始学习"] D --> P["38 课时播放
App 内播放器"]

原型三跳:列表详情播放

8增长:邀请有礼

flowchart LR
  ME["我的 / 首页横幅"] --> G6["27 邀请有礼
规则 · 邀请码 · 复制链接"] G6 --> POST["27 邀请海报页
选款式 · 大图+二维码"] POST --> SAVE["保存到相册 / 分享好友"] SAVE --> FRIEND["好友打开 → 渠道/落地 → 登录"]

9全站页面速查(37 屏 · 与原型文件名一致)

下表供评审对照;点击可在新标签打开 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
挫败急救包受挫后 debrief30
我的·系统设置 / 法务协议、注销、退款入口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。

10C 端与运营后台(产品对照)

用户在小程序里的留言、退款、系统提示、渠道页、课程等,多数要在运营后台处理或配置。 下图为双向对照(非用户界面路径)。运营侧完整场景见 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 · 章节管理