De structuur van je website
Wireframing,
een sterk prototype
We ontwikkelen interactieve wireframes om de lay-out van de website te visualiseren. In deze fase denken we na over welke content en functionaliteit op welke positie moet staan. Ook navigatie en actie krijgen vorm. Het prototype geeft een zeer realistisch beeld van de te ontwikkelen website.
We gebruiken in de wireframes zoveel mogelijk ‘echte’ teksten (geen lorem ipsum) om het beeld zo realistisch mogelijk te maken. We ontwikkelen de schermen in zowel een mobiele als een desktop variant.
Volledig interactief prototype
Samenwerking via Figma
Heldere visualisatie van het concept
Geeft structuur aan de ideeën
Uitstekende basis voor een sterk visual design
Overzicht
Eerst structuur, dan design
De grootste meerwaarde van een wireframe is dat het de functionele structuur glashelder maakt. We gebruiken in deze fase geen kleur, vorm, logo’s en beeldmaterialen. Daardoor ligt de volledige focus op de gebruikservaring. Het interactieve prototype stelt alle betrokkenen vroeg in het proces in staat om te beoordelen of de gebruikersstromen, informatiehiërarchie en interactiepatronen kloppen.
Een wireframe fungeert als de technische en inhoudelijke ‘bouwtekening’ van je site. Het zorgt ervoor dat je eerst de juiste dingen bouwt, en pas daarna die dingen mooi maakt. Dat bespaart aanzienlijk in tijd en geld gedurende de ontwikkeling van de website. aanpassingen in een wireframe zijn snel uitgevoerd, eenmaal in de developmentfase is de impact van een wijziging veel groter.
Nadat de structuur is vastgelegd, ligt de basis voor het visual design.
Bekijk hier het wireframe van de website van Sturdy Digital. Een goed voorbeeld van wat je kunt verwachten
Hoe komen wij tot een werkend wireframe?
In de discovery fase stellen we vast wat de belangrijkste doelgroepen en doelen per paginatype zijn. En welke content en functionaliteit we hiervoor nodig hebben. Daarnaast ontwikkelen we een plan voor navigatie en een zoekfunctie.
We werken per pagina of paginatype uit welke content en functionaliteit wordt aangeboden. In het interactieve prototype is goed te testen of de pagina succesvol zal zijn. SEO- en advertising specialisten kunnen in deze fase meekijken om input te leveren voor een optimale opzet. Daarmee wordt het wireframe vergaand geoptimaliseerd, nog voordat we gaan bouwen.
We hebben het afgelopen jaar intensief samengewerkt met Sturdy Digital voor de bouw van onze nieuwe WordPress-website, en we zijn ontzettend tevreden met het resultaat.
Onze grootste uitdaging was het structureren van een grote hoeveelheid kennis die voorheen versnipperd en moeilijk vindbaar was. Sturdy Digital heeft ons niet alleen geholpen met het opzetten van een gebruiksvriendelijk kenniscentrum, maar ook met het samen uitdenken van een duidelijke taxonomie. Dat heeft enorm bijgedragen aan overzicht en toegankelijkheid.
Het proces was zeer prettig: er werd goed meegedacht, ideeën werden serieus genomen en samen hebben we ervoor gezorgd dat alle wensen in het eindproduct terechtkwamen. Gezien de complexe structuur was dit geen eenvoudige klus, maar Sturdy Digital pakte dit professioneel en creatief aan.
Daarnaast biedt de nieuwe website ons veel vrijheid om zelf aanpassingen te doen en verder uit te bouwen. Ook na livegang blijft de samenwerking top: bij vragen of bugs reageren ze snel en adequaat.
Kortom: een betrouwbare partner die meedenkt, flexibel is en kwaliteit levert. Aanrader!
Bodhi Lepelaar
Dutch Green Building Council
Bodhi Lepelaar
Deliverables
Wat krijg je?
Aan het eind van de wireframefase ontvang je:
- Een volledig en interactief prototype zoals in dit voorbeeld
- Uitgewerkt op mobile als op desktopschermen
