Wireframing

Was ist ein Wireframe?

Ein Wireframe ist im Grunde eine Skizze einer Website. Du kannst Wireframes als „nackte“ Prototypen zukünftiger Webseiten ansehen. Wie „nackt“ dieser Prototyp ist, hängt jedoch von deinen Wünschen und dem Wireframer ab. Wenn eine Website-Skizze bereits viele Details enthält, sprechen wir von einem „High Fidelity“-Wireframe. Wenn sie weniger Details enthält, handelt es sich um einen „Low Fidelity“-Wireframe. Mit „Fidelity“ wird also gemeint, wie realistisch die Skizze das Endprodukt darstellt.

Ein Wireframe enthält normalerweise keine Farben. Es geht vor allem darum, klar zu machen, welche Elemente an welchen Stellen platziert werden sollen. Was diese Elemente genau sind, muss ebenfalls verdeutlicht werden. Ohne weitere Kontextinformationen muss zum Beispiel sofort erkennbar sein, was ein Button ist. Bilder werden häufig durch ein Feld mit einem Kreuz symbolisiert, und bei Videos steht oft ein Play-Button. Es wird bereits auf die wichtigsten Prinzipien des Visual Designs geachtet:

• Alignment (Ausrichtung)
• Proximity (Nähe)
• Repetition (Wiederholung)
• Contrast (Kontrast)

Die Vorteile einer Website-Skizze

Indem man Website-Skizzen erstellt, kann bereits vor der endgültigen Produktion der Website ein gutes Bild des Designs und der Struktur entstehen. An diesem Punkt kann Feedback noch leicht eingearbeitet werden. Es ist wichtig, dieses Feedback schnell zu integrieren und zeitnah mit neuen Wireframes zurückzukommen, um Rapid Prototyping in der Praxis umzusetzen.

Das Designen wird ebenfalls einfacher, wenn bereits ein Wireframe existiert. Der Designer kann sich dann ganz auf das Aussehen der Seiten konzentrieren und muss sich weniger Gedanken über die Positionierung der Elemente und andere Aspekte machen, die bereits im Wireframe definiert wurden. Ein Wireframe fungiert also gewissermaßen als das „Skelett“ der Seite, das die Layout-Struktur darstellt. Natürlich kann es sein, dass der Designer aus ästhetischen Gründen Änderungen an der Anordnung der Seite vornimmt. Solange dies in Absprache mit dem Wireframer geschieht, ist das kein Problem.