Du lernst Details: Spacing, Typo, States, Shadows, Motion — und baust Komponenten, die wirklich funktionieren.
Wir zeigen dir die häufigsten Detail-Fehler — und wie du sie systematisch behebst.
Ein System statt Bauchgefühl. Leichter Hand-off. Konsistente States.
Wie wir das verwenden: Jedes Token hat einen Namen und eine Funktion. Du lernst, wie man sie baut, benennt und im Team teilt.
Keine Theorie. Nur praktische Übungen. Du baust echte UI-Komponenten mit klaren Regeln.
| Lab Name | Was du baust | Skill |
|---|---|---|
| Buttons & States Lab | Button Set mit States Matrix | Hover, Active, Disabled, Focus |
| Inputs & Validation Lab | Input + Errors + Helper Text | Form States, Accessibility |
| Layout Rhythm Lab | Spacing System + Baseline Rhythm | Konsistente Abstände |
| Card & Shadow Lab | Elevation Ladder + Surfaces | Depth, Hierarchy |
| Navigation Lab | Tabs, Sidebar, Breadcrumbs | Patterns, Orientation |
| Motion Micro Lab | Hover Motion + Transitions | Timing, Reduce Motion |
Kein Zauber. Nur saubere Regeln.
Wir empfehlen dir den klarsten Start und welche Labs zuerst Sinn machen.