Ähnlich einem Drahtgittermodell in der 3D-Produktion oder einem „Mock-up" in der Gestaltung stellen Wireframes als konzeptionelle Prototypen einer Website die verschiedenen Elemente wie Navigation und Inhaltsbereich abstrakt dar. Je nach Projekt kann der Detailgrad eines Wirframes von sehr oberflächlich bis hin zu ausformulierten Texten und Funktionen reichen. Damit sind Wireframes gut geeignet, um sich bereits in einem sehr frühen Projektstadium ein Bild der Funktionsweisen zu machen, ohne sich in Detail- und Geschmacksdiskussionen zu verlieren.
Verschiedene Arten von Wireframes
Man unterscheidet statische und dynamische Wireframes voneinander. Statische Wireframes sind schematische Darstellungen der Website, die mit wenig Zeitaufwand direkt per Hand gezeichnet oder mit Hilfe eines Tools am Computer erstellt werden können.
Dynamische Wireframes sind interaktiv und bestehen aus mehreren, zu einem Prototyp verbundenen Wireframes. Dies erlaubt es, die Funktion und das Zusammenspiel von Navigation und Inhalt weit vor der technischen Umsetzung zu testen. Abhängig von den darzustellenden Funktionen kann die Erstellung von dynamischen Wireframes viel mehr Zeit in Anspruch nehmen, als es bei der statischen Variante der Fall wäre.
Die Vorteile
Mit Wireframes lassen sich komplexe Informationen wie Klickpfade oder detaillierte Funktionen schnell visualisieren. Durch die abstrakte Darstellung werden die komplexen Vorgänge der späteren Website auf das Wesentliche reduziert, um die eigentliche Idee hinter der Website zu erklären. Dies ermöglicht es allen Beteiligten, bereits vor der Designphase einen konkreten Eindruck der späteren Website zu bekommen. Besonders Kunden, die in der Regel nicht über das nötige Fachwissen verfügen, hilft die visuelle Darstellung der Funktionsweise enorm. Sie können sich die zukünftige Website anhand der Wireframes besser vorstellen und sich dadurch besser in das Projekt einbringen.
5 Antworten
von Fundstücke und Lesenswertes: Wireframes… 25.11.2009 (12:30Uhr) 1.
[...] Website-Projekte mit Wireframes visualisieren Autor: Oliver Annen Quelle: t3n Magazin [...]
von Björn 25.11.2009 (13:46Uhr) 2.
Interessanter Überblick übers Thema Wireframing.
von WD Becvar 27.11.2009 (12:57Uhr) 3.
Hallo,
Toller Artikel, muss inhaltlich voll und ganz zustimmen! Endlich wird das Thema Konzeption von Webprojekten mit Hilfe von Wireframes auch in Deutschland medial aufgearbeitet. Möchte natürlich die Gelegenheit nutzen um auf HotGloo hinzuweisen.
HotGloo ist eine webbasierte Wireframe Anwendung und wurde speziell von Informationsarchitekten für Informationsarchitekten designt um in frühen Projektphasen konzeptionelle Prototypen online zu erstellen.
Vorteile:
webbasiert (daher Plattformunabhängig), hohe Interaktivität, Echtzeit-Kooperation + Chat Funktion, individuelle Template Gestaltung, Simulation verschiedener Zustände mit Hilfe von Status und Viewstacks, PNG/PDF Export und momentan als gratis Betaversion zum Vorab-Test verfügbar.
Wichtig ist auch zu erwähnen, dass wir sehr User fokussiert arbeiten, Feedback sehr ernst nehmen und HotGloo täglich verbessern um die Usability noch stärker in den Mittelpunkt zu rücken.
Wir sich mal einen Überblick verschaffen möchte und HotGloo testen will:
http://www.hotgloo.com
Viel Spaß beim Wireframen!
Gruß,
Wolf Dieter
@HotGloo
von FRONTAND » Archiv » Wirefram… 09.01.2010 (19:02Uhr) 4.
[...] t3n.de gibt es einen guten Artikel zum Thema Wireframes, der Generelles, Vor- und Nachteile [...]
von Linkdump for 02. Februar 2010 Links syna… 03.02.2010 (08:07Uhr) 5.
[...] Ein Bild sagt mehr als tausend Worte: Website-Projekte mit Wireframes visualisieren » t3n Maga... – (Tags: Wireframe dev Webdesign ) [...]