Patterns
How components combine into screens. Each pattern links to the UX guide section with the full rules and to an example screen.
Actions by risk
Match the safeguard to what the action does. Details: UX guide §5.
| Risk | Example | Pattern |
|---|---|---|
| Safe | Notiz zu Lea speichern | Just do it · Gespeichert |
| Reversible | Als abwesend markieren | |
| Irreversible | Prüfung abschliessen | |
| External / AI | Gruppen vom Assistenten | Proposal card → approve (see component) |
Home: “what needs me today”
One big next action, then a short list of things that need the person — not a wall of counters. Reference: the athlete app's Heute screen.
List → detail
Phone: the list is one page, the detail another (real URL, back link). Desktop: .split shows both. One primary action per row; others in the ⋯ menu. Bulk actions act only on the selection and say how many items they affect.
Public forms
Context first (what, when, cost, what happens next), then the fields. Steps for long forms. Error summary on submit, focus moves to it. Confirmation page and e-mail repeat what was submitted — never data about other people.
Offline and saving
Trainer and Member apps queue changes in the outbox and always show the save status. Nothing typed is lost; “Wartet auf Verbindung” is a normal state, not an error.
Wizards
3–5 named steps, each fitting one screen. Back never loses input. The last step summarises and states what will happen.
- Rahmen, erledigt
- Fokus, erledigt
- Ablauf
- Prüfen