Inhoud

Van idee tot wireframe

17/10/2022
Deel deze blog

Bij Websitebezorgd werken we met wireframes. Een wireframe is een schematische tekening van de indeling van een website. Zo’n tekening gebruiken we om de vereiste onderdelen van een website te bepalen en om de globale indeling vast te leggen. In dit artikel volgen we het proces van idee tot wireframe dat wij samen met jou, de klant, doorlopen.

Stap 1: In gesprek

Bij ons is het gesprek altijd de eerste stap. Samen met jou bespreken we tijdens een wireframing sessie welke onderdelen er op jouw nieuwe website moeten komen. We beginnen bij het begin: wat is jouw missie en visie? Wat is het verhaal dat jij als ondernemer wil vertellen? Pas wanneer we een antwoord op deze vragen hebben geformuleerd, komen we verder.

Wanneer we weten waar jij als ondernemer voor staat en wat je wil bereiken, gaan we kijken naar hoe we jouw verhaal kunnen vertalen naar een website. Dit is het meer praktische gedeelte, waarbij we de onderdelen die op het wireframe moeten komen bepalen. We luisteren naar jouw ideeën en bekijken de content die je wellicht al hebt klaarliggen van een oudere website. Omdat wij de nodige ervaring hebben met het bouwen van websites, kunnen we je ook aanbevelingen doen. Je kunt niet alles weten, dus misschien zie je wel iets over het hoofd. Dit kunnen wij dan opmerken. Ook wanneer je juist geen idee hebt wat je wilt vertellen en hoe je dat gaat doen, geven wij je de begeleiding die je nodig hebt. Zo komen we uiteindelijk tot een overzicht van de content die de nieuwe website moet bevatten.

Stap 2: Aan de slag

Nu is het aan ons en gaan wij aan de slag met het maken van een wireframe. Op basis van het overzicht dat we tijdens de wireframing sessie samen met jou, de klant, hebben gemaakt, zetten we het wireframe in elkaar. We gaan op zoek naar een indeling die aan jouw wensen voldoet en waarin alle besproken content onderdelen een plek krijgen. Ook maken we het ontwerp zo gebruiksvriendelijk mogelijk en houden we de ervaring van de website als geheel in het oog. Zodoende komen we tot een wireframe dat de indeling van de nieuwe website schematisch weergeeft. Hieronder geven we een voorbeeld van hoe zo’n wireframe er ongeveer uit komt te zien. Dan weet je wat je kunt verwachten. 

Afbeelding 1: Voorbeeld van een wireframe

Zoals je ziet is het wireframe heel schematisch en zegt het alleen iets over de indeling van jouw nieuwe website. Teksten, kleuren en lettertypen zijn nog onbepaald. Het logo, de huisstijl en de lay-out zullen pas later in het proces worden ontworpen en toegevoegd. Ook de content bestaande uit afbeeldingen en teksten komt pas later aan de orde. 

Stap 3: evaluatie en feedback

Wanneer we klaar zijn met het ontwerp van het wireframe, nemen we contact met jou als klant op. We sturen je het ontwerp, zodat je het alvast kunt bekijken. Vervolgens plannen we een tweede gesprek waarin we het wireframe samen kunnen bespreken. In dit gesprek evalueren we het ontwerp en vragen we jou om feedback. Wanneer je opmerkingen of vragen hebt, is daar de ruimte voor. Als er bepaalde dingen zijn die je liever anders wilt, passen we die aan in het wireframe. Wanneer je grotere veranderingen wilt doorvoeren, is het mogelijk dat we een nieuw ontwerp maken. We gaan dan terug naar stap 1 en gaan opnieuw met je in gesprek over wat je precies wilt vertellen en bereiken met je website. Daarop volgt dan een volledig vernieuwd wireframe. 

We gaan er natuurlijk vanuit dat het opnieuw doorlopen van het hele proces niet nodig is en dat je, eventueel na een paar kleine aanpassingen, tevreden bent. In onze ervaring is dit meestal wel het geval, aangezien we gedurende het hele proces uitgebreid contact met onze klanten hebben. Daarom weten wij als websitedesigners precies wat jij wil. 

Als de evaluatie is voltooid en de feedback is verwerkt, kunnen we verder naar de volgende stap in het designproces. Het idee dat eerst in jouw hoofd zat, is nu vertaald naar een wireframe. 

Bij vragen, tips of opmerkingen neem dan gerust contact op!

 


Verder lezen.