Style Guides

Um Konsistenz innerhalb einer Anwendung zu erreichen, ist ein Style Guide unabdingbar. In ihm sind alle Definitionen zu Interface Design (Look) und Interaction Design (Feel) dokumentiert:

Zu Grunde liegendes Raster für ein oder mehrere Displaygrößen (statisch, fluide, responsive)
Funktionsbereiche, Dialoge, Seitentypen
Bemaßungen, Abstände
Interaktive Elemente
Interaktionszustände (initial, während und nach Interaktion, bei Fehler, usw.)
Animationen & Transitions
Icons
Schmuck- und Interaktionsfarben
Schriftarten, -größen, -schnitte

Der richtige Style Guide:

Je nach Art der Applikation und Team-Zusammensetzung sind unterschiedliche Typen von Style Guides sinnvoll:

Klassischer Style Guide in PDF-Form zur Dokumentation von Grundlagen
Online Style Guide zur kollaborativen, schrittweisen Entwicklung. Nützlich, wenn mehrere Entwickler-Teams Zugriff haben sollen
Interaktiv nutzbarer Demo Style Guide (Pattern Library). Sinnvoll bei hochgradig interaktiven Elementen, für eigen-entwickelte Komponenten und bei komplexen Animationen
CSS-Demo-Template bei webbasierten Applikationen