docs(design): add final validation evidence

2026-08-02 03:27:49 +02:00
parent b3946af4e0
commit a737860f2c
22 changed files with 185 additions and 1 deletions
@@ -0,0 +1,60 @@
+# Premium UI implementation validation
+
+Date: 2026-08-02
+Branch: `design/mobilityops-premium-ui`
+
+## Implemented scope
+
+- New responsive Control Rail shell, icon system, product mark, top bar, desktop rail,
+  off-canvas navigation and labelled mobile bottom navigation.
+- Redesigned login, dashboard, fleet, vehicle, bookings, booking return, data quality,
+  duplicate review, knowledge, integrations and audit surfaces.
+- Return capture now has an explicit review step; no return API request is sent before
+  confirmation. The existing idempotency key and local-commit/outbox behavior remain.
+- Booking rows are limited to 25 per client-side page; mobile tables keep explicit field
+  labels through `data-label` semantics.
+- Loading, empty and error surfaces, focus treatment, reduced-motion handling and honest
+  integration states are shared system behaviors.
+
+## Visual evidence
+
+Desktop:
+
+![Implemented desktop login](../../artifacts/design-validation/implementation/desktop/login-1440.png)
+
+![Implemented desktop dashboard](../../artifacts/design-validation/implementation/desktop/dashboard-1440.png)
+
+![Implemented return capture](../../artifacts/design-validation/implementation/desktop/booking-return-1440.png)
+
+![Implemented return review](../../artifacts/design-validation/implementation/desktop/booking-return-review-1440.png)
+
+Mobile:
+
+![Implemented mobile login](../../artifacts/design-validation/implementation/mobile/login-390.png)
+
+![Implemented mobile dashboard](../../artifacts/design-validation/implementation/mobile/dashboard-390.png)
+
+![Implemented mobile duplicate review](../../artifacts/design-validation/implementation/mobile/duplicate-review-390.png)
+
+The complete capture set is in `artifacts/design-validation/implementation/`.
+
+## Responsive evidence
+
+Browser evaluation measured the document element after authenticated page render:
+
+| Width | Client width | Scroll width | Result |
+|---:|---:|---:|---|
+| 390 | 375 (vertical scrollbar present) | 375 | no horizontal overflow |
+| 768 | 753 (vertical scrollbar present) | 753 | no horizontal overflow |
+| 1280 | 1265 (vertical scrollbar present) | 1265 | no horizontal overflow |
+| 1440 | 1425 (vertical scrollbar present) | 1425 | no horizontal overflow |
+
+The same widths are automated in `frontend/e2e/ui-redesign.spec.ts`.
+
+## Performance choices
+
+- No image runtime dependency and no animation library were added.
+- Branding, navigation and workflow illustrations are inline SVG/CSS.
+- Inter is used only when locally available; there is no blocking font request.
+- The production build remains a single small PoC bundle (approximately 239 kB JS and
+  37 kB CSS uncompressed at implementation time).