Design Kits und Design Systeme helfen dem Designer strukturell zu arbeiten. Design Systeme sind z.B. Betriebssysteme für Smartphones. Das kennen wir alle: der „Zurück-Button“ ist in jedem Programm an der gleichen Stelle, die Gesten funktionieren immer ähnlich und jedes Programm nutzt die gleiche Tastatur. Das ganze System ist darauf ausgelegt, dass sich der Nutzer schnell zurecht findet und die Programme flüssig bedienen kann. Ein Design-Kit beschreibt Vorlagen, Symbole, Farben und Formatierungen, die in Form von Bibliotheken für Design-Programme entwickelt wurden. Das können Bibliotheken von Design Systemen sein oder selbst angefertigte Kits für das eigene Projekt.
Corporate Design Manuals in Unternehmen
Ich erinnere mich gut an die dicken Ordner, die früher im Schrank der Agentur standen. In den Corporate Design Manuals von großen Unternehmen wurden alle Daten und Fakten zur möglichen Anwendung gesammelt. Das reichte von der genauen Platzierung und Bemaßung des Logos über Anzeigenformate, Covergestaltung verschiedener Publikationsarten und „Dos and don’ts“ von Farbzusammenstellung und Bilderwahl. Die Kernidee für diese Ausführungen war die Gleiche, wie für die heutigen Design Kits und Systeme: Die Schaffung eines soliden Fundaments für die Umsetzung des Corporate Designs. Der Leitfaden hat den unterschiedlichen Designern und Anwendern geholfen das Corporate Design umzusetzen. Der Aufwand in den Korrekturphasen hat sich minimiert. Das Ergebnis war die Wiedererkennung von Unternehmen über Medien und Designer hinweg.
Design Systeme von Apple, Google und Microsoft
Die großen Design Systeme der letzten Jahre kennen alle Designer und Entwickler. Da ist die Rede von Google’s Material Design, Apple’s Human Interface Guidelines und Microsoft’s Fluent Design System. Diese Systeme sind die Basis für Anwendungen auf Android, iOS und Windows mobile und bis ins kleinste Detail ausgearbeitet. Sie sind die logische Fortsetzung von klassischen Manuals, beziehen sich jedoch nicht alleine auf das Corporate Design eines Unternehmens, sondern die Gestaltung und Funktionsweise eines Betriebssystems für mobile Endgeräte. Möchte man eine App für eins der Betriebssysteme entwickeln, sollte man sich an den Vorgaben so gut wie möglich orientieren. Eine gute Einarbeitung schafft Verständnis für die Funktionsweise und Gestaltung. Die Nutzer eines Smartphones sind sehr verwöhnt und gewöhnt daran, dass alle Apps nach einem bestimmten erlernten Muster funktionieren. Wird das eigene Design schlüssig entwickelt und konsequent umgesetzt entsteht für den Nutzer das Gefühl der intuitiven Nutzung von Geräten und Anwendungen. Der Nutzer fühlt sich in der Anwendung Zuhause. Die Design Systeme enthalten normalerweise Design-Kits für unterschiedliche Programme, um die Entwicklung von Apps zu vereinfachen.
Design Kits in mittelgroßen Projekten
Die heutigen Design-Kits sind für die Nutzung in den gängigen Design Programmen ausgelegt und vereinfachen die Arbeit an größeren Projekten. Ich kann Formatvorlagen, Farben, Raster und Komponenten als Bibliothek in mein Lieblings-Programm laden und sofort nutzen. Neben den Kits der Designsysteme gibt es auch kostenfreie oder günstige Design-Kits anderer Designer, mit denen man schnell ein Projekt starten kann. Für mittelgroße Projekte gestaltet man mittlerweile ein eigenes Design-Kit. Es vereint die Prinzipien des Systems, in dem ich mich bewege (ich entwerfe eine iOS App) mit den Vorlagen meines Corporate Designs. Dabei sind die Buttons schon in meiner Corporate Farbe eingefärbt, die Felder haben die richtige Rahmenfarbe und Stärke und ich habe wiederholende Elemente als Symbole oder Komponenten gestaltet. Mein Kunde sieht im Entwurf genau, wie ich das Corporate Design auf das iOS angewand habe.
Wofür braucht man ein Design-Kit?
In kleinen Projekten braucht es in meinen Augen kein Design-Kit. Ich erarbeite meine Vorlagen während des Designprozesses und entwickel es bis zur fertigen Produkt immer weiter. Kein Problem. Ein solches Kit wird bei größeren Projekten jedoch spannend:
1 / Alles aus einem Guss
Der erste große Nutzen von einem Design-Kit ist die Übersicht über alle eingesetzten Bausteine. Man sammelt die einzelnen Elemente an einer Stelle und sieht, ob alles mit einander harmonisiert oder ob es Stilbrüche gibt. Im Entwurf verteilen sich die Elemente oder einzelne Icons kommen nur einmal vor und wirken im Kontext passend. Im Design-Kit fällt es sofort auf, wenn etwas aus der Reihe tanzt. Es ist einfacher einen einheitlichen Stil entwickeln und die Elemente im Anschluss in den Entwurf einbauen, ohne immer wieder Schriftgrößen, Umrandungen oder Schatten gegenprüfen zu müssen.
2 / Basics der Nutzerführung
Bei einem digitalen Produkt oder einer umfangreichen Website ist die Nutzerführung ausschlaggebend für die spätere User-Experience. In einem Design-Kit wird zwar nicht die Struktur festgelegt, aber die Auszeichnungsarten von bestimmten Funktionen. Button-Arten, Links, Labels und Texthierarchien können so genau einander abgestimmt werden. Dem Nutzer wird zum Beispiel klar verständlich welche Elemente klickbar sind welcher Button die richtige Wahl ist. Sind alle Elemente klar definiert hat der Besucher am Ende eine gute User-Experience, da er das Produkt flüssig und intuitiv bedienen kann.
3 / Source of truth
Für die Arbeit mit mehreren Designern gilt das Design-Kit als „Quelle der Wahrheit“. Man kann sich darauf verlassen, dass alle im Team ihre Entwürfe auf der gleichen Basis aufbauen. Das verhindert große Verwirrung und Durcheinander im Entwurf. Teilt man die Gestaltung der einzelnen Screens oder Funktionen im Team auf hat man am Ende keine fünf verschiedenen Designansätze, sondern eine durchgängige Gestaltung.
4 / Wachsende Datenbank
Ein Design-Kit ist der Boost für Teamarbeit in großen Projekten. Fehlt im Entwurf ein Element wird es im Design-Kit ergänzt, mit den anderen Bausteinen abgestimmt und alle anderen Teammitglieder haben direkten Zugriff darauf. Je größer das Projekt wird, umso mehr Elemente hat man für die Gestaltung zur Verfügung. Die Arbeit wird immer effektiver, da man von der vorhergehenden Arbeit profitiert. Man kann immer wieder neu kombinieren und muss über die Basics nicht mehr nachdenken.
Wo bleibt denn die kreative Freiheit und Einzigartigkeit innerhalb dieser Strukturen?
Es kommt immer darauf an, was man mit dieser Struktur anfängt. Ich bin total froh, dass Strukturen in Deutschland allgemein als nützlich anerkannt werden. Ich muss in einem Designprozess nicht darüber diskutieren, ob ein „X“ das richtige Zeichen ist, um die Funktion „Fenster schließen“ auszuweisen. Auf viele Dinge hat man sich durch die gut durchdachten Systeme bereits geeinigt. Um ehrlich zu sein bin ich viel zu Faul immer wieder bei Null anfangen zu müssen. Ich kann also sofort bei den einzigartigen Dingen meines Projekts starten, das was meine kreative Freiheit wirklich ausmacht: eine ansprechende, authentische Gestaltung und ein funktionierendes Produkt.