Calm Pastel
Ruhige Pastelle, viel Whitespace, atmender Rhythmus.
P0=0 · MA=0 · Comp 21/25 · LH 0.81
Mockup
Was wurde geprüft? (bf-design Pipeline)
| Gate | Ergebnis |
|---|---|
| Verifier · P0 (Hard-Rules aus Brief) | 0 Verstöße · Profil mobile-app |
| Verifier · P1 (Soft-Rules) | 0 Hinweise |
| Mobile Asserts · P0 (Asset-Contract) | 0 fehlende/falsche Assets |
| Mobile Asserts · P1 | 0 Hinweise |
| Token-Lint · Color Literals | 4 hart codierte Farben |
| Token-Lint · Magic Numbers | 55 undokumentierte Werte |
| Token-Hoist · Auto-Promotion | 3 Farben → Token |
| Axe · A11y-Violations | 0 insgesamt, 0 kritisch |
| ClassA · WCAG-Kontrast | alle Paare bestanden (0 geprüft) |
| ClassA · Touch-Target ≥ 44pt | 0 Verstöße |
| ClassA · Reduced Motion | respektiert |
| Vision Score · Composite (max 25) | 21 (Ziel 22) |
| Vision · Information Density (1–5) | 4 |
| Vision · Visual Hierarchy (1–5) | 4 |
| Vision · Brand Coherence (1–5) | 5 |
| Vision · AI-Slop-Smell (1–5, höher = sauberer) | 4 |
| Vision · Mobile Realism (1–5) | 4 |
| Lighthouse · Performance | 0.81 (Ziel ≥ 0.90) |
| Lighthouse · Accessibility | 1 (Ziel ≥ 0.95) |
| Lighthouse · Best Practices | 0.96 (Ziel ≥ 0.90) |
| Bundle-Size | 1010 KB |
Vision-Critique-Zitat
Strong editorial-zine identity: black ‘dazukommen’ pill top-left, italic-serif ‘Heute, Sophie.’ hero, hot-yellow ground, map mid with red/teal pins. Buddy cards mid-bottom now show avatars + ‘LIVE’ chips, bottom tab-bar reads native. Map still feels pasted — no locate-FAB or gesture chrome.
Farbpalette
bg
fg-primary
fg-secondary
accent-1
accent-2
accent-3
accent-4
surface
border
muted
Typografie
| Rolle | Wert |
|---|---|
| display | "Recoleta", "Crimson Pro", "Domine", Georgia, serif |
| display-weight | 600 |
| display-tracking | -0.015em |
| body | "Atkinson Hyperlegible", "Inter", system-ui, sans-serif |
| body-weight | 400 |
| mono | "JetBrains Mono", monospace |
Spacing
| Step | Wert |
|---|---|
| step-0 | 6px |
| step-1 | 12px |
| step-2 | 18px |
| step-3 | 28px |
| step-4 | 44px |
| step-5 | 68px |
Radius
| Element | Wert |
|---|---|
| card | 28px |
| blob-1 | 60% 40% 50% 50% / 50% 60% 40% 50% |
| pill | 999px |
| tight | 16px |
Schatten
| Tier | Wert |
|---|---|
| soft-1 | 0 8px 24px -8px rgba(255, 138, 76, 0.25) |
| soft-2 | 0 16px 48px -16px rgba(168, 185, 255, 0.30) |
| halo | 0 0 0 8px rgba(125, 211, 168, 0.18) |
Charakteristische Patterns
- blob shape behind hero greeting (organic curve, accent-1 at 18 % opacity)
- soft pastel circles bleeding off-canvas as background depth
- rounded radial gradient on POI cards (accent-2 → surface, very subtle)
- hand-drawn arrow pointer between buddy avatar and status line
- wellness-style breathing dot (animated 4s ease-in-out) next to LIVE badge
Anti-Patterns dieser Direktion
- hard-offset shadows or 0px radius
- high-contrast pure black on pure white
- neon or saturated accents (>80 % saturation)
- any monospace-only labels