Index of the Vocelune screen boards. Sample content is illustrative, not reviewed for publication.
Open each board in a desktop browser. Everything inside a phone frame uses only design tokens (checked by check-boards.mjs). Spec and copy: docs/design/screens.md.
| Board | Contents |
|---|---|
| screens-today.html | Navigation map, tab bar, Today in every state, RTL and 200%, Android. |
| screens-onboarding.html | Three onboarding steps, app-language sheet, starter-pack download, verification and offline, ready, widget tutorial. |
| screens-learn.html | Dictionary, Word details, Library, Session (quiz, flashcard, pause, summary, quota), Playback. |
| screens-account.html | Settings, reset, reminders, Language catalog, Widget setup, Paywall and its states. |
| screens-adaptive.html | Smallest iPhone (SE, 375×667), small Android (360×800) and landscape. |
✓ = drawn. “works offline” = the screen has no network dependency after install; the global offline banner pattern (Today) applies. Blank = same layout as an adjacent variant; see screens.md.
| Screen | Default | Empty | Loading | Offline | Error | Dark | RTL | 200% | Android |
|---|---|---|---|---|---|---|---|---|---|
| Onboarding (3 steps, app language) | ✓ | — | ✓ | ✓ | ✓ | ||||
| Starter pack install, ready, widget tutorial | ✓ | — | ✓ | ✓ | ✓ | ||||
| Today | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Dictionary | ✓ | ✓ | not shown (<300 ms) | works offline | ✓ | ✓ | |||
| Word details | ✓ | retired ID | ✓ | audio not installed | ✓ | ✓ | ✓ | ✓ | |
| Library | ✓ | ✓ | ✓ | works offline | ✓ | ||||
| Session: quiz | ✓ | pack exhausted (Today) | works offline | ✓ | ✓ | ✓ | ✓ | ||
| Session: flashcard, pause, summary, quota | ✓ | quota reached | works offline | skipped exercise | |||||
| Playback | ✓ | missing asset | missing asset | interrupted | |||||
| Settings | ✓ | — | works offline | permission denied | ✓ | ✓ | |||
| Language catalog | ✓ | ✓ | ✓ | ||||||
| Widget setup | ✓ | — | works offline | ✓ | |||||
| Paywall | ✓ | already Pro | pending | ✓ | ✓ | ✓ | ✓ | ✓ |