Die Case Study eines Design Systems

Modernes Designsystem als Treiber für digitalen und kulturellen Wandel

Ein Designsystem als strategischer Schritt in Richtung Zukunft.

In einem sich schnell entwickelnden digitalen Umfeld brauchen Unternehmen mehr als nur technisch einwandfreie Produkte – sie brauchen konsistente, benutzerfreundliche und markenkohärente Lösungen, die reibungslos skalierbar sind.

Case Study zeigt, wie ein umfassendes, modernes Designsystem nicht nur visuelle Konsistenz schafft, sondern auch als Katalysator für einen umfassenden kulturellen Wandel fungieren kann. Von der Überzeugung der Führungsebene bis zur Schulung der Teams in neuen Technologien und Arbeitsmethoden – hier sehen wir, wie tiefgreifend ein Designsystem auf alle Ebenen eines Unternehmens wirken kann.

Erfolge und Erkenntnisse

Wichtige Leistungskennzahlen (KPIs)

Zeitaufwand Entwicklung

Eingesparte Zeit durch wiederverwendbare Design-Elemente und -Tokens.

Zeitaufwand Einarbeitung

Durchschnittliche Einarbeitungszeit nach der Implementierung.

Support-Anfragen

Anfragen der Produktteams zu Designstandards und -vorgaben.

Prototyp-Entwicklung

Dank verfügbarer Tokens, Designvorlagen, Patterns und kontextuellen Besonderheiten.

Angewandte Prinzipien und Methoden

Design Thinking Iteratives Vorgehen Change-Management und Kommunikation Hypothesengetriebene Anpassungen Lean-Start-Up Ansätze

Situation – Aufgabe – Aktion – Ergebnis

Die Ausgangssituation

Fragmentierte Strukturen und fehlende Effizienz in einem wachsenden Unternehmen

Vor dem Start des Projekts war die visuelle und funktionale Kohärenz der Produkte und internen Tools stark fragmentiert. Unterschiedliche Abteilungen – darunter Marketing, UI-Design, Research und Entwicklung – arbeiteten mit jeweils eigenen Standards und Designs, die nicht nur inkonsistent, sondern auch schwer miteinander zu verbinden waren. Dazu kam eine technische Infrastruktur, die noch auf veralteten Tools und starren Prozessen basierte.

Die Geschäftsführung war sich zwar der Notwendigkeit eines Umbruchs bewusst, doch Skepsis herrschte: Wie würde sich ein solches System auf die Effizienz auswirken? Würden die Mitarbeiter die Veränderung akzeptieren?

Zusätzlich standen die Teams vor einer großen Herausforderung: Ein Designsystem sollte nicht nur visuell einheitlich und skalierbar sein, sondern auch den kulturellen Wandel fördern. Viele Mitarbeiter hatten kaum Erfahrung mit modernen Arbeitsmethoden wie agilen Prozessen oder digitalen Prototyping-Tools. Ohne intensive Schulung und ein gezieltes Change-Management war eine langfristige Akzeptanz des Designsystems kaum möglich.

Die Aufgabe

Aufbau eines Designsystems zur Förderung von Konsistenz und kulturellem Wandel

Ziele des Projekts waren sowohl operative als auch strategische Natur:

Beschleunigung der Time-to-Market durch einheitliche Design- und Entwicklungsprozesse.
Sicherung der Skalierbarkeit auf internationale Märkte.
Schaffung einer konsistenten Designbasis für alle Teams und Produkte.
Förderung eines kulturellen Wandels hin zu moderneren, flexibleren Arbeitsmethoden.

Zusammengefasst: Ein Designsystem sollte eine zentrale Anlaufstelle für alle visuellen und funktionalen Vorgaben werden und Teams befähigen, schneller und autonomer zu arbeiten.

Weitere Projektanforderungen:

