RWD Workflow Step 3 – Wireframe

wireframeKommen wir allmählich zu Schritt 3, dem Wireframe.
In diesem Prozess werden wir nun erstmals einige Elemente der neuen Seite als „Handzeichnung“ skizzieren. Hier geht es noch nicht darum, welchen spezifischen Inhalt man bereitstellt, sondern welche Elemente – wohin geschoben werden.

Aktuelles Wireframe

Damit das einiger Maßen bildlich vorstellbar ist, nehmen wir erst einmal unsere bestehende Webseite als Muster und deklarieren ein paar Blöcke.

Aktuelles Wireframe Opencaching 3.0
Aktuelles Wireframe Opencaching 3.0

Ich hoffe, man erkennt den Aufbau der „Startseite“. Einer der häufigsten Kritikpunkte, die ich aus vielen Gesprächen entnehmen konnte – der dynamische Inhalt bringt keinen Mehrwert. Als man 2005 Webdesign „so dargestellt“ hatte, war das noch „Trend“… und es hieß „alles auf einen Blick“. Heute liebt man es übersichtlicher und funktioneller. Trotz allem braucht man eine „Startseite“, die einen neuen Besucher passend „abholt“ und mit Informationen versorgt.

Schauen wir uns die aktuelle Menüstruktur an, filtern wir mal die Punkte heraus, die einen so genannten „Controller“ darstellen:

oc30menu
Hauptmenu OC 3.0

Die hier gelb markierten Menüpunkte sind die einzigen Controller, die der User an dieser stelle zur Verfügung gestellt bekommt. Knapp 50% der Menüleiste sind externe bzw. administrative Links. Die üblich erwartete Navigation, findet nicht statt. Diese unstrukturierte Weise findet sich in vielen weiteren Punkten wieder.

Was bringt und also nun die RWD-Stufe 3 „Wireframe“ ???

In den kommenden Tagen, werde ich für verschiedene Controller einige Wireframe Schnipsel generieren und damit eine Grundidee für das neue Layout legen. Es wird also jeweils ein Bild geben mit einer Erklärung. Darauf hin werde ich auch nach euren Meinungen fragen und hoffen, dass ihr tatkräftig mit Feedback unterstützt.

Dabei geht es um die Anordnung von Elementen/Blöcken und nicht um die Farbe oder deren Inhalt. Im Beitragsbild, kann man schon leicht erahnen worauf es hinaus geht.

Bleibt neugierig;) Es geht in Kürze wieder weiter.

Hinterlasse ein Kommentar

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