Styleguides


In vielen Usability Tests habe ich den Satz gehört „Das ist einfach, das funktioniert wie Windows”. Vor allem im unternehmerischen Umfeld spielen Aspekte wie Effizienz, Lernaufwand oder Fehleranfälligkeit eine große Rolle. Wenn Sie bereits vor der Entwicklung Ihres Produkts grundlegende Gestaltungsleitlinien in einem Styleguide festlegen, können Sie eine einheitliche Bedienung und Optik Ihres Produkts sicherstellen.

Solche Leitlinien lassen sich in einem Styleguide zusammenfassen. Dieser Leitfaden kann während der Entwicklung des Produkts von Designern, Programmierern und der Qualitätssicherung als Referenz verwendet werden, um sicherzustellen, dass alle Beteiligten einheitliche Gestaltungsprinzipien einhalten.

Beispiel Styleguide

Beispiel: Auszug aus einem Styleguide

Als Format kommt für den Styleguide sowohl eine Druckversion in Frage als auch die Form eines Online-Leitfadens, der sich im Stil einer Website bedienen lässt. Das Online-Format hat den Vorteil, dass die Inhalte leichter aktualisiert und untereinander verlinkt werden können.

Inhaltlich sind im Styleguide sowohl ästhetische als auch funktionale Prinzipien definiert. Hier einige Beispiele:

  • Seitentypen: Welche Grundtypen von Seiten gibt es, für welchen Zweck werden sie eingesetzt?
  • Formularelemente: Welche Elemente werden für welchen Zweck verwendet? Wie werden die Elemente gestaltet?
  • Buttons: Arten von Buttons, Platzierung und Ausrichtung, Reihenfolge von OK und Abbrechen,…
  • Fehlermeldungen: Kategorien von Fehlermeldung, Beschreibung wann welche Fehlermeldung zum Einsatz kommt,…
  • Grafische Eigenschaften: Elemente des klassischen Styleguides, wie zum Beispiel Schriftarten, Schriftgrößen, Farbwerte, Abstände, …

Genauso wichtig wie die Inhalte des Styleguides, ist seine Benutzbarkeit. Nur wer schnell die richtigen Informationen findet, wird den Leitfaden intensiv nutzen. Zur übersichtlichen Gliederung des Leitfadens und zur Gestaltung der Informationsseiten bieten sich so genannte Interaction Design Patterns an. Design Patterns beschreiben zunächst die Sicht des Kunden (Welches Problem versucht der Kunde zu lösen?) und erläutern dann, wie die Lösung des Problems gestaltet wird.

Eine sehr umfangreiche Sammlung an Interaction Design Patterns finden Sie auf den Seiten von Martijn van Welie http://www.welie.com. Nach diesem Muster kann auch der Design-Leitfaden für Ihr Unternehmen gestaltet werden.


„And secondly, you must be a pirate for the pirate’s code to apply and you’re not. And thirdly, the code is more what you’d call „guidelines“ than actual rules.”
Captain Barbossa

Interface Konzept

Leistungen

  • Styleguide für Ihr Unternehmen

    Sie haben bisher noch keinen Styleguide? Ich analysiere die Anforderungen in Ihrem Unternehmen und erstelle das Grundgerüst. Die Inhalte können Ihre Mitarbeiter wahlweise mit oder ohne meine Hilfe einpflegen.

  • Trainings

    Nachdem der Design-Leitfaden vorhanden ist, ist es wichtig, alle Mitarbeiter, die damit arbeiten sollen, zumindest grundlegend in die Thematik einzuführen: Aufbau des Leitfadens und Erläuterung der wichtigsten Elemente.

Verwandte Themen

  • Redaktionsleitfaden

    Nach demselben Prinzip lassen sich Regeln für das Betexten von Produkten aufstellen. In einem Redaktionsleitfaden werden sowohl stilistische Grundlagen als auch Regeln für die Verwendung von Begrifflichkeiten zusammengetragen.