Zentrale Design-Plattform:
Eine einheitliche Bibliothek, die alle Design-Ressourcen, Richtlinien und Vorlagen an einem Ort bündelt, leicht zugänglich und mit modernen Tools kompatibel.
Flexibler, iterativer Rollout:
Die Einführung des Systems in mehreren Phasen, um Akzeptanz zu fördern und Teams Zeit zur Anpassung zu geben.
Schulung und Onboarding:
Intensive Schulung für alle Mitarbeiter, um sie mit den neuen Tools und Arbeitsmethoden vertraut zu machen.
Stakeholder-Buy-In:
Eine umfassende Überzeugungsstrategie für die Führungsebene, um die Vorteile des Systems für Effizienz und Markenidentität klar zu machen.

Maßnahmen und Aktionen

Ein iterativer, gezielter und transparenter Prozess zur Einführung

1. Sichten und Analyse des Status quo

Der erste Schritt bestand darin, eine umfassende Bestandsaufnahme aller vorhandenen visuellen und funktionalen Elemente im Unternehmen zu erstellen. Ziel war es, einen genauen Überblick über den Ist-Zustand und die Vielzahl an Varianten und Inkonsistenzen zu gewinnen. Das Team analysierte die Design-Assets jedes einzelnen Bereichs – vom Marketing über die UI-Komponenten der Produkte bis hin zu internen Dokumentationen.

Diese Sichten-Phase zeigte deutliche Inkonsistenzen auf:

Unterschiedliche Farben und Schriften in den Anwendungen und Marketingmaterialien.
Mehrfach vorhandene Designelemente mit ähnlicher Funktionalität, die je nach Abteilung leicht variierten.
Fehlende Standards für die User Interface (UI)-Komponenten, was die Benutzerfreundlichkeit und Wartbarkeit erschwerte.

2. Aufbau einer zentralen Design-Bibliothek

Basierend auf den Ergebnissen der Analysephase begann das Team, eine zentrale Design-Bibliothek aufzubauen. Diese Bibliothek sollte alle notwendigen visuellen Elemente und Vorlagen enthalten und als Single Source of Truth fungieren. Damit sich die Teams schnell orientieren konnten, wurde ein Token-basiertes System entwickelt, das es ermöglichte, Designstandards direkt in Softwareprodukten zu integrieren.

Design-Tokens für Farbschemata, Typografie und Abstände, die direkt im Code verwendet werden konnten.
Komponentenkatalog mit wiederverwendbaren UI-Elementen, die einfach per Drag-and-Drop implementiert werden konnten.
Dokumentation zu Design-Richtlinien und Best Practices, die fortlaufend aktualisiert wurden, um die Benutzerfreundlichkeit und Effektivität zu sichern.

3. Stakeholder-Buy-In und kontinuierliche Kommunikation

Um die Unterstützung der Führungskräfte zu gewinnen, präsentierte das Team die Vorteile des Designsystems anhand messbarer Beispiele:

Reduzierung von doppelter Arbeit und Design-Inkonsistenzen.
Verkürzung der Markteinführungszeit und Beschleunigung des Prototypings.

Zusätzlich hielt das Team regelmäßig Meetings mit den Stakeholdern ab und schuf so Transparenz und Vertrauen. Mithilfe gezielter Argumente, wie der Einsparung von Arbeitsstunden und der Steigerung der Markenkonsistenz, gelang es, den Buy-In der Geschäftsführung zu sichern.

4. Iterativer Rollout und kontinuierliches Feedback

Statt das Designsystem in einem großen Schritt auszurollen, entschied sich das Team für einen inkrementellen Ansatz. Dieser ermöglichte den Abteilungen, das System schrittweise kennenzulernen und ihre Arbeitsweise anzupassen. Das iterative Vorgehen erleichterte die Anpassung an unternehmensspezifische Anforderungen, die während des Rollouts auftraten, und förderte die Akzeptanz, da jedes Team aktiv eingebunden wurde.

5. Schulungen und Change-Management

Ein wichtiger Faktor für den Erfolg des Projekts war das umfassende Schulungskonzept. In regelmäßigen Workshops und Onboarding-Sessions wurden die Mitarbeiter nicht nur in die technischen Grundlagen eingeführt, sondern auch in agile Methoden und neue Arbeitsansätze, wie Prototyping und kollaborative Tools. Die Schulungen schufen ein Bewusstsein für den Wert des Designsystems und förderten einen nachhaltigeren Umgang mit den neuen Technologien.

Das Resultat

Ein modernes Designsystem als Fundament für Effizienz, Konsistenz und Kulturwandel

Die Einführung des Designsystems brachte messbare Verbesserungen in Effizienz und Konsistenz sowie langfristig positive Effekte auf die Unternehmenskultur. Die klaren, zentralen Standards und das flexible Token-System machten es den Teams möglich, schneller auf Veränderungen zu reagieren und konsistent auf internationalem Niveau zu agieren.

Ein einheitliches Designsystem reduziert nicht nur Zeit- und Kostenaufwand in der Produktentwicklung, sondern auch kognitive Belastungen für alle Teams: Sie können sich auf produktrelevante Aufgaben konzentrieren, ohne sich wiederholt um Designfragen kümmern zu müssen. Das stärkt die Markenidentität, steigert die Effizienz und schafft durch klare Standards mehr Raum für Innovation und Zusammenarbeit.

Erzielte Kosteneinsparungen

1. Zeiteinsparung durch Wiederverwendung von Komponenten

Gesamteinsparung von 5.175 EUR pro Monat oder 62.100 EUR pro Jahr!

Situation: Freelancer wurden häufig für die Entwicklung ähnlicher UI-Komponenten beauftragt, die aufgrund fehlender Standards oft mehrfach erstellt wurden. Mit dem neuen Designsystem sind standardisierte Komponenten nun zentral verfügbar und werden größtenteils intern von Junior- und Senior-Designern sowie Softwareentwicklern verwendet.

Vorher: Erstellung einer Komponente von Grund auf dauert ca. 4 Stunden, die häufig extern vergeben wurden.
Nachher: Die internen Designer und Entwickler verwenden vordefinierte Komponenten, was nur noch ca. 1 Stunde in Anspruch nimmt.

2. Reduzierte Onboarding-Zeit für neue interne Mitarbeiter

Einsparung: 15.408 EUR pro Jahr.

Situation: Festangestellte Mitarbeiter benötigen dank des zentralen Designsystems weniger Zeit für die Einarbeitung, da alle Standards und Komponenten an einem Ort gebündelt und leicht zugänglich sind.

Vorher: Die Einarbeitung eines neuen festangestellten Designers dauerte durchschnittlich 4 Wochen (160 Stunden).
Nachher: Die Einarbeitung dauert im Schnitt nur noch ca. 8 Tage (64 Stunden), da das Designsystem klar dokumentiert und zentral organisiert ist.

3. Effizienzsteigerung bei Prototyping-Projekten durch Freelancer

Einsparung: 5.400 EUR pro Monat oder 64.800 EUR pro Jahr!

Situation: Das Unternehmen beauftragte Freelancer für die schnelle Entwicklung von Prototypen. Vor Einführung des Designsystems dauerte das Prototyping für ein Feature durchschnittlich 3 Tage (24 Stunden). Mit dem zentralen Designsystem und standardisierten Komponenten kann ein Freelancer dieselbe Aufgabe nun in 1,5 Tagen (12 Stunden) abschließen.

Vorher: Erstellung einer Komponente von Grund auf dauert ca. 4 Stunden, die häufig extern vergeben wurden.
Nachher: Die internen Designer und Entwickler verwenden vordefinierte Komponenten, was nur noch ca. 1 Stunde in Anspruch nimmt.

Learnings und Maßnahmen

Während der Implementierung eines Designsystems, insbesondere in einem Unternehmen, das bislang wenig Erfahrung mit modernen Arbeitsmethoden hatte, können verschiedene Herausforderungen auftreten. Hier einige Beispiele für Probleme, die hätten auftreten können, sowie die daraus gewonnenen Learnings und Maßnahmen:

1. Unterschätzung des Schulungsbedarfs und der Skepsis gegenüber neuen Technologien

Problem: Zunächst wurde der Schulungsbedarf unterschätzt, und es wurde angenommen, dass Mitarbeiter schnell in die neuen Tools und Prozesse eingearbeitet wären. Einige Teams hatten Schwierigkeiten, das System vollständig zu nutzen, da sie weder das technische Know-how noch die nötige Motivation hatten, die neuen Tools zu erlernen.
Learning: Das ist das Ding: Du kannst das modernste System haben – wenn deine Leute es nicht verstehen oder wollen, nutzt es niemand. Was wirklich funktionierte, war, die Schulung direkt mit der Einführung zu verbinden. Keine langen Wartezeiten, kein „Wir schauen mal, wie es läuft“. Stattdessen habe ich die Teams direkt abgeholt – Workshops, spontane Q&A-Sessions, ein Help Desk, der sofort reagierte. Es geht darum, Unsicherheiten so schnell wie möglich aus dem Weg zu räumen.
Maßnahme für künftige Projekte: Schulung muss einfach Teil des Prozesses sein, nicht ein Add-on. Ich würde in Zukunft viel stärker darauf achten, kleine Schulungseinheiten über den gesamten Rollout zu verteilen. Mach’s schnell, mach’s praktisch, und vergiss den Spaß nicht – die Leute lernen besser, wenn sie sich nicht wie in der Schule fühlen.

2. Fehlende Kommunikation zwischen Abteilungen

Problem: Zu Beginn war die Kommunikation zwischen den Teams nicht ideal. Einige Abteilungen fühlten sich nicht ausreichend einbezogen und befürchteten, dass ihre spezifischen Anforderungen nicht berücksichtigt wurden. Das führte zu Missverständnissen und erschwerte die Akzeptanz.
Learning: Kommunikation ist keine Option – sie ist das Fundament. Das war der Moment, in dem ich verstanden habe: Wenn du nicht redest, reden die anderen. Und dann entstehen Probleme. Also: Mehr Austausch, mehr Transparenz, mehr Offenheit. Ich habe die Abteilungen miteinander reden lassen, ihre Wünsche dokumentiert, und plötzlich fühlten sich alle gehört. Das Beste daran? Sie brachten neue Ideen mit ein, die das Projekt noch besser gemacht haben.
Maßnahme für künftige Projekte: Für mich ist klar: Startet sofort mit einem abteilungsübergreifenden Gremium. Und dabei geht nicht nur darum, dass alle informiert sind. Es geht darum, dass alle das Gefühl haben, Teil von etwas Großem zu sein.

3. Unzureichende Zeit für Test- und Anpassungsphasen

Problem: Das Team stellte fest, dass einige Design-Tokens und UI-Komponenten nicht so gut wie geplant funktionierten und kurzfristige Anpassungen nötig waren. Da die Zeit für die Test- und Anpassungsphase knapp bemessen war, führten die Änderungen zu Verzögerungen und teilweise zu Frustrationen bei den Anwendern.
Learning: Alle wollen fertig werden, wenige wollen testen. Aber hier ist die Wahrheit: Ohne Zeit für Tests endet es im Chaos. Also: Beta-Test. Sofort. Klein starten, Feedback reinholen, fixen. Ich habe gelernt, dass Nutzerfeedback vor dem Go-Live absolut entscheidend ist. Die Beta-Phase hat uns nicht nur geholfen, die Bugs zu finden, sondern auch gezeigt, wie die Teams das System wirklich nutzen. Das hat so viel Stress rausgenommen.
Maßnahme für künftige Projekte: Ich würde in Zukunft mehr Zeit für diese Phase einplanen, ohne Ausnahme. Wenn es schnell gehen muss, dann halt mit einer fokussierten Testgruppe, aber testen muss sein. Und ehrlich: Ein flexibler Puffer für Anpassungen nach dem Feedback ist kein Luxus – er ist die Rettung.

4. Überforderung durch zu viele neue Komponenten auf einmal

