Pattern Library

Mit Design-Systemen effizient entwickeln und konsistente Nutzungserlebnisse schaffen

Digital Design Pattern Library – Effizienz im digitalen Design

Digitales Design muss heute nicht nur effizient anwendbar sondern auch skalierbar sein. Wir nutzen immer mehr digitale Touchpoints, diese müssen immer schneller von immer mehr Teams bespielt werden – einige Teammitglieder sind intern, andere extrern. Das bestmögliche Ergebnis für Nutzende und Unternehmen bieten hierbei konstistente Nutzungserlebnisse über alle Touchpoints hinweg. Diese Erlebnisse anzupassen oder komplett zu erneuern kann sehr aufwendig werden.

Einfacher geht es mit einer Digital Design Pattern Library – einem Design-System, das funktionierenden, getesteten Code bereitstellt. Hierbei werden alle wichtigen digitalen Elemente in ihre kleinstmöglichen Einheiten aufgeschlüsselt und jeweils als Frontend Code zu Verfügung gestellt: vom Such-Icon über den CtA-Button bis zum Login.

Illustration Digital Design Pattern Library

Herausforderung Digitales Design

Bei großen Unternehmen arbeiten viele Kreative – intern und extern – kontinuierlich an digitalen Interfaces. Dabei werden ähnliche Aufgaben immer wieder und immer wieder anders gelöst. Dadurch entstehen Inkonsistenzen. Diese schwächen das Markenerlebnis, schaden dem Erlebnis der Nutzenden und führen dazu, dass Services schlechter zu bedienen sind. Zusätzlich kostet die mehrfache Entwicklung immer wieder aufs Neue Zeit und Geld.   

Ein klassisches Brandportal bildet das Design in seinen verschiedenen Ausprägungen ab. Es ist damit ein wichtiger Referenzpunkt für alle Designarbeiten und den Umgang mit Corporate Identity und Corporate Design. Normale Brandportals bilden allerdings nicht den Code hinter den digitalen Design-Elementen ab. Aktueller Code ist daher nicht für Neuentwicklungen verfügbar.  

Diese Problemstellung löst eine digitale Design Pattern Library, kurz Design-System. Sie erlaubt eine zentrale Entwicklung, indem sie zentral User-Interface-Elemente, Module und Templates bereitstellt. Diese sind somit projektübergreifend und sicher für alle konsumierbar, die damit arbeiten sollen. Nichts geht verloren, nichts wird mehrfach erarbeitet.  

3 Schritte vom Corporate Design zum Design System

1. Schritt: Design atomisieren – Schriften, Farben, Funktionalitäten etc. detailliert definieren
2. Schritt: Organismen und Abläufe aufbauen – alle größeren Einheiten für alle Anwendungsmöglichkeiten festlegen
3. Schritt: Alle Atome und Patterns mit ihrem Code abbilden – in einer Bibliothek zugänglich machen
3 / 1

Vorteile: Messbar effizient und qualitativ überzeugend

Eine Digital Design Pattern Library ist nicht bloß Problemlösung. Sie realisiert auch Kostensenkungen, Qualitätsverbesserungen und drastische Geschwindigkeitssteigerungen. Kosten werden sinken, weil alles, was entwickelt wird, nur einmal bezahlt wird und dann beliebig oft in unterschiedlichsten Anwendungen genutzt werden kann. Die Qualität wird verbessert, weil eine einheitliche und konsistente User Experience für alle digitalen Projekte gewährleistet wird. Zudem besteht für die Zukunft eine zentrale, geprüfte Code-Basis für die Frontend-Implementierung. Die Geschwindigkeit wird gesteigert, weil einmal Entwickeltes einfach und direkt als robuste Basis für Neuentwicklungen genutzt wird. Das gilt für alle heutigen und zukünftigen Anwendungen von Kundenportal bis APP.  

Doch auch in der Arbeit der Teams macht sich eine Veränderung bemerkbar: Endlich gibt es einen Single Point Of Truth: Eine stets aktuelle Informationssammlung, die an einem Ort alle wichtigen Elemente und Anwendungen bündelt. Design und Code gehen Hand in Hand: Das digitale Design – vom Button bis zu zur Log-In-Funktion – wird grafisch abgebildet und dazu der getestete Code hinterlegt. Dadurch ändert sich der Workflow: Es wird wirklich Neues entwickeln, nicht dasselbe nochmal. Alle entwickelten Komponenten werden für alle wiederverwendbar aufbereitet und zugänglich gemacht, sodass alle sich auf die Entwicklung von Neuem konzentrieren können. Und schließlich die Ganzheitlichkeit: Neuentwicklungen werden kontrolliert zurück ins System gespielt, wenn sie in Zukunft wieder allen zur Verfügung stehen sollen.  

Design Pattern Library Systeme Illustration
Verschiedene Systeme, die für Design Pattern Librarys benutzt werden.

Wie fängt man mit einer Design Pattern Library an?

Die Umsetzung einer Digital Design Pattern Library beginnt am besten mit einem eintägigen Anforderungs- / Scoping-Workshop. Die wichtigsten Fragen sollten geklärt werden: Wer arbeitet mit der Library? Wo entstehen aktuell Probleme und Kosten? Welche gesamtstrategische Richtung soll verfolgt werden?

Die Ergebnisse fließen in die Festlegung von Scope und Timeline: Mögliche Arbeitspakete werden definiert. Ihre Priorität wird festgelegt. Danach kann die Einrichtung der Digital Design Pattern Library beginnen.

Ihr Ansprechpartner
Marian Gertheim

Marian Gertheim
Beratung
Fon +49 30 72 62 77 - 974

E-Mail schreiben
XS
SM
MD
LG