uhryniuk
822003ed38
Same shape as docs/v3/: Goal/Context/Design/Implementation/Acceptance/Tests/Risks/Out-of-scope, written before implementing. UI-01: persistent 4-tab shell (StatefulShellRoute) replacing the current push/pop stack rooted at Record, with a single shared background map dimmed behind every tab and no header anywhere. UI-02: animated skeleton map for the no-cache/no-network case, since the map is now a permanent background presence rather than opt-in per screen. UI-03: shared GlassPanel/FloatingPill/PulsingLocationMarker component kit. UI-04: draggable, resizable HUD telemetry widgets with a Settings visibility toggle -- split out from the screen redesign itself since it's a genuinely separate piece of engineering (a small widget-layout system, not a reskin). UI-05: Map HUD/Record screen redesign -- the design north star every other screen ticket restyles toward. UI-06: Plan & Route Planning -- correct in principle, explicitly restyled toward UI-05 rather than copying the Stitch export's drifted styling. UI-07: Rides History -- live dimmed map background (not the mockup's static image), search/filter, real per-ride map thumbnails, and real distinct summary stats (fixing the export's 4-identical-cards generation artifact). UI-08: theme migration to Modern Professional Dark, superseding V3-16's safety-orange direction. README documents the dependency order, and two categories worth keeping separate: what was named explicitly by the person commissioning this (map-on-every-tab, no header, offline skeleton, customizable HUD) versus what the mockups themselves got inconsistent (nav icon count, duplicate summary cards, wrong active-tab highlight) and should not be copied as intentional.
83 lines
4.8 KiB
Markdown
83 lines
4.8 KiB
Markdown
# UI-05 — Map HUD: Record screen redesign
|
|
|
|
**Depends on** UI-01, UI-03, UI-04 · **Size** M · **Status** Not started
|
|
|
|
## Goal
|
|
Rebuild the Record screen as the fullscreen Map HUD from the Stitch export — this screen
|
|
is the **design north star** for the whole redesign (see `README.md`): every other
|
|
screen ticket restyles toward what this one establishes, not the other way around.
|
|
|
|
## Context
|
|
Today's Record screen is a scrolling `Column`: a 220px map card, a stats `Card` below it,
|
|
full-width Pause/Stop/Resume/Discard buttons, and a "RIPPR" wordmark header with Rides/
|
|
Settings/Routes buttons. The redesign inverts this entirely — the map is the full-bleed
|
|
canvas (via UI-01's shared background, at full opacity/interactivity on this tab only),
|
|
and everything else floats on top of it via `GlassPanel`/HUD widgets.
|
|
|
|
## Design
|
|
- **Header:** none, per UI-01.
|
|
- **Telemetry:** `DraggableResizableHudWidget`s from UI-04, not a fixed row — this screen
|
|
is where those widgets actually live during a ride. Default layout mirrors the Stitch
|
|
mockup's horizontal row (Speed/Avg Speed/Dist/Time) until the rider customizes it.
|
|
- **Pause/Stop:** two icon-only, half-width, full-bleed buttons directly above the bottom
|
|
nav bar, matching the mockup exactly — `tertiary-container` (pause) and
|
|
`error-container` (stop) per UI-08's palette. Resume/Discard: the mockup doesn't show
|
|
these explicitly on this screen; keep them reachable (e.g. Discard behind a
|
|
confirmation from the paused state, matching today's existing safeguard against a
|
|
gloved mis-tap next to Pause) rather than dropping the affordance V3-05/the original
|
|
port already earned.
|
|
- **Route rendering:** both the planned route (dashed, neutral `outline` color) and the
|
|
ridden-so-far path (colored by the existing speed gradient from `RideMap`) drawn
|
|
simultaneously, matching the mockup — this is new: today only the ridden path renders
|
|
live.
|
|
- **Location marker:** `PulsingLocationMarker` (UI-03) replaces the current plain dot.
|
|
- **Mounted mode (V3-05) interaction with this redesign:** the high-contrast mounted
|
|
theme and larger touch targets still apply, layered on top of this screen's new
|
|
layout, not replaced by it — confirm the mounted theme's colors still read correctly
|
|
against `GlassPanel`'s blur (a light theme through blurred content behaves differently
|
|
than the current dark-on-dark case V3-05 was built against).
|
|
|
|
## Implementation
|
|
1. Rebuild `RecordScreen`'s body against UI-01's full-opacity Map tab background instead
|
|
of an embedded `RideMap` card.
|
|
2. Replace the current `StatRow`-based stats card with UI-04's HUD widgets, wired to the
|
|
same `RecordUiState`/live telemetry stream already powering the old layout — no new
|
|
data plumbing, only new presentation.
|
|
3. Rebuild `_Controls`/`_PrimaryButton`/`_SecondaryButton` as the two full-bleed icon
|
|
buttons; keep the existing state-machine logic (`RecordUiState.isIdle/isRecording/
|
|
isPaused`) driving which controls show, per the current `_Controls` widget.
|
|
4. Wire both route paths (planned + ridden) into the shared background map's overlay,
|
|
sourced from `RoutePlanRepository` (if a route is being followed — V3-09 groundwork,
|
|
not required for this ticket if no route is active) and the existing live-points
|
|
stream.
|
|
5. Re-verify V3-05's mounted-mode contrast/legibility guarantees against the new
|
|
`GlassPanel`-based layout specifically, since that's a real visual change from the
|
|
opaque `Card` mounted mode was built and tested against.
|
|
|
|
## Acceptance criteria
|
|
- [ ] Map fills the screen behind the HUD widgets and controls, full opacity, on this
|
|
tab
|
|
- [ ] Existing record/pause/resume/stop/discard state machine behavior is unchanged —
|
|
this is a visual rebuild, not a behavior change
|
|
- [ ] HUD telemetry widgets are the UI-04 draggable/resizable kind, not a fixed layout
|
|
- [ ] Mounted mode (V3-05) still passes its existing contrast tests against the new
|
|
layout
|
|
- [ ] The black-on-black text-color regression guard (from V3-16/the original port bug)
|
|
still passes against `GlassPanel`'s blur background
|
|
|
|
## Tests
|
|
- All existing `record screen` widget tests updated to the new layout and still passing
|
|
(state-machine behavior, mounted-mode toggle, wake lock, live-map visibility)
|
|
- Widget: HUD widgets render over the map, not replacing it
|
|
- Widget: Pause/Stop buttons trigger the same engine calls as today
|
|
|
|
## Risks
|
|
- The biggest visual departure of the whole redesign happens here first — expect this
|
|
ticket to surface layout issues (`GlassPanel` blur cost stacked with a live animating
|
|
map, HUD widgets overlapping controls on small screens) that UI-06/07 then inherit or
|
|
avoid having created themselves.
|
|
|
|
## Out of scope
|
|
Following a planned route turn-by-turn (V3-09). Anything about Plan/Route Planning/Rides
|
|
History screens — those are UI-06/UI-07, restyled toward what this ticket establishes.
|