Files
lingniu-vehicle-ingest/design-qa.md
2026-07-20 02:56:13 +08:00

83 lines
6.4 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.
# Vehicle Data Platform Semi UI System QA
## Evidence
- Accepted source truth: the production application immediately before shared identity convergence.
- Desktop source contact sheet: `.codex-audit/semi-system-20260720/desktop-all-routes-before-normalized.png`.
- Desktop implementation contact sheet: `.codex-audit/semi-system-20260720/desktop-all-routes-after-contact.png`.
- Desktop same-state comparison: `.codex-audit/semi-system-20260720/desktop-before-after-comparison.png`.
- Mobile source contact sheet: `.codex-audit/semi-system-20260720/mobile-all-routes-before-normalized.png`.
- Mobile implementation contact sheet: `.codex-audit/semi-system-20260720/mobile-all-routes-after-contact.png`.
- Mobile same-state comparison: `.codex-audit/semi-system-20260720/mobile-before-after-comparison.png`.
- Desktop viewport and state: 1280 × 720, authenticated administrator, default route state.
- Mobile viewport and state: 390 × 844, authenticated administrator, default route state.
- Audited routes: `/monitor`, `/vehicles`, `/tracks`, `/history`, `/statistics`, `/alerts`, `/access`, `/users`, `/operations`.
- Production release: `semi-system-audit-20260720025208`.
## Full-view comparison
All nine primary routes retain the accepted product grammar: persistent desktop navigation, mobile bottom navigation, cool-gray canvas, white operational surfaces, compact filters, restrained semantic color and data-first content density. Maps remain dominant on monitoring and replay; tables or queues remain dominant on the remaining workspaces.
The implementation changes the source of the identity styling rather than the visible hierarchy. Primary, warning, authority and health identity tones are now owned by `WorkspaceCommandBar` and shared CSS custom properties. Page-specific rules retain only genuine layout differences such as the compact replay rail, the larger vehicle record identity, the hidden mobile alert copy and the short-landscape operations header.
Live vehicle, mileage, alert and access values changed between the before and after captures because both sets use production data. Component placement, spacing, responsive behavior and visual hierarchy remain continuous.
## Focused comparison
Desktop and mobile comparisons were viewed as combined before/after images at matching route viewports. The warning tone remains amber in Alert Center, the authority tone remains purple in Account Management, the health tone remains green in Operations Quality, and the remaining identity workspaces retain the primary blue treatment.
At 390 × 844, command bars preserve the existing single-screen density. Descriptions and metadata continue to collapse only where the prior mobile behavior already required it. All nine routes report `scrollWidth === clientWidth`; no page-level horizontal overflow was introduced.
## Fidelity ledger
| Surface | Source evidence | Render evidence | Result |
| --- | --- | --- | --- |
| Navigation and workspace frame | Consistent desktop rail and mobile bottom navigation | All nine routes retain the same navigation, canvas and viewport ownership | Passed |
| Identity hierarchy | Icon, eyebrow, task title, supporting context and actions | Shared `WorkspaceCommandBar` anatomy is unchanged across desktop and mobile | Passed |
| Semantic colors | Blue operational work, amber warnings, purple authority, green health | Four explicit tones resolve to the accepted icon, glow and status-tag colors | Passed |
| Typography | Compact operational hierarchy with restrained supporting copy | Existing Semi title, text and tag scale is preserved at both viewports | Passed |
| Spacing and density | Maps, tables and queues dominate their workspaces | Header convergence does not reduce visible rows, cards or map area | Passed |
| Responsive behavior | Mobile descriptions and actions collapse selectively | Existing per-workspace breakpoints remain; all routes have zero page overflow | Passed |
| Component architecture | Repeated identity styling existed in page-specific CSS | Semantic variables now centralize palette and shared anatomy without page coupling | Passed |
| Runtime behavior | Production routes must load without unstable placeholders | No skeletons, spin overlays, loading copy or browser errors remained at capture | Passed |
## Above-the-fold copy diff
- No user-facing product copy changed.
- No route, field, status label, action or business claim changed.
- The only DOM contract change is the semantic identity class: `is-primary`, `is-warning`, `is-authority` or `is-health`.
## Comparison history
1. P2 — Identity colors, icon surfaces and status tags were repeated in vehicle, replay, history, alert, access, account and operations CSS blocks.
- Fix: introduced a typed `tone` property on `WorkspaceCommandBar` and centralized semantic CSS custom properties.
- Post-fix evidence: both combined contact sheets preserve the accepted appearance while production computed-style checks confirm all four tones.
2. P2 — The repeated page rules allowed title, description, icon and mobile breakpoint values to drift independently.
- Fix: moved shared color and component anatomy to the base identity rules; retained only layout-specific page overrides.
- Post-fix evidence: desktop and mobile route contact sheets show continuous hierarchy and density.
3. P2 — A shared refactor could have caused mobile overflow or reduced one-screen data density.
- Fix: audited every primary route at 390 × 844 and recorded document dimensions after stable render.
- Post-fix evidence: all nine routes have `scrollWidth = 390`, `clientWidth = 390`, no loading overlays and no layout clipping.
## Findings
- No actionable P0, P1 or P2 visual differences remain in this batch.
- Production browser warnings and errors after route traversal: 0.
- Build output retains the upstream Semi Sass `@import` deprecation warning; it does not affect this release.
## Core interaction and release verification
- Nine desktop routes rendered at 1280 × 720 without horizontal overflow.
- Nine mobile routes rendered at 390 × 844 without horizontal overflow.
- Primary, warning, authority and health classes and computed colors were verified in production.
- Full web suite: 73 files, 369 tests passed.
- Production build gate: passed.
- Web release smoke suite: passed.
- ECS HTTP check: 200 OK.
- ECS active release: `/opt/lingniu-vehicle-platform/releases/semi-system-audit-20260720025208`.
- Served assets: `app-fqr7mrEB.js`, `app-BHAi6qMP.css`.
## Final result
final result: passed