Components
Empty States
Empty means the system is learning — never that the user failed to log. Cards keep their eyebrow, explain what they're waiting for, and offer the action that feeds them.
Card-level canonical form, live
Today's Focus
Learning your patterns
A few more logged days and Peri can estimate your recovery capacity. Cycle context unlocks after two period starts.
What Usually Happens Next?
Once 5 days are logged, Peri can match today against similar days from your history.
The threshold ladder
| Threshold | What unlocks |
|---|---|
| 0 entries | screen-level empty — full stack in learning mode + one primary log prompt |
| 3 recent entries | RecentTrendsCard renders |
| 5 entries | WhatNextCard renders · DailyFocus leaves “learning” |
| 14 entries | playbooks unlock |
| 2 period starts | cycle context appears |
| 10 / 20 entries | trends confidence: low → medium → high |
The ladder is intentional product pacing: the user experiences a sequence of unlocks during the first weeks, each labelled with what fed it — the empty states are the onboarding.
Do
- ·Keep the card and its eyebrow visible in empty mode
- ·Name the threshold (“after two period starts”)
- ·Offer the feeding action (tint button, not gradient)
- ·Use “Learning your patterns” language
Don't
- ·Show dashes, zeros, or greyed gauges
- ·Show “Crash risk unavailable” or any unavailable-style copy
- ·Hide empty cards — absence teaches nothing
- ·Guilt the user (“You haven't logged in 3 days!”)
Accessibility
- —Empty states are real text content — fully readable by screen readers, no decorative placeholders.
- —The feeding action is a normal button, reachable in tab order right after the explanation.