Hoe begin je met UX design voor een nieuwe website?

Met UX design voor een nieuwe website begin je met gebruikersonderzoek: wie zijn je bezoekers, wat willen ze bereiken en waar lopen ze tegenaan? Pas als je die vragen hebt beantwoord, bouw je stap voor stap van strategie naar structuur naar visueel ontwerp. Dit geldt voor elke website, van een eenvoudige bedrijfssite tot een complexe webshop. In dit artikel beantwoorden we de meest gestelde vragen over het UX design proces, zodat je precies weet waar je moet beginnen.

Wat zijn de eerste stappen in een UX design proces?

Een UX design proces begint altijd met onderzoek, niet met ontwerpen. Je brengt eerst in kaart wie je gebruikers zijn, wat ze nodig hebben en welke doelen de website moet bereiken. Pas daarna werk je van strategie naar structuur naar visuele vormgeving. De visuele laag is altijd de laatste stap, nooit de eerste.

Het UX design proces bestaat ruwweg uit vier onderdelen: gebruikersonderzoek, ervaringsstrategie, interactieontwerp en informatiearchitectuur. Die volgorde is niet willekeurig. Wie begint met kleuren en lettertypes voordat de structuur klopt, bouwt een mooi huis op een wankel fundament.

Praktisch gezien ziet het begin van een UX traject er zo uit:

• Doelstellingen bepalen: wat moet de website bereiken voor de organisatie én voor de gebruiker?
• Gebruikersonderzoek uitvoeren: interviews, enquêtes of observaties om behoeften en pijnpunten te ontdekken.
• Persona’s opstellen: profielen van je belangrijkste gebruikersgroepen op basis van echte data.
• Informatiearchitectuur schetsen: hoe is de website logisch opgebouwd en hoe navigeert een bezoeker erdoorheen?
• Wireframes maken: schematische schetsen van pagina’s zonder visuele afleiding.
• Testen en itereren: prototypes voorleggen aan echte gebruikers en het ontwerp aanscherpen op basis van feedback.

Belangrijk om te weten: UX design is een iteratief proces. Je ontwerpt, test, leert en past aan. Dat begint al bij een eenvoudige schets op papier en wordt steeds concreter naarmate het project vordert. Dit stappenplan voor UX design Deze link opent in een nieuw tabblad beschrijft hoe je van paper prototype naar lo-fi en hi-fi wireframes werkt.

Wat is het verschil tussen UX design en UI design?

UX design gaat over de totale gebruikerservaring: de structuur van de website, de logica van navigatie en de route die een bezoeker aflegt. UI design gaat over de visuele en interactieve laag: kleuren, typografie, knoppen en iconen. Kort gezegd: UX bepaalt hoe de website werkt, UI bepaalt hoe de website eruitziet.

Een handige metafoor: UX is de plattegrond van een gebouw, UI is de inrichting en de verfkleuren. Beide zijn nodig, maar de plattegrond komt altijd eerst. Een UX designer denkt na over gebruikersstromen en informatiearchitectuur. Een UI designer werkt daarna de visuele details uit.

De twee disciplines zijn onlosmakelijk verbonden. Een prachtig visueel ontwerp heeft weinig waarde als de navigatie onlogisch is of het formulier te lang is. Omgekeerd kan een goed doordachte structuur alsnog mislukken als knoppen onleesbaar zijn of het kleurcontrast tekortschiet. Onlogische stappen en onduidelijke navigatie zijn UX problemen; slechte leesbaarheid en rommelige lay-outs zijn UI problemen.

Voor SEO zijn beide relevant. UX design beïnvloedt metrics als verblijftijd en bouncepercentage, terwijl UI design bijdraagt aan leesbaarheid en contentconsumptie. Google gebruikt deze signalen om de kwaliteit van een website te beoordelen, zoals dit overzicht van UX en UI verschillen Deze link opent in een nieuw tabblad uitlegt.

Hoe breng je de doelgroep in kaart voor UX design?

Je brengt de doelgroep in kaart door kwalitatief en kwantitatief onderzoek te combineren. Kwalitatief onderzoek, zoals gebruikersinterviews, brengt behoeften, doelen en pijnpunten aan het licht. Kwantitatief onderzoek staaft die inzichten met data over gedrag en trends. Op basis daarvan maak je persona’s: gedetailleerde profielen van je belangrijkste gebruikersgroepen.

Een persona is geen verzonnen karakter. Het is een semi-fictief profiel dat is opgebouwd uit echte onderzoeksdata. Een goede persona bevat motivaties, pijnpunten, gebruikspatronen en een achtergrondverhaal. Dat maakt het concreet genoeg om designbeslissingen op te baseren. Gebruik je aannames in plaats van data, dan ontwerp je voor een gebruiker die niet bestaat.

Naast persona’s is de customer journey een krachtig hulpmiddel. Die laat zien welke stappen een bezoeker doorloopt van eerste contact tot conversie, en waar die stappen stroef verlopen. Andere effectieve methoden voor doelgroeponderzoek zijn:

• Gebruikersinterviews: 1-op-1 gesprekken om diepgaand inzicht te krijgen in gedrag en verwachtingen.
• Card sorting: gebruikers sorteren informatiecategorieën op kaarten, zodat je ziet welke structuur voor hen logisch is.
• Enquêtes: schaalbaar onderzoek om patronen te bevestigen of te weerleggen.
• Analytics analyse: bestaande websitedata als startpunt voor het begrijpen van gebruikersgedrag.

Persona’s zijn geen eenmalig product. Ze worden gedurende het project bijgesteld naarmate je meer leert over je gebruikers. Ze vormen een levend kompas voor alle designbeslissingen die volgen.

Wat is een wireframe en waarom is het belangrijk?

Een wireframe is een schematische schets van een webpagina die de structuur en indeling van elementen weergeeft, zonder visuele uitwerking. Denk aan een plattegrond van een huis: je ziet waar de kamers komen en hoe je van de ene naar de andere loopt, maar nog niet welk behang er aan de muur hangt. Wireframes zijn altijd in grijstinten en focussen op functie, niet op vorm.

Wireframes zijn belangrijk omdat ze je dwingen om vroeg na te denken over navigatie, gebruikersstromen en de plaatsing van content. Fouten in de structuur zijn in een wireframe snel en goedkoop op te lossen. Dezelfde fouten ontdekken tijdens de bouwfase kost aanzienlijk meer tijd en geld.

Er zijn twee varianten die je in de praktijk tegenkomt:

• Lo-fi wireframes: ruwe schetsen, soms met pen en papier, die de grove indeling vastleggen. Snel te maken, ideaal voor vroege feedback.
• Hi-fi wireframes: gedetailleerde digitale versies die al dicht bij het uiteindelijke ontwerp liggen, maar nog zonder werkende functionaliteiten.

Na wireframes volgen prototypes. Die voegen interactiviteit toe: een gebruiker kan klikken en de website simuleren alsof die al live is. Prototypes zijn het ideale testobject voordat er ook maar één regel code is geschreven. Meer over de rol van wireframes in het ontwerpproces Deze link opent in een nieuw tabblad lees je hier. Bij Stuurlui vormen uitgewerkte wireframes de basis voor het visuele design, zodat structuur en functie altijd voor esthetiek komen.

Hoe test je een UX design voordat de website live gaat?

Je test een UX design door het prototype voor te leggen aan echte gebruikers uit je doelgroep en te observeren hoe zij ermee omgaan. Dit heet usability testing. Je hoeft niet te wachten tot de website klaar is: testen op een prototype is juist waardevol omdat aanpassingen dan nog eenvoudig zijn.

Usability testing is een individueel, 1-op-1 onderzoek waarbij de deelnemer hardop denkt terwijl hij taken uitvoert. Jij observeert waar iemand aarzelt, vastloopt of een andere route kiest dan verwacht. Die observaties zijn goud waard, want ze laten zien waar het ontwerp niet aansluit bij de mentale verwachtingen van de gebruiker.

Naast klassieke usability tests zijn er andere methoden die je kunt inzetten:

• Heatmaps: visuele weergave van waar gebruikers klikken, bewegen en scrollen op een pagina.
• A/B testen: twee versies van een pagina of element vergelijken om te zien welke beter presteert.
• Tree testing: gebruikers navigeren door de menustructuur om te controleren of ze informatie snel kunnen vinden.
• Card sorting: ook bruikbaar als validatiemethode nadat je een eerste informatiearchitectuur hebt opgesteld.

Een praktische tip: test niet de hele website in één keer. Kies een specifiek onderdeel, werk dat goed uit in een prototype en test dat grondig. Te veel tegelijk testen maakt de resultaten onoverzichtelijk. Kwalitatieve methoden vertellen je waarom iets niet werkt; kwantitatieve methoden zoals heatmaps en analytics vertellen je hoeveel mensen er last van hebben. Beide heb je nodig voor een compleet beeld.

Wanneer schakel je een UX designer in voor je website?

Je schakelt een UX designer in zodra je een nieuwe website bouwt, een bestaande website ingrijpend verbetert of merkt dat bezoekers niet doen wat je verwacht. Hoe eerder in het project, hoe meer waarde een UX designer toevoegt: problemen die in de ontwerpfase worden ontdekt, zijn veel goedkoper op te lossen dan problemen die pas na de lancering opduiken.

Websites met veel gebruikersinteracties, zoals webshops, ledenportalen of aanvraagformulieren, profiteren het meest van een grondige UX aanpak. Maar ook voor een informerende bedrijfswebsite loont het: een duidelijke structuur en logische navigatie verlagen de drempel voor bezoekers om contact op te nemen of een offerte aan te vragen.

Bij kleinere budgetten is een UX designer die ook UI werk aankan vaak de meest kosteneffectieve keuze. Grotere organisaties met complexe projecten huren vaker beide specialisten afzonderlijk in. Wat betreft tarieven: een freelance UX designer in Nederland rekent doorgaans tussen de 50 en 125 euro per uur, afhankelijk van ervaring en specialisatie. Een bureau biedt naast UX ook UI en development expertise onder één dak, met gestructureerde processen en meer schaalbaarheid.

Twijfel je of je eerst een volledig redesign nodig hebt? Laat een UX designer dan beginnen met een audit van je huidige website. Zo breng je de grootste knelpunten in kaart voordat je beslist hoe groot de ingreep moet zijn. Slechte UX heeft namelijk directe gevolgen: hogere bounce rates, lagere conversies en een slechtere positie in Google, omdat zoekmachines gebruikerservaring zwaar meewegen in hun beoordeling.

Een goed UX ontwerp is geen kostenpost, maar een investering die je terugverdient in betere resultaten en minder correcties achteraf. Wil je weten wat een doordachte UX aanpak voor jouw website kan betekenen? Neem contact op met Stuurlui voor een vrijblijvend gesprek.