37 lines
1.7 KiB
Markdown
37 lines
1.7 KiB
Markdown
# H5 导览首页高保真设计稿
|
||
|
||
本目录为新版 H5 导览首页高保真设计稿，仅用于产品和设计评审，不是最终视觉规范文件。
|
||
|
||
## 文件
|
||
|
||
- `01-h5-home-high-fidelity.png`：高保真首页 PNG，按 390x844 画布的 2x 精度输出。
|
||
- `01-h5-home-high-fidelity.svg`：可编辑源稿，便于继续调整布局和样式。
|
||
|
||
## 设计重点
|
||
|
||
- 纯 H5 首页：不包含手机状态栏、微信小程序胶囊、小程序标题栏或浏览器外壳。
|
||
- 首屏重点突出馆内三维地图，地图占据页面主体。
|
||
- 其他组件使用浮层和缩放形式：搜索、地图/列表切换、图例、设施入口、楼层切换、定位/缩放。
|
||
- 只保留核心功能入口：`来馆`、地点搜索、设施筛选、楼层切换、`开始导览`。
|
||
- 不加入收藏、推荐、我的、讲解推荐等扩展功能。
|
||
|
||
## 视觉依据
|
||
|
||
- 参考用户提供的首页图的信息架构和页面优先级。
|
||
- 参考 `深圳自然博物馆小程序+设计规范0519` 的主色、按钮、边距、圆角和文字关系。
|
||
- 三维地图采用高保真示意表达，强调建筑层次、点位标注、楼层控制和导览主按钮。
|
||
|
||
## 本项目落地对应
|
||
|
||
- 首页页面：`src/pages/index/index.vue`
|
||
- 导览地图外壳：`src/components/navigation/GuideMapShell.vue`
|
||
- 地图渲染：`src/components/map/SgsMapRenderer.vue`
|
||
- 后续路线规划：`src/components/navigation/RoutePlannerPanel.vue`
|
||
|
||
## 需要确认
|
||
|
||
- `开始导览` 点击后进入路线规划，还是直接进入当前位置导览态。
|
||
- 地图/列表切换是否保留在 H5 首页首屏。
|
||
- 设施入口是否仅保留服务台、电梯、扶梯、洗手间、出入口。
|
||
- 楼层数据是否固定展示，或由 SDK/后台动态返回。
|