Mit Wireframes können auch Marketing-Menschen ihre online Business-Ideen sehr schnell skizzieren und in Mock-ups festhalten. Es gibt Tools für die Mock-ups, aber Powerpoint tut es auch. Von der Konzeption geht der Mock-up anschließend in das Design und falls nötig in die Entwicklung für die einzelnen Funktionen. Das Design wird später im CSS geschrieben und umgesetzt. Der Wireframe ist also eine Konzeption, die Grundlage für Neues.

Wozu braucht man Wireframes?
Meist braucht man Wireframes für Mockups von neuen Webseiten oder Apps. Dabei können sie entweder für die Ideenpräsentation verwendet werden (z.B. gegenüber Investoren, Business Angels) oder sie sind die konzeptionelle Grundlage für die Umsetzung der Agentur/ Designer/ Programmierer.Worin liegen die Vorteile von Wireframes?
Der Vorteil liegt darin, dass jemand ohne Programmieraufwand einen Prototypen erstellen kann. Er braucht keine neuen Programme für den Mock-up und kann sich auf seine konzeptionellen Fähigkeiten konzentrieren. Gleichzeit wird die Idee konkret und bei Partnerschaften finden sich unterschiedliche Denkansätze wieder, die in bisherigen Diskussionen nur unspezifisch geäußert wurden.Welches Programm sollte ich für Wireframes verwenden?
Ich lege die Wireframes mit Powerpoint(ppt) an, damit bin ich sehr flexibel. Noch ein Grund gegen ein spezielles Tools: Die Tools haben vorgegebene Felder und Optionen. Ich will aber nicht Dinge genauso schlecht machen, wie sie schon immer sind, sondern besser! Also baue ich die Seite mit mehr Logik auf und stelle viele klassische Eigenschaften und Funktionen in Frage. Wie muss ein “Dialog-Fenster” aussehen? Das heißt aber nicht, das man das Rad jedes mal neu erfinden muss. Die Usability ist das A und O. Wenn der User ein bestimmtes Verhalten gelernt hat, sollte man ihm das so weiterhin erlauben – revoluzen sie nur, wenn es sei genial ist.

Wireframes erfordern Denkleistung – Überlegen bis der Schädel raucht!
Ist im Wireframe alles abgedeckt? Auch wenn der User nicht den vorgedachten Weg wählt, sich ausloggen möchte oder wieder einen Schritt zurück möchte? Ich mag es nicht, wenn mir Fehler erst dann auffallen, wenn ein Entwicklungsteam sich daran setzt. Klar gibt es viele Punkte, die erst beim Programmieren auffallen, aber wer am Anfang viel bedenkt, beschleunigt die Umsetzung. Das Konzept ist noch billig, Fehler in der Entwicklung hingegen teuer. Die genaue Größe der Seite ist übrigens nicht so wichtig, weil es nur um die Struktur geht.

Worauf sollte ich beim Wireframe achten?
Meine Regeln sind: keine Farben, keine Bilder. Graustufen zeigen an wo die Aufmerksamkeit des Users liegen soll. Weiß ist dann beispielsweise die untere Navigationsleiste, während ein Schwarz einen “Kaufen-Button” darstellt. Der Webdesigner, kann später genau sehen, was wichtig ist. (Dieses Graustufen-Konzept hat eine Dame erfunden, deren Artikel ich gerade nicht wiederfinde.)

Wireframes zeigen schnell Hürden auf.
Einmal bekam ich die Vorgaben für einen neuen “eShop” eines Vertriebsteam, darin waren die wichtigsten Punkte für die Startseite aufgelistet. Die Liste umfasste schätzungsweise 40 Punkte. Zur Demonstration habe ich sie alle auf den Mock-up der ersten Seite eingebaut und sie ins anschließende Meeting mitgenommen. Das Team konnte sehen, dass es zu viele Punkte waren und wir haben gemeinsam die Inhalte eingeschränkt. Am Ende waren nur noch die wichtigsten Punkte übrig blieb. Hätte ich von Anfang an gesagt, dass es nicht möglich wäre alle Punkte zu zeigen, hätte es möglicherweise zu größeren Reaktanzen geführt. In diesem Fall sagte ein Bild eben doch mehr als 1000 Worte.

 

Kommentare sind geschlossen