Waarom een effectieve website begint met een goed Interactie design

Interactiedesign, wireframes, prototypering en de praktijk

Enerzijds is er al veel over gezegd en geschreven. Ook op websites als Frankwatching komen thema's als wireframes, prototyping en interactie modellen veelvuldig aan bod, maar helaas hebben de meeste webbureaus totaal geen idee waar je het over hebt.

In de praktijk wordt er meestal uitsluitend gedacht van de "beperkingen" van het eigen cms of te gebruiken open-source CMS, beschrijft men de wensen van de klant in een document dat meestal ook dienst doet als offerte en gaat vervolgens de webdesigner aan de slag met "kleuren".

Interactie? Hoezo? Procesmatig werken van concept, doelstellingen, propositie naar functioneel ontwerp, interactie/wireframes en dan pas "ontwerp" is of teveel werk of men heeft deze kennis gewoon niet in huis. Als je erover begint, krijg je snel zoiets terug als: "Maar we kunnen toch gewoon lekker gaan bouwen en vormgeven?"

Doorgaans heeft men bij de grotere bureaus wel degelijk kennis van zaken en zal het kleinere bureau wijzen op het budget. Maar zelfs bij een kleiner budget is het mijns inziens essentieel en ook relatief gemakkelijk en uiteindelijk kostenbesparend om een interactie ontwerp te maken.

Wat zijn dan de voordelen van Interactie design en wireframes?

1. Effectiviteit en gebruiksvriendelijkheid gewaarborgd

Een interactie model zorgt ervoor dat in alle stappen van het bouwproces de gebruiksvriendelijkheid en effectiviteit van de site gewaarborgd is.

2. Verwachtingen van klant managen

In de praktijk wordt er vooral veel geschreven. Doelen, inhoud, functionaliteiten, structuur en soms deels de navigatie worden allemaal netjes in een functioneel ontwerp document en/of offerte beschreven. Deze vaak dikke documenten, die zeker nodig zijn, geven een klant echter geen beeld en gevoel bij wat er wordt gecreeerd. In wireframes daarentegen kan de klant daadwerkelijk zien hoe de navigatie eruit kan komen te zien, waar tekst en plaatjes komen te staan en hoe complexere zaken als bestel-, registratie en orderprocessen verlopen. Daarmee manage je de verwachtingen bij de klant en komt deze niet voor verrassingen te staan als je al in het bouwproces zit.

3. Nieuwe inzichten voor functioneel ontwerp

Een functioneel ontwerp (FO) beschrijft de functionele en technische werking van de website. Dat is op zich prima, maar als je de beschrijving uittekend, zul je vaak zien dan er niet logische onderdelen in zitten. Juist door het te visualiseren in een interactie ontwerp en wireframes kun je het FO aanscherpen en verbeteren. Vergeet daarbij niet dat een wireframe ook voor de programmeur een helder beld schetst en ook deze vanuit zijn expertise met nuttige vragen en opmerkingen terugkomt.

4. En dan de vormgever of de "make-up" zoals ik het graag noem

Juist met goedgekeurde wireframes kan de vormgever vorm geven aan de inhoud, zonder dat hij zich verder druk hoeft te maken over navigatie en usability. Hij of zij moet vooral een aansprekend ontwerp aanleveren consistent zijn in het doorvoeren van de huisstijl. Simpel gezegd: Als een link blauw is, maak hem dan overal in het ontwerp blauw.

Conclusie: Interactie ontwerp is de spil in een internet project

Zoals je hierboven al kon lezen, komen feitelijk alle disciplines en personages rond een Internet project samen rond het interactie ontwerp. Omdat het een uitbeelding van de beschreven wensen en eisen is, kan elke discipline er ook direct iets van begrijpen.

Uiteindelijk betekent het dat je tot een soepel lopend project komt wat bovendien aan het einde van de rit minder tijd en moeite kost, omdat onnodige iteratieslagen achterwege blijven en er veel minder "correcties" hoeven worden doorgevoerd. Waarmee overigens niet gezegd is, dat je daarmee alle iteraties wegwerkt. Als een internet project eenmaal online staat, zullen  er zeker verbeteringen mogelijk zijn.