Specialisme · Wireframing
Wireframing: eerst de structuur, dan het ontwerp.
Met wireframes zetten we een pagina of website schematisch neer, zonder kleuren of foto’s. Zo bespreek je met hoofdkantoor, vestigingen en webbouwer eerst wat er moet staan en waar, voordat er ontworpen en gebouwd wordt.
Wanneer
Tijd voor wireframing als…
- je een nieuwe website of vestigingspagina laat bouwen
- discussies over het ontwerp blijven hangen op kleuren en foto’s
- de route van merk naar vestiging niet logisch voelt
- de webbouwer en marketing niet hetzelfde voor ogen hebben
Wat we doen
Van klantreis naar een blauwdruk voor de bouw.
- 01
Klantreis
We brengen in kaart welke stappen een bezoeker zet, van zoekresultaat tot afspraak bij de vestiging.
- 02
Wireframes
Per paginatype maken we een schematische opzet met de elementen die de bezoeker verder helpen.
- 03
Afstemming
We verzamelen feedback en zorgen dat ontwerp en development met dezelfde blauwdruk verder gaan.
Wat wireframing is
Een wireframe is de blauwdruk van een pagina.
Een wireframe is een vereenvoudigde weergave van een website, app of ander digitaal product. Het toont de structuur en indeling: welke blokken er staan, in welke volgorde en hoe groot ze ongeveer zijn. Kleuren, lettertypes en foto’s laat je bewust weg.
Dat maakt het gesprek beter. Je praat over wat de bezoeker nodig heeft en waar het moet staan, niet over de tint van een knop. Zo breng je in kaart welke elementen de bezoeker verder helpen in de klantreis en waar ze moeten komen.
- Wireframe: de structuur en indeling, zonder vormgeving
- Mock-up: hetzelfde, maar met kleuren, beeld en typografie
- Prototype: een klikbaar model waarmee je de werking kunt testen
Wireframing en UX
Wireframing als onderdeel van UX en CRO.
Wireframing is een vast onderdeel van ons UX-werk. Met een wireframe brengen we de structuur van de website en de routes van bezoekers in kaart. Het helpt om feedback te verzamelen en om marketing en development op één lijn te krijgen.
Voor een franchiseformule maken we meestal wireframes voor een paar sjablonen die overal terugkomen: de homepage, de vestigingszoeker, de vestigingspagina en de dienst- of productpagina. Elke vestiging profiteert dan van dezelfde doordachte opbouw, met ruimte voor lokale invulling binnen de merkregels.
Onderdeel van
Elk specialisme werkt voor de hele formule.
Dit specialisme zit in Hybride en On-demand, ingezet voor het merk én voor elke vestiging. Geen franchiseformule, maar wel een vraag? Dan neem je het ook los af.
Andere specialismen
Veelgestelde vragen
Over wireframing.
Wat is het verschil tussen wireframes, mock-ups en prototypes?
Een wireframe toont de structuur. Een mock-up voegt de vormgeving toe. Een prototype is een interactief model waarin je kunt klikken en de werking kunt testen.
Hoe gedetailleerd moet een wireframe zijn?
Gedetailleerd genoeg om de indeling en werking te begrijpen, maar zonder grafische details. De focus ligt op de structuur en de volgende stap voor de bezoeker.
Wie gebruikt wireframes?
Webdesigners, UX-ontwerpers, ontwikkelaars en projectleiders. Bij een formule ook het hoofdkantoor, zodat iedereen hetzelfde beeld heeft voordat de bouw begint.
Met welke tools maak je een wireframe?
Er zijn veel tools, zoals Balsamiq, Sketch, Adobe XD en Miro. Voor het resultaat maakt de tool weinig uit. Het gaat om de keuzes die je erin vastlegt.
Eerst een goed gesprek, dan pas een plan.
In een uur bespreken we waar je staat en welke kansen wij zien. Past het niet, dan zeggen we dat ook.