Februar 26, 2015 •Admin
Zugegeben: Dieser Blogbeitrag hat mit Roman und Film wenig zu tun, denn Dinge wie Kabelbinder sind in einer Internetagentur wie HDNET üblicherweise nur an den Strippen im Serverraum zu finden. Es geht vielmehr darum, warum es sinnvoll ist, Wireframes und dergleichen in Graustufen zu erstellen.
Wireframe, Mockup, Clickdummy – das sind Begriffe dafür, wie ein Website-Konzept visualisiert werden kann. Bei HDNET erstellen wir z. B. häufig Clickdummys. Sie dienen zum einen als Bauplan und Designgrundlage und können zum anderen für Usability Tests eingesetzt werden. Mindestens genauso wichtig sind sie, um mit unseren Kunden gemeinsam zu überprüfen, ob alle relevanten Inhalte und Funktionen berücksichtigt wurden und sich „smooth“ in das Gesamtkonzept eines Online-Projekts einfügen. Das funktioniert sowohl bei der Planung eines Relaunches als auch, wenn im Rahmen der kontinuierlichen Weiterentwicklung einzelne Bereiche optimiert oder hinzugefügt werden sollen.
Nutzer und Struktur stehen im Fokus
Ein Clickdummy lässt sich entweder bereits mit ersten Designelementen und Farben versehen, um einen realistischeren Eindruck über die spätere Umsetzung zu erhalten, oder aber ganz rudimentär in schwarz auf weiß anlegen. Unter anderem aufgrund folgender Frage entscheiden wir uns in der Regel jedoch für Graustufen:
„Würde das Element nicht in einer anderen Farbe besser aussehen?“
Die Antwort darauf: Gut möglich, jedoch sollten wir das erst in der Designphase diskutieren. Farben ziehen naturgemäß die Aufmerksamkeit auf sich und fast jeder hat dazu eine Meinung. Damit wir uns auf Struktur und Funktionsumfang konzentrieren können, trennen wir Konzeption und Design zunächst voneinander. So erstellen wir gemeinsam mit unseren Kunden eine fundierte Basis für das Projekt und können die darauf folgende Phase voll und ganz der Gestaltung widmen.
Graustufen werden in der Konzeption darüber hinaus zur Konversionsoptimierung eingesetzt. Die sogenannten Niehaus-Wireframes (nach der Designerin Sandra Niehaus benannt), nutzen verschiedene Grautöne, um Elemente unterschiedlich zu gewichten. Es gilt: je dunkler, desto relevanter. Bereits in einem frühen Stadium kann somit festgelegt werden, wie der Nutzer optisch zu einem definierten Ziel gelenkt werden soll. Das hilft auch dem Designer, der sich auf die Gestaltung konzentrieren kann, ohne erst die Nutzerwege erarbeiten zu müssen.
Schwarz-weiß und Graustufen im Vergleich
Fazit
50 Graustufen sind beim Prototyping sicher etwas übertrieben, aber um die fünf dürfen es schon sein. Das Ergebnis sind fokussierte Wireframes mit klar definierten Strukturen. Zitat eines Kunden: „Gut fand ich im Nachhinein, dass wir die Zeit in den konzeptionellen Aufbau am Anfang investiert haben. Dadurch ist etwas entstanden, was sich sehr vom Wettbewerb abhebt.“