Files
platforms/ui/design-qa.md

43 lines
3.0 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Design QA
final result: passed
## Comparison target
- User source: `doc/用户端APP-产品设计/4.jpg`
- Delivery source: `doc/服务端APP-配送端-产品设计/f777dcf4d618a0f9664d126b32f73682.jpg`
- Installation source: `doc/服务端APP-安装端-产品设计/202c904481a03ff644a8ac0c0d1c9ae4.jpg`
- Inspection source: `doc/服务端APP-安全检查端-产品设计/ff7edcd4f78721beb5f0953ab08c23c4.jpg`
- Implementation: local `/ui` mobile prototype at the matching `app` and `role` query states.
- Reference pixels: 1344×2772. Each reference was proportionally normalized onto a 393×852 comparison canvas.
- Implementation viewport: 393×852 CSS pixels at device scale factor 1, captured from the app-owned phone screen.
- Device-frame, status-bar, home-indicator and Android system navigation differences were excluded because they are template-owned runtime chrome.
## Pass 1
- P2 — User valve hero used a dark navy surface while the source uses a light neutral control panel with a dominant red action. Fixed by changing the panel to a light neutral surface, enlarging the valve control and moving the automatic-close status into a light inset strip.
- P1 — Pixel 10 could retain an open simulated keyboard after a device change during review. Fixed by dismissing the runtime keyboard whenever the selected device changes.
- P3 — The original user screen centers the page title in a mini-program header; the implementation uses a native-app leading title and live iOS/Android status bar. Kept as a deliberate native-shell adaptation.
## Pass 2
- User valve screen: hierarchy, status density, red control emphasis, light panel, bottom navigation and safety feedback match the source direction.
- Delivery screen: purple task shell, schedule context, user/address facts, prominent primary action and fixed four-tab navigation match the source.
- Installation screen: purple workbench, time/shift state, urgent work item, task card and role-specific action match the source.
- Inspection screen: green safety identity, task list, time/shift state and inspection action match the source.
- iPhone and Pixel 10: no content overflow, fixed navigation obstruction, open keyboard, browser console error or missing primary action remained.
- No actionable P0, P1 or P2 differences remained.
## Interaction checks
- Valve control: confirmation sheet → waiting for device receipt → confirmed open state.
- User navigation: valve, shop, favorites, orders and profile tabs are reachable.
- Service work: task list → task detail → next required step.
- Role switch: delivery, installation/repair and inspection reload the role-specific workbench.
- Evidence sheet: photo type selection and simulated capture close correctly.
## Remaining P3 notes
- Source screenshots contain mini-program chrome and older iconography; the prototype intentionally uses the protected native device runtime and a single Phosphor icon family.
- Mock content is consolidated from multiple source screens, so exact task numbers and timestamps vary while layout, hierarchy and workflow remain aligned.