Skip to main content
Synced from the repo — do not edit here

Canonical source: docs/claude/app-redesign-execution-plan.md. This page is generated by docs/scripts/sync-handbook.mjs. Edit the source file in the repo; changes appear here on the next build.

App Redesign — Execution Plan to 100% Fidelity (Figma → Data → Backend)

Status doc for the build-out of the v2 redesign on wt/hybrid. Written 2026-07-10 after the pivot to extending the in-nav v2 surfaces. Companion docs: wiring recipes (verified service/stream/field handles), data contracts (net-new backend), scores (Biological Age formula).

Figma file: 2Vs1e9IZVQh8KpMxc0W3PT — all screens now on page 0:1. Every screen frame carries a DATA MAP card (data source · reads · actions · ✅ wired / ⚠ diverges / 🔶 net-new). Extracted copy of all 41 cards: see §4.


1. Process contract (non-negotiable, applies to every screen)

  1. Pull, never approximate. Per screen: get_design_context(node) → exact layout/spacing/type; get_variable_defs(node) → exact token hex; download_assets(node, svg) → real glyphs/icons. No "closest match" icons, no invented colors.
  2. Real data only. Wire exactly what the screen's DATA MAP says. 🔶 net-new elements are shown honestly absent (or omitted) until their backend exists — never mocked, never faked (sparklines, scores, activities…).
  3. Match real behavior on ⚠ divergences unless George approves the new construct. (E.g. slots are flat-by-day in the real backend; per-provider grouping is a proposal.)
  4. Verify before review. Hot-reload into the running sim session (FIFO r/R), screenshot on George's real account (axuk-khwf-prkr), confirm real values render + actions hit real backend. Only then present.
  5. Commit per screen on wt/hybrid. Both nav sites in route_home.dart (~line 108 and ~line 288) must be patched together or the second silently reverts.
  6. Dark now, light later (George 2026-07-10). fvm only. Never firebase deploy from the worktree. Keep the persistent flutter run session alive — first build is the only slow one.

Palette ground truth (verified vs Figma get_variable_defs): AppTokens.dark in basiscoreui = correct. EverlabTokens = fixed 2026-07-10 (canvas #0F0B0A, raised #1F1813, primary #C25A32, success #7E9A57, brand #E29876, borders #2A211C/#4A443B). Type: Fraunces (bundled) + Inter; headers w500.

2. Figma node ledger (page 0:1)

ScreenNodeScreenNode
Today82:837Slots82:2674
Plan82:893Confirm Booking82:2756
Health82:960Booked Detail ✅ built82:2828
Chat82:1027Camera Capture82:2877
More82:1087Video Modal82:2964
Plan · Tasks82:1146Quick Add Sheet82:3012
Plan · Learn82:1214Meal Scan82:3081
Protocol Detail82:1921Labs Upload82:3159
Activity Detail82:2032Shop82:3212
Sleep Summary82:2222Product Detail82:3304
Metric · HRV82:2452Checkout82:3349
Metric · Lab82:2542Order Status82:3418
Appointments82:2611Workouts R/C/W/S82:3487/3702/3912/4083
Notifications82:4302Account · Profile82:4374
Nutrition Diary82:4437Med Schedule82:4523
Onboarding W/G/C82:5131/5147/5213Today Empty/Loading82:5271/5322
Today · Light82:5021Today · Hatter82:5076
TabBar component82:891

3. Phased execution

P0 — Foundation (partially done)

  • Tokens: EverlabTokens → Figma hex; AppTokens verified; Fraunces bundled + wired; headers w500.
  • Tab order Today/Plan/Health/Chat/More; labels; terracotta active.
  • Icons: export the 5 TabBar glyphs from 82:891 as SVG → assets/ → wire via WidgetIcon. Kills approximation permanently. Also export any per-screen glyphs when building that screen.

P1 — The five tabs to 100%

TabCurrentTo do (per DATA MAP)
Today (82:837)RpHomeLive: greeting/avatar ✅ · Up Next ✅ · plan-today habits ✅ · synced activity ✅ · sync tiles ✅ (real, no fake sparklines) · Atlas pill ✅AI hero = 🔶 (observation engine) — keep honest placeholder or build P5. Bio Age = 🔶 — currently honest "coming soon" w/ real completeness. + FAB verbs: Book→pushScheduleSession ✅; Scan/Log wiring in P4. Empty (82:5271) + skeleton (82:5322) states.
Plan (82:893)Old RouteHabitsBuild Plan v2: Programs = protocols (clinic+user, status active, ExpertRoutine+protocolMetadata) ✅; Tasks = documentRequests (status=requested; questionnaire/webview/upload actions — NOT a protocol checklist) ✅; Learn = ⚠ source unverified → confirm _LearnTab source first. Habit completion writes → event completionStatus. Cowork card = 🔶 skip until observation engine.
Health (82:960)Old RouteProgressTodayBuild Health v2 on dayResource.insights/.labs: metric grid + range chips ✅; labs w/ benchmarks → pushTrendDetail(analyteKey) ✅; clinic allow-list preferences/clientApp.metrics ✅; by-system grouping = presentation over real labCategory (ok); Bio Age 🔶 honest.
Chat (82:1027)RouteChatV2 ✅ real; gap fixed; read-only via humanChatClientReplyEnabledComposer polish to Figma; verify read-only renders; Atlas = separate assistantOnly chat (text-only) — entry via pill; structured cards clinic-side only.
More (82:1087)RpMoreLive ✅ realAlign rows to real _ProfilePage destinations (My Data, Preferences, Data Sources, Switch provider, Log out). Profile facts ✅ (age/height guards in).

P2 — Booking flow (all backend real)

  1. Appointments (82:2611): RouteAppointments data (Active/Upcoming/Past + waitlist) in v2 skin; "Book service" → pushScheduleSession.
  2. Slots (82:2674): get_available_service_timesDECISION (see §5): flat-by-day (matches real) vs per-provider grouping (feasible client-side via slot.staff). Cross-booking blocked slots disabled ✅.
  3. Confirm (82:2756): book_appointment + get_membership_usage allowance + Stripe PaymentSheet when priced ✅. Guest = note-string hack ⚠ (keep as-is, it's the real mechanism).
  4. Booked Detail (82:2828): screen built ✅ — wire the actions: Check-in → checkin_appointment (QR modal_checkin_scanner), Reschedule → client_reschedule_appointment (ClientAppRescheduleConfig gate), Cancel → cancel_appointment (late-fee), Directions → maps URL, message icon → chat.

P3 — Shop (all backend real)

  • Shop (82:3212): products[] in clinicsv2, filter visible&&inStock&&price>0. Atlas rec = 🔶 skip.
  • Product Detail (82:3304): MarketplaceProduct carousel/variants; subscribe → stripePriceRecurring ✅. Rx badge = 🔶 skip.
  • Checkout (82:3349): create_payment_intent + PaymentSheet; orders written server-side on success ✅.
  • Order Status (82:3418): orders where userId==uid ✅; tracking timeline 🔶 skip (status only).

P4 — Details & graphs (mostly real via route_summary/pushTrendDetail)

  • Protocol Detail (82:1921): protocols doc + biomarker progress (healthSummaries). ⚠ week-bucket series = aggregation change — v1 keep the real 90-day daily series.
  • Metric graphs (82:2452/2542): pushTrendDetail per-analyte ✅; baseline callout 🔶 skip.
  • Sleep Summary (82:2222): hypnogram + device switcher ✅; HR carousel = addition (v2 skin ok, data real).
  • Workout summaries (82:3487…): HR graph + zones + route map ✅; splits/PR/volume 🔶 skip.
  • Quick Add / Meal Scan / Labs Upload: RouteMealScan ✅, AnalyzeLabs PDF pipeline ✅ (image OCR 🔶 skip) — v2 skins over real flows.

P5 — Net-new (each needs explicit go + backend build; NEVER faked meanwhile)

Biological Age composite (formula ready in scores.md) · Atlas observation hero ("one big thing") · Notifications inbox (no collection exists; FCM bg handler is a stub) · Atlas voice · Live Activity · Med refills · Rx→product linkage · Meal-diary day rollup + water · Documents page (needs Figma design first) · Loading/splash + intro screens (need Figma design first — task #35).

4. DATA MAP cards (extracted 2026-07-10)

Full extraction of all 41 cards lives at the scratchpad and is mirrored per-screen in the Figma file itself (each screen frame has its card adjacent). Key corrections they encode: Plan·Tasks = documentRequests (not protocol checklist); Account = real _ProfilePage actions; slots are flat; guest is note-encoded; no notifications collection; no sleep score; no biological age.

5. Decisions (resolved by George, 2026-07-10)

  1. Slots screen: match the real flat-by-day backend for v1. No per-provider grouping yet.
  2. P5 is deferred entirely — build P0–P4 first; P5 prioritization discussed only after the rest is done.
  3. Keep the honest Bio Age "coming soon" card (real lab-count completeness, no fake score). All other 🔶 items render as absent.

6. Definition of done (per screen)

Figma spec pulled (context+vars+assets) → built with AppTokens/EverlabTokens → every ✅ item wired to the real service/function per its DATA MAP → ⚠ resolved (match real, or approved change) → 🔶 absent/honest → actions verified against real backend on George's account via the live sim session → screenshot → commit.