47 lines
3.9 KiB
Markdown
47 lines
3.9 KiB
Markdown
# 0519 规范版导览功能设计稿
|
||
|
||
## 说明
|
||
|
||
本目录为新版“导览 / 馆内导览”功能逻辑设计稿的 0519 视觉规范重生成版本。生成依据包括：
|
||
|
||
- 对标逻辑分析：`docs/Benchmark/guide-video-ux-logic-analysis.md`
|
||
- UI 规范目录：`E:\MyWork\深圳国际艺术馆\museum-guide\docs\UI设计\深圳自然博物馆小程序+设计规范0519`
|
||
- 规范图片：`色彩.png`、`布局.png`、`按钮.png`、`文字.png`、`圆角.png`、`图标.png`、`示例.png`
|
||
|
||
这些图片只表达功能逻辑、UX 状态和页面结构，不是最终视觉规范或可直接切图的交付稿。正式落地仍需产品、设计和路线数据 readiness 共同确认。
|
||
|
||
## 0519 规范应用要点
|
||
|
||
- 色彩：系统主色 / 按钮文字 `#E0DF00`，主按钮 `#000000`，选中文字高亮 `#BEBD02`，链接 `#1B6EC0`，标签 `#2C854F`，错误 `#E73333`，背景 `#F9FAFB`。
|
||
- 文本：主标题 `#000000`，正文 `#3F3F3F`，占位 / 默认提示 `#ADB0B4`，分割线 `#D9D9D9`。
|
||
- 布局：页面边距约 15-16px，基础间距 10px，保持 6 列网格感。
|
||
- 圆角：标签 / 选项 4px，按钮 / 输入框 / 搜索框 8px，卡片 / 弹框 16px。
|
||
- 字体：中文以微软雅黑、思源黑体、苹方风格为准；层级参考 20pt、18pt、16pt、14pt、12pt。
|
||
- 图标：线性小程序图标风格，未选中灰色，选中使用系统主色。
|
||
|
||
## 图片清单
|
||
|
||
| 文件 | 业务状态 | 功能闭环 | 对应落地参考 |
|
||
| --- | --- | --- | --- |
|
||
| `01-guide-home-0519.png` | 导览首页初始态 | 地图作为导览工作台，搜索、楼层、快捷入口同屏可达 | `src/pages/index/index.vue`、`GuideMapShell.vue` |
|
||
| `02-search-poi-0519.png` | 搜索地点 / 筛选态 | 搜索结果可查看位置、设起点、去这里，不脱离地图上下文 | `src/pages/search/index.vue`、未来地图内 overlay |
|
||
| `03-poi-selected-0519.png` | POI 选中态 | POI 卡片承接查看位置、从这里出发、去这里、相关讲解 | `index.vue` 的 `selectedGuidePoi` 相关逻辑 |
|
||
| `04-route-planning-0519.png` | 路线规划态 | 起终点完整性、偏好选项、路线 readiness 和降级文案 | `RoutePlannerPanel.vue`、`guideRouteUseCase.ts` |
|
||
| `05-indoor-navigation-active-0519.png` | 馆内导览进行中 | 当前路线、下一步、当前楼层、进度、暂停 / 退出 / 重新定位 | 未来导航运行态；当前需受路线 readiness 约束 |
|
||
| `06-cross-floor-navigation-0519.png` | 跨楼层导览态 | 当前层路线、换层节点、下一层路线关系 | 未来 `route_graph`、`nav_data`、楼层连接器 |
|
||
| `07-arrival-complete-0519.png` | 到达目标 / 结束导览 | 到达确认、查看详情、相关讲解、重新规划、返回首页 | 未来导航完成态和讲解联动 |
|
||
| `08-error-fallback-0519.png` | 异常 / 降级态 | SDK / 定位 / 路线不可用时返回位置预览或手动选择 | `guideReadiness.ts`、`route/detail.vue` 降级逻辑 |
|
||
|
||
## 需要确认的问题
|
||
|
||
1. 0519 规范中的底部导航栏目是“首页 / 展览 / 券码 / 商城 / 我的”，本导览业务是否需要保留项目当前“导览 / 讲解”顶部入口，还是纳入底部主导航。
|
||
2. `#E0DF00` 作为导览路线高亮是否足够清晰，还是路线应优先使用标签绿 `#2C854F`，主色仅用于按钮和选中态。
|
||
3. 路线未就绪阶段，主按钮是否统一为“查看位置关系”，避免出现“开始导览”误导。
|
||
4. “模拟导览”是否面向用户开放，还是只作为内部演示 / 测试状态。
|
||
5. 跨楼层偏好是否需要在第一期只保留“电梯优先”，待 route graph 验证后再开放楼梯 / 扶梯。
|
||
6. 到达页是否优先承接“相关讲解”，以形成导览到讲解的跨业务闭环。
|
||
|
||
## 生成方式
|
||
|
||
按 `C:\Users\Administrator\.codex\skills\.system\imagegen\SKILL.md` 使用内置 `image_gen` 工具逐张生成，再复制到当前目录。原始生成图保留在 Codex 默认生成目录中，未删除。
|