Ga verder naar de inhoud

Wat zijn wireframes en waarin verschillen ze van een grafisch ontwerp?

Wireframes zijn voor veel klanten de eerste visuele voorstelling van hun nieuwe website. Maar wat willen we ermee bereiken (en waarom zijn wireframes zo lelijk)?

Wat is een wireframe?

Wanneer een klant bij ons komt aankloppen, proberen we eerst een algemeen idee te krijgen van wat hij met dit project wil bereiken. Het bepalen van de doelstelling is een belangrijke stap omdat elk doel een eigen aanpak vraagt. Een webshop vergt een andere opbouw dan een overheidswebsite die informatie op een duidelijke manier wil overbrengen. Hoedanook, na het definiëren van het doel ontsnapt geen project aan de befaamde wireframefase.

De wireframefase lijkt voor veel klanten een abstracte fase tussen de briefing en de eerste designs, maar niets is minder waar. Wireframes vormen namelijk de fundering van een website en tonen drie belangrijke zaken:

  • Ze geven een beeld van de informatie die getoond wordt op een pagina
  • Ze tonen op welke manier deze informatie gestructureerd is op een pagina
  • Ze brengen in beeld hoe bepaalde elementen functioneren op een pagina, zowel voor klanten als voor de ontwikkelaars die het geheel later zullen bouwen

Waarom maken jullie wireframes?

Wireframes zijn voor ons een snelle en efficiënte manier om een eerste schets te maken van een online toepassing en na te denken over de informatiearchitectuur achter de website. Informatiearchitectuur is een dure benaming voor welke elementen gelinkt zijn aan elkaar en hoe bepaalde dingen functioneren.

Belangrijk om weten is dat wireframes niet in steen gebeiteld zijn, maar dat ze net voer voor discussie zijn en een klant mee doet nadenken over zijn website. Feedback is cruciaal voor ons. Naarmate wij meer informatie verzamelen, evolueren de wireframes mee met het project.

Nadat we, naar ons gevoel, de wireframes voldoende duidelijk hebben uitgewerkt, vragen we aan de klant om deze wireframes en de structurele opbouw van de website goed te keuren. Dit is een belangrijke fase omdat het zal bepalen hoe de website zal functioneren en hoe onze ontwikkelaars hem zullen bouwen.

Na deze fase kunnen we nog over kleuren en smaken discussiëren in de designfase. Maar zaken zoals de manier waarop bepaalde elementen worden gesorteerd en of er al dan niet een nieuwsoverzicht komt, leggen we wel vast na deze fase.

Waarom zijn wireframes in zwart-wit?

Bij Statik proberen we onze wireframes zonder kleur (zwart-wit dus) en met zo weinig mogelijk vormgeving op te bouwen. Op die manier creëren we weinig afleiding en leggen we de focus op de functionaliteiten en het gebruiksgemak van de website in plaats van lettertypes en andere copy- of designelementen.


Wireframes zijn te vergelijken met het grondplan van een huis waarbij we de indeling bepalen. Designs zijn op hun beurt te vergelijken met een 3D-voorstelling die de gevelsteen en de kleur van de dakpannen toont.

In de designfase zorgen we er voor dat de website visueel bij de klant past door gebruik te maken van brand-kleuren, typografie en andere visuele elementen die helpen om het een logisch geheel te laten vormen.

Hoe kan ik jullie helpen in wireframefase?

Om de wireframefase zo vlot mogelijk te laten verlopen kan je als klant een aantal zaken doen om ons verder te helpen. Het aanleveren van tekstuele content helpt de wireframes vullen met betekenisvolle teksten in plaats van Lorem Ipsum en helpt je nog beter te vatten wat waar zal komen te staan. Teksten kan je als klant later zelf nog altijd aanpassen wanneer de website effectief gebouwd is. Probeer dus niet over elke hoofdletter te struikelen, maar focus op het algemene geheel van welke stukken tekst waar zullen komen eerder dan je copywriter nu al los te laten op de wireframes.

Probeer als klant mee te denken over de functionaliteiten en werking van bepaalde dingen. Een mooi voorbeeld hiervan is een blog. Op welke manier zie je dit graag gesorteerd (chronologisch? thematisch?)? Wil je blogposts in de kijker zetten? Is het noodzakelijk dat de blogpost een auteur krijgt? Gelukkig zijn wij er om je daarin te begeleiden!

Wil je zelf je boomstructuur eens laten snoeien of beroep doen op onze wireframingskills?

Informatie­architect

Wie is Jonas?

Jonas tovert moeiteloos boomstructuren en wireframes uit zijn mouw die focussen op gebruiksgemak. Daarnaast voelt hij zich als huisfotograaf van dienst vooral goed achter de camera.

Volgende blogpost

In 7 stappen naar een contentmarketingstrategie

20 december 2018 | Tim-Oliver

Je hebt een online publiek, een leuk onderwerp en een zorgvuldig uitgewerkte blogpost. En toch krijg je enkel likes van je moeder en een paar vrienden. Klinkt bekend? Dan wordt het tijd dat een contentmarketingstrategie veel meer voor jou wordt dan gewoon een lang woord.