Ein datengetriebenes Design-System misst seinen Nutzen, statt ihn zu behaupten. Beim US-Anbieter Scribe kletterte die tatsächliche Komponenten-Abdeckung in einem halben Jahr von 37 auf 52 Prozent, weil ein Design-Engineer jede Entscheidung an Zahlen band. Der Weg dorthin verrät, warum die meisten Design-Systeme still verfallen.
drweb.de als bevorzugte Quelle auf Google hinzufügenQualitätsgeprüfte Inhalte direkt in Google News & DiscoverJetzt hinzufügenDesign-Systeme wachsen schnell und altern leise: Neue Bausteine entstehen doppelt, alte bleiben ungenutzt, und niemand bemerkt den Verfall ohne Messung. Genau diese Lücke schließt der Ansatz, den Design-Engineer Ky Decker bei Scribe dokumentierte.
Das Wichtigste in Kürze
- Ein datengetriebenes Design-System steuert Ausbau und Pflege über Kennzahlen statt über Bauchgefühl.
- Bei Scribe stieg die Komponenten-Abdeckung laut Fallbericht binnen sechs Monaten von 37 auf 52 Prozent, die Gesamtbewertung über 18 Monate von 7,6 auf 9,1.
- Werkzeuge wie Omlet für die Nutzungsanalyse, Chromatic für visuelle Regression und Playwright mit axe-core für Barrierefreiheit liefern die Zahlen.
- Für den DACH-Raum wird die Barrierefreiheits-Messung zur Pflicht: Das Barrierefreiheitsstärkungsgesetz gilt seit dem 28. Juni 2025.
Warum verfallen Design-Systeme ohne Kennzahlen?

Ohne Messung bleibt unsichtbar, welche Bausteine ein Team wirklich nutzt. Entwickler bauen Komponenten neu, statt vorhandene zu finden, und das System zerfasert zur bloßen Sammlung. Viele Firmen besitzen deshalb keine echte Grundlage, sondern nur eine Komponenten-Bibliothek.
Der Mechanismus dahinter ist statische Code-Analyse. Ein Werkzeug wie Omlet durchsucht die Codebasis und zählt, wie oft jede Komponente und jede Eigenschaft tatsächlich vorkommt. Erst diese Nutzungsdaten zeigen, wo Doppelarbeit sitzt und welche Bausteine niemand mehr aufruft.
Welche Zahlen machen ein Design-System messbar?
Vier Messfelder bilden den Ansatz: Nutzung, Optik, Barrierefreiheit und die Stimmung im Team. Omlet liefert die Abdeckungsquote, Chromatic prüft jede Änderung gegen den letzten Stand, und Playwright mit axe-core testet automatisch auf fehlende Fokusringe oder zu schwache Kontraste. Dazu kommt alle sechs Monate eine Umfrage, die den gefühlten Zustand auf einer Skala festhält.
Die Wirkung lässt sich beziffern. Bei Scribe verbesserte sich die Wirksamkeit der Dokumentation um 40 Prozent, die Gesamtbewertung des Systems stieg von 7,6 auf 9,1 von zehn.[1] Wer nur die semantische Ebene der Design Tokens ordnet, hat die Bausteine benannt, ihren Einsatz aber noch nicht gemessen.
Ein Design-System ohne Kennzahlen ist eine Behauptung. Erst die Abdeckungsquote zeigt, ob die Investition im Alltag ankommt oder nur in der Bibliothek liegt.
— Markus Seyfferth, Chefredakteur Dr. Web
Was heißt das für Teams im DACH-Raum?
Die Barrierefreiheits-Messung ist im DACH-Raum keine Kür mehr. Seit dem 28. Juni 2025 verlangt das Barrierefreiheitsstärkungsgesetz, dass Webshops, Apps und viele B2C-Dienste die Norm EN 301 549 und damit die WCAG 2.1 auf Stufe AA erfüllen; Verstöße kosten bis zu 100.000 Euro.[2]
Automatische Tests mit Playwright und axe-core im Design-System liefern genau den Nachweis, den das Gesetz fordert, und finden Kontrast- oder Fokusfehler zentral an der Komponente statt auf hundert Einzelseiten. Alle drei Werkzeuge sind quelloffen oder in einer kostenlosen Stufe nutzbar.
- Die Abdeckung der wichtigsten Komponenten einmal messen.
- Visuelle Regressionstests in die Prüfkette einbauen.
- Die Barrierefreiheit automatisch an der Komponente prüfen.
Datengetriebene Steuerung macht aus einem Design-System ein Produkt mit Belegen statt mit Versprechen. Der Fallbericht von Scribe liefert die Kennzahlen und Werkzeuge als Vorlage, die sich auch in kleinen Teams übernehmen lässt.
Vier Messfelder und die Werkzeuge, die den Nutzen eines Design-Systems belegen.
Komponenten-Abdeckung bei Scribe in sechs Monaten
Gesamtbewertung des Systems über 18 Monate
wirksamere Dokumentation nach dem Umbau
Quellen
[1] Ky Decker: „Building data-driven design systems“
[2] Bundesministerium der Justiz: Barrierefreiheitsstärkungsgesetz (BFSG)
Mehr Newshunger?
- Design Tokens: Warum die semantische Ebene über Ihr Design-System entscheidet
- Sie haben kein Design-System, sondern eine Komponenten-Bibliothek
- Opensource UI: Über 150 React-Bausteine zum Kopieren, ohne Radix im Unterbau
- DialKit: Interface-Parameter live justieren, ohne den Code neu zu laden
- CSS-Scroll-Animationen 2026: Wie der Browser die Scroll-Bibliothek ersetzt