42 lines
2.2 KiB
Markdown
42 lines
2.2 KiB
Markdown
# Design QA
|
||
|
||
## Current scope
|
||
|
||
本轮已放弃按旧截图做像素复刻，改为重新设计“小包团服务”模块的 UI 交互。旧截图仅作为历史参考，不再作为当前验收标准。
|
||
|
||
- H5 预览：`http://127.0.0.1:5173/?v=ui-20260723-service-interaction-v2`
|
||
- H5 服务模块截图：`/Users/inmanx/Documents/MiniAPP/tmp/service-interaction-v1.png`
|
||
- 服务管家抽屉截图：`/Users/inmanx/Documents/MiniAPP/tmp/service-interaction-drawer-v1.png`
|
||
- 小程序入口：`apps/miniprogram/src/pages/index/index.tsx`
|
||
|
||
## Interaction evidence
|
||
|
||
- 当前模块只保留两个入口：咨询服务管家、查看贵州目的地。
|
||
- 两张卡统一为 72px 高、18px 圆角、图标块 + 信息区 + 动作胶囊的结构；动作文案为“咨询 / 探索”。
|
||
- 桌面端悬停状态已验证：卡片向上抬升 2px、阴影增强、图标轻微放大、右侧动作胶囊横向反馈。
|
||
- 点击第一张卡已验证打开现有“服务管家”底部抽屉；抽屉新增顶部拖拽提示条，原有关闭和三种联系入口保持可用。
|
||
- 点击第二张卡已验证进入现有目的地页；出行需求入口不再出现在本模块中。
|
||
- 小程序 WebView 已将缓存版本更新为 `ui-20260723-service-interaction-v1`，Taro 生产构建成功。
|
||
- H5 生产构建成功。
|
||
|
||
## Accessibility and motion
|
||
|
||
- 卡片保留原有按钮语义，并补充完整 `aria-label`。
|
||
- 键盘聚焦有可见轮廓；按压状态使用轻微缩放与阴影收紧。
|
||
- 悬停规则仅在支持 hover 的精确指针设备启用，触屏端不会出现粘滞悬停状态。
|
||
- 已接入 `prefers-reduced-motion: reduce`，减少动效用户会关闭过渡和位移动画。
|
||
|
||
## Implementation checklist
|
||
|
||
- [x] 重新设计服务卡片的交互层级和操作反馈。
|
||
- [x] 保留咨询管家和目的地入口；从本模块移除出行需求卡片。
|
||
- [x] 验证 H5 运行时、点击路径和视觉截图。
|
||
- [x] 验证小程序 WebView 版本更新及 Taro 生产构建。
|
||
- [x] 验证 H5 生产构建。
|
||
|
||
## Runtime note
|
||
|
||
本次验证未修改业务数据或接口；只调整服务模块的展示与交互样式。开发者工具需要重新编译小程序，确保加载新的 H5 版本参数。
|
||
|
||
final result: passed
|