Vom Wireframe zur Website

Warum Wireframes in der Konzeptphase unverzichtbar sind

Zur Planung von Internet- und Intranet-Projekten ist die Klärung der Anforderungen an die Benutzerführung im Vorfeld von besonderer Bedeutung. Es muss dabei festgelegt werden, wie die Besucher über die Seiten navigieren und welche Elemente (Bilder, Texte, Icons, Links) im Fokus des Betrachters stehen sollen.

Was sind Wireframes?

Wireframes (Drahtgitter-Modelle) bilden diese Elemente auf einer sehr abstrakten Ebene ohne konkrete Inhalte (ohne Fotos, Farben und Formen) ab. Da Wireframes unkompliziert zu erstellen sind, erhält man bereits vor der Design-Phase einen Eindruck davon, wie die fertige Anwendung (Website, Web-Applikation, TYPO3-Projekt) später funktionieren soll.

Wireframes

Wireframes lassen sich in einem ersten Entwurf schnell zu Papier bringen

Wie erstellt man Wireframes?

Die augenscheinlich einfachste Möglichkeit: Papier und Bleistift. Diese Art eignet sich aber nur bei einfachen Anwendungen. Sobald viele Seiten und Anwendungsfälle mit Wireframes umgesetzt werden sollen, sollten Sie ein darauf spezialisiertes Tool verwenden (z.B. Axure oder OmniGraffle). Dabei können Sie auf Bibliotheken mit Standard-Elementen (z.B. Input-Felder, Selectboxen, Buttons, Bild-Elemente, Text-Elemente) zurückgreifen und die Wireframes strukturiert per Drag & Drop erstellen.

Axure

Axure ist ein interaktives Wireframe Tool für Webseiten und Apps

Wireframes helfen bei der Anwendungsplanung

Dies ist im Grunde auch schon der Haupt-Vorteil von Wireframes: In der Konzeptionsphase werden üblicherweise alle Funktionen der geplanten Anwendung in einer Anforderungsdokumentation (Requirement-Dokument) festgehalten. Die Funktionen vollständig und logisch zu beschreiben erfordert in einem solchen Textdokument ein hohes Maß an Genauigkeit und technischem Verständnis. Mit Wireframes haben Sie im Planungsteam die Möglichkeit, die Anforderungen mit dem Benutzerführungskonzept abzugleichen und die daraus resultierenden Rückschlüsse in das Requirement-Dokument einzuarbeiten.

Wireframes helfen dem ganzen Projektteam

Technische Requirements sind bisweilen sehr komplex. Sie als Auftraggeber sind aber möglicherweise kein Experte für Programmierung, Datenbank-Konzeption und System-Administration. Wireframes dienen als optische Brücke, mit deren Hilfe Sie die Funktionen besser beurteilen können. Daher sollten umfangreiche Requirements unbedingt mit entsprechenden Wireframes ergänzt werden.

Wireframes beschleunigen den Designprozess

Sind erst einmal alle Funktionen und Elemente mit Wireframes visualisiert, kann das Design auf dieser Grundlage zügig und konsequent umgesetzt werden. Diskussionen um bestimmte Funktionen haben Sie ja bereits im Vorfeld klären können.

Zusammengefasst ergeben sich folgende Vorteile

  • Erleichtert die Reflexion bei der Anwendungskonzeption
  • Beschleunigt den Designprozess
  • Vermittelt in einer frühen Phase die genauen Funktionen der Anwendung
  • Hilft, die Requirements besser zu verstehen („optische Brücke“)

 

 

 

 

 

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.