ODS ist ruhig, klar und funktional. Die Oberfläche soll Arbeitsabläufe stützen, nicht Aufmerksamkeit erzeugen.
- Verwende Tokens statt Inline-Farben.
- Halte Flächen ruhig und reduziert.
- Nutze Linien, Spacing und Typografie zur Struktur.
- Setze Farbe als Signal ein.
- Nutze Pills für Status, Filter und kompakte Actions.
- Verwende
rounded-full für Buttons, Badges und Pills.
- Respektiere
prefers-reduced-motion.
- Schreibe UI-Texte direkt und konkret.
Don’t
- Keine lauten Farbflächen als Dekoration.
- Keine Schatten als primäres Strukturmittel.
- Keine ornamental gemeinten Verläufe oder Bokeh-Hintergründe.
- Keine unnötigen Karten-in-Karten-Layouts.
- Keine übertriebenen Marketing-Floskeln.
- Keine eigenen Farbsysteme pro App.
- Keine Animation ohne funktionalen Zweck.
Sprache
oxom klingt:
- ruhig
- klar
- präzise
- reduziert
- hochwertig
- belastbar
Schreibe über konkrete Wirkung im Workflow, nicht über abstrakte Versprechen.
UI-Hierarchie
- Inhalt
- Zustände
- Navigation
- Aktionen
- Marke
Die Marke muss präsent sein, aber sie soll die Arbeit nicht überdecken.
Feature-Oberflächen
Für Workspace-Tools gilt:
- keine Landingpage als erste Ansicht
- das primäre Werkzeug ist die erste Ansicht
- Bedienflächen sind dicht, aber ruhig
- wiederkehrende Aufgaben brauchen kurze Wege
- Settings gehören in klare Panels, Sheets oder dedizierte Settings-Seiten
Komponenten
Wenn eine Komponente im ODS-Katalog existiert, verwende sie zuerst. Neue Komponenten gehören ins ODS, wenn sie:
- in mehreren Apps gebraucht werden,
- einen gemeinsamen Zustand oder ein wiederkehrendes Pattern abbilden,
- Accessibility oder Interaction-Details zentral lösen,
- sonst mehrfach lokal nachgebaut würden.
Last modified on August 3, 2026