Problem: Beim initialen Rollout des Systems wurden zu viele neue Design-Elemente und Tools auf einmal eingeführt. Die Mitarbeiter fühlten sich überfordert und konnten die Vielzahl neuer Vorgaben und Komponenten nicht effektiv nutzen.
Learning: Stell dir vor, du bringst jemandem bei, ein Fahrrad zu fahren, und gibst ihm gleichzeitig ein Skateboard und Rollschuhe. Das geht nicht. Was funktioniert hat: MVP. Minimal Viable Product. Wir haben später die Einführung gesplittet, den Fokus auf die Basics gelegt und erst dann zusätzliche Features eingeführt. Die Leute lieben es, wenn sie das Gefühl haben, etwas wirklich zu beherrschen, bevor das nächste Ding kommt.
Maßnahme für künftige Projekte: Kein „Alles auf einmal“. Zuerst die wichtigsten Teile, dann der Rest. Bonus: Feier jeden kleinen Erfolg. Es motiviert die Leute mehr, als du denkst.

5. Fehlende Erfolgsmessung zu Beginn des Projekts

Problem: In den ersten Phasen fehlten klare KPIs und Metriken, um den Erfolg des Systems zu messen. Ohne regelmäßige Erfolgskontrollen war es schwer, den Fortschritt zu evaluieren und notwendige Anpassungen frühzeitig vorzunehmen.
Learning: Du kannst nicht verbessern, was du nicht misst. Punkt. Ich habe schnell gemerkt, dass wir ohne klare Zahlen nicht wirklich wussten, ob wir vorankommen oder nur beschäftigt sind. Als wir dann Metriken eingeführt haben – z. B. Nutzungsraten, Feedback-Schleifen, Bearbeitungszeiten – wurde plötzlich alles viel klarer. Plötzlich wusste jeder, wo wir stehen.
Maßnahme für künftige Projekte: Immer KPIs, immer sichtbar, immer für alle. Ein gemeinsames Dashboard, das den Fortschritt live trackt, ist Gold wert. Und noch wichtiger: Diese Zahlen mit den Teams teilen. Es motiviert ungemein, wenn sie sehen, dass ihre Arbeit Ergebnisse bringt.

6. Probleme bei der Integration in bestehende Software

Problem: Die Implementierung des Designsystems stieß auf technische Herausforderungen bei der Integration in die bestehende Software-Landschaft. Einige Systeme waren nicht mit den neuen Design-Tokens und Komponenten kompatibel, was zu Verzögerungen und erhöhtem Aufwand führte.
Learning: Technik ist entweder dein bester Freund oder dein größter Feind. Ich habe hier gelernt: Kein System ist „einfach kompatibel“. Du musst es testen. Proof of Concept. Was für uns funktioniert hat, war, das Designsystem zuerst auf einer kleinen Plattform zu testen. Dadurch konnten wir alle potenziellen Probleme identifizieren, bevor es groß wurde.
Maßnahme für künftige Projekte: Ich werde immer ein technisches Audit vor Projektbeginn machen. Punkt. Und ja, das kostet Zeit, aber es spart dir am Ende mehr, als du glaubst. Außerdem denke ich darüber nach, eine technische Roadmap zu erstellen, die die wichtigsten Abhängigkeiten visualisiert. Das hilft nicht nur dem Team, sondern auch den Stakeholdern, den Überblick zu behalten.

Fazit

Diese Learnings zeigen, dass ein Designsystem eine sorgfältige Planung und flexible Anpassung erfordert. Durch rechtzeitige Schulungen, abteilungsübergreifende Kommunikation und klar definierte Erfolgskontrollen konnte das Projektteam einige dieser Herausforderungen bereits im Projektverlauf erfolgreich lösen. Künftig können diese Erfahrungen genutzt werden, um Designsysteme noch effizienter und zielgerichteter zu implementieren.

Zusammenfassung

Nachhaltiger Wandel durch ein strategisch eingeführtes Designsystem

Das neue Designsystem ist nicht nur ein technisches Tool, sondern eine strategische Basis für zukünftiges Wachstum und Effizienz. Durch die klare Struktur und transparente Kommunikation konnte das Unternehmen eine einheitliche Designsprache schaffen und gleichzeitig einen kulturellen Wandel vorantreiben. Die kontinuierliche Schulung und Einbindung der Mitarbeiter in den Prozess hat eine Akzeptanz geschaffen, die langfristige Erfolge ermöglicht und das Unternehmen agiler und wettbewerbsfähiger macht.