Architecture
Information Architecture
Peri is a three-tab interpretation surface over a single daily record, with all data entry funneled through one floating action, and everything administrative pushed to an edge drawer.
The inversion that defines the product
Most trackers make logging the home screen and bury insight. Peri inverts this — Today is a read-only dashboard; logging is a modal act you perform and leave. The user's job is to understand her capability, not to feed a database.
Architecture diagram
The tree
PERI
├── ENTRY Splash → Onboarding (3 steps, skippable) | Demo mode
├── CHROME Top bar · WeekStrip → Month calendar · Tab bar + [+]
├── TODAY DailyFocus → drawer · Fueling · RecentTrends · WhatNext
├── INSIGHTS Trends · Playbook · Training · Sleep · Cycle · Symptoms · Stats row
├── TREATMENTS Category filter · Active/Past protocols · PDF export
├── [+] LOG Symptoms · Workout · Period · Sleep · How You Feel · Treatment
└── PROFILE Edit profile · Log History → PastEntryModal · Wearable sync
Privacy · Legal · Sign outNavigation model
| Mechanism | Type | Carries |
|---|---|---|
| Tab bar | lateral, flat (3 peers) | the three reading modes: now / over time / interventions |
| Floating + | modal overlay — not a tab | the single writing mode |
| WeekStrip / Calendar | temporal | changes navDate — recomputes the whole Today tab |
| Card face → drawer | vertical disclosure | detail + explainability for one card |
| Assumption action | cross-layer shortcut | drawer → closes → log screen (320ms) |
| Avatar → Profile drawer | edge drawer | account, history, settings, sync |
| Protocol card → log screen | edit-in-place | treatments reuse the log screen as editor |
Three properties worth naming: a single write funnel (one mental model for “where do I put things”, one merge-safe save pattern in code); time as a dimension, not a place (history isn't a tab — the strip re-aims the same dashboard); and drawers as the only disclosure unit (no back-stack exists anywhere — you are always one dismiss from the dashboard).
Progressive disclosure layers
| Layer | Surface | Question answered |
|---|---|---|
| L0 | Tab face | Which mode am I in? |
| L1 | Card face | What should I know at a glance? |
| L2 | Drawer / accordion | Tell me more |
| L3 | Explainability block | Why — and what did you assume? |
| L4 | Action handoff | Fix the assumption |
Task frequency → prominence
| Frequency | Tasks | Cost |
|---|---|---|
| Daily (seconds) | check capability & recommendation · glance fueling | 0 taps — the default tab |
| Daily (write) | log feel / sleep / workout / symptoms / period | 2 taps + input via [+] |
| Weekly (minutes) | review trends & playbooks · read reasoning · check another day · sync wearable | 1 tap (tab) – 2 taps (drawer) |
| Monthly or rarer | treatments & PDF export · deep history · profile/legal | tab or drawer depth |
The one deliberate exception
Treatments holds a top-level tab despite low frequency — HRT protocols are identity-critical context for the perimenopausal athlete and anchor the “Since [Treatment]” trend comparisons. Its presence signals the product takes protocols seriously; History and Settings earn no such slot.
Why it's organized this way
- 01The dashboard is the product — engines are the value, raw data is means. A log-first IA would present Peri as a diary with charts: the generic wellness pattern this product rejects.
- 02Three tabs = three time horizons: now · weeks–months · interventions spanning months. No fourth horizon exists, so no fourth tab.
- 03Write once, own fields — each log screen owns disjoint Entry fields and merges into one dated record. Six doors, one room.
- 04Explainability lives inside the thing it explains — not in a separate AI or help section.
- 05Demo mode is an IA overlay, not a fork — same screens, real engines on the Sara Jackson dataset, write path disabled.
- 06Administrative gravity pulls to the edge — the center of the screen is reserved for capability intelligence at all times.
Canonical screen inventory
| # | Screen | Trigger | Layer |
|---|---|---|---|
| 1 | Splash | unauthenticated launch | entry |
| 2 | Onboarding 1–3 | first sign-in | entry |
| 3 | Today dashboard | tab log (default) | L0 |
| 4 | Insights | tab patterns | L0 |
| 5 | Treatments | tab treatment | L0 |
| 6 | Month calendar panel | WeekStrip toggle | overlay |
| 7 | Log Activity drawer | + | overlay |
| 8–13 | Log Symptoms / Workout / Period / Sleep / How You Feel / Treatment | drawer rows | modal z-600 |
| 14 | Daily Focus drawer | DailyFocusCard | sheet |
| 15–18 | Trends / Sleep / Cycle / Symptoms detail drawers | card faces | sheet |
| 19 | Profile drawer + sub-views | avatar | edge drawer |
| 20 | PastEntryModal | history row | modal |
| 21 | SyncProgressModal | wearable sync | modal |
| 22 | Export flow (scope → generating → ready) | Treatments | sheet sequence |
| 23 | Toast | save/sync events | ephemeral |
No other screens exist. User flows (Phase 2) reference this inventory by number.