AEO页面地图
原稿是一张超宽画板,里面多数是剪映、即梦的截图加手写批注。这份文档先盘点原稿画了什么、缺什么,再给出按新方案(4 个 Tab:染烫效果、自媒体、图库、我的)重排后的页面地图和核心流程。每个空白和歧义都写了 mockup 里的处理方式,以及还需要你拍板的地方。
1新版页面地图
金色框是底部 Tab 的一级页面,灰色框是从 Tab 进入的二级页面,编号和 mockup 一一对应。跨 Tab 的连线只有三条,也是开发时最容易漏的三条。
2核心流程:从选好到拿到结果
染烫效果和自媒体模板走同一条生成链路,只是第一步不同。原稿只画到“点生成”这一步,后面的判断和状态都在这张图里补上了。
3原稿盘点
按原稿画板从左到右、从上到下列出。“参考截图”指直接放了剪映或即梦的界面,还没改成美发内容。
| 原稿画板 | 画了什么 | 状态 | 新方案对应 |
|---|---|---|---|
| 即梦 UI 参考 | 即梦网页版首页:输入框、Agent 模式、技能标签 | 参考截图 | 没有对应(“章老师”未进 4 Tab,见问题 2) |
| 复刻热款(首屏) | 剪映首页,没有改动 | 参考截图 | B1 模板广场 |
| 复刻热款(图) | 模板大图 + 「换图片」+ 灰色生成按钮,写了“没换图不跳转”规则 | 有交互规则 | B2 B3 |
| 复刻热款(选择) | 相册 + 资产库有预存时弹出素材库条 | 有歧义 | B4 |
| 点击导航栏 | 5 个 Tab;预染烫页是一整块黄色色块 | 空白 | A1–A4 |
| 导航栏——模版 | 图片模板瀑布流,内容是剪映素材 | 参考截图 | B1 图片列表 |
| 对镜拍(图) | 同换图页,但有 5 个没标注的替换槽 | 有歧义 | B3 角色槽位 |
| 选取照片素材 ×2 | 同“复刻热款(选择)”,底部 5 个槽 | 有歧义 | B4 |
| 视频模版 | 视频瀑布流,内容是剪映素材 | 参考截图 | B1 视频列表 |
| 视频预览 | 抖音式详情页,作者、简介、「AI做同款 ✦800」 | 可用设计 | B5 |
| 视频生成 | 同换图页,规则一样 | 有交互规则 | B3 |
| 搜索栏 | 剪映搜索结果页(“小小课堂”) | 参考截图 | B1 有搜索框,结果页没画 |
| 资产库管理 | 只有「理发店 / 顾客 / 虚拟顾客」三个标题 | 空白 | D2 + B4 |
| 资产库参考 ×2 | 剪映「我的」页、醒图图片设计页 | 参考截图 | D1 |
| 生成之后 | 没有画 | 空白 | A3 A4 B6 C1 |
4空白与歧义清单
按对上线的影响排序。第三列只写需要你拍板的事,mockup 已经按推荐方案画了,改起来很快。
空白预染烫页只有黄色色块核心差异化功能,原来是第一个 Tab
A1–A4 四屏:选顾客照 → 按品牌色板选方案(显示色号和度数)→ 异步生成 → 前后拖动对比。沿用现有美学工坊的能力。
色板用哪几个品牌、哪些色号?建议让合作门店给出他们实际在用的染膏清单。
空白章老师(AI 助手)只有即梦截图原稿中间的大按钮
新方案 4 个 Tab 里没有它,mockup 里没画。
是放到下个版本,还是在自媒体页顶部放一个对话入口?
空白生成之后没画流程全部停在“点生成”
A3 生成中(可以离开)、A4/B6 结果页(文案、分享、再来一张)、C1 图库顶部显示生成中任务。对接 Sprint-09 的异步任务。
不需要
空白资产库三个库都没设计
D2 资产库放在「我的」里,分顾客 / 门店 / 虚拟顾客;顾客照片带授权状态,没授权的不能用在对外发布的模板里。
顾客授权走什么形式(微信卡片点同意 / 纸质)?虚拟顾客由平台统一提供,还是门店自己生成?
歧义5 个替换槽没有标注
B3 每个槽写角色(顾客正脸 / 门店背景 / 发型师)和必填/可选;必填没放时按钮灰色,点了提示缺哪张并把槽标红。
每个模板的槽位配置由谁维护?建议运营后台上架模板时配置。
歧义素材库弹条叠在相册上
B4 合成一个面板、四个 Tab:顾客 / 门店 / 虚拟顾客 / 手机相册,按槽位角色默认打开对应的 Tab。原稿里相册默认停在“视频”Tab 的问题也一起解决。
不需要
歧义图片流程不显示积分
所有生成按钮都带价格:染烫 ✦15/张,图片模板 ✦8,视频 ✦80(均为占位数)。积分不够时按钮变灰并引导充值。
视频的正式价格。原稿写的是 ✦800,和现有图片价格差 100 倍,需要按视频模型成本定。
歧义选中的 Tab 隐藏文字
按原稿规则画了:选中时图标变白、文字隐藏,下面加一个金色小点。
建议选中时也显示文字。只有 4 个 Tab 时文字不占地方,隐藏后新用户容易不知道自己在哪一页。
细节参考内容和美发无关;错别字
模板、搜索提示词、文案都换成了发型内容;“模版”改为“模板”,“搜素栏”改为“搜索栏”。
首批模板从哪来:自己用 AI 生成,还是找合作门店拍?
未画搜索结果页
B1 只画了搜索框。
不需要,下一轮补
5下一步
- 对第 4 节里的 7 个拍板点给出结论,mockup 按结论改一版。
- 补搜索结果页、积分充值页和顾客授权卡片三屏。
- 和现有代码对齐:染烫复用
workshop/,模板复用social/tongkuan和scene;生图序列从本地存储迁到后端,作为图库的数据来源。