Files

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.vueGuideMapShell.vue
02-search-poi-0519.png 搜索地点 / 筛选态 搜索结果可查看位置、设起点、去这里,不脱离地图上下文 src/pages/search/index.vue、未来地图内 overlay
03-poi-selected-0519.png POI 选中态 POI 卡片承接查看位置、从这里出发、去这里、相关讲解 index.vueselectedGuidePoi 相关逻辑
04-route-planning-0519.png 路线规划态 起终点完整性、偏好选项、路线 readiness 和降级文案 RoutePlannerPanel.vueguideRouteUseCase.ts
05-indoor-navigation-active-0519.png 馆内导览进行中 当前路线、下一步、当前楼层、进度、暂停 / 退出 / 重新定位 未来导航运行态;当前需受路线 readiness 约束
06-cross-floor-navigation-0519.png 跨楼层导览态 当前层路线、换层节点、下一层路线关系 未来 route_graphnav_data、楼层连接器
07-arrival-complete-0519.png 到达目标 / 结束导览 到达确认、查看详情、相关讲解、重新规划、返回首页 未来导航完成态和讲解联动
08-error-fallback-0519.png 异常 / 降级态 SDK / 定位 / 路线不可用时返回位置预览或手动选择 guideReadiness.tsroute/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 默认生成目录中,未删除。