Een website moet altijd beschikken over een duidelijk doel, zoals mensen informeren of het laten aanschaffen van een product. Zonder een duidelijke funnel raken gebruikers al gauw de weg kwijt en plots hebben ze je website afgesloten. Niks is meer zonde dan een bezoeker uit de winkel zien vertrekken zonder iets aan te kopen, dus dit willen we voorkomen.
Met dit in gedachte wordt elke website dusdanig opgebouwd om dit doel te bereiken. Voordat je dan ook begint met het ontwerpen van een website moet je voor jezelf dus duidelijk vaststellen wat het doel is van jouw website. Wil je dat mensen terecht kunnen op jouw website om informatie te lezen of moeten ze er een product kunnen kopen? Waar wil je ze naartoe sturen en waar begin jij dit pad voor hun?
Doelgroep
Denk naast het doel van je website ook goed aan de doelgroep waarmee je in contact probeert te komen. Veel van de styling kan hierop gebaseerd worden. Wat spreekt hen aan qua design en wat zijn triggers voor deze gebruikers? Dit alles kan een grote rol spelen wanneer je op de meest effectieve manier je doelgroep wil bereiken, probeer dit dan ook goed voor jezelf vast te stellen voordat je aan een design van de website begint.
Website functionaliteiten vaststellen
Pas wanneer je het doel van de website vastgesteld hebt kan je gaan nadenken wat de website eigenlijk allemaal moet kunnen. In deze functionaliteiten lijst die opgebouwd moet worden is er een onderscheid in “must haves” en “should haves”. Dit stamt uit een UX-design methodiek genaamd de “MoSCoW-methode”, waar je hier meer over kan lezen. Dankzij deze methode creëer je een duidelijk beeld hoe de website opgebouwd moet worden en waar later ruimte voor open gelaten moet worden. Zonder een goede functionaliteiten lijst en een duidelijke doelgroep is het bouwen van een goede funnel erg lastig.
Website ontwerp
In de bovenstaande alinea’s hebben we besproken wat belangrijke voorbereidende stappen zijn van een goed design. Wanneer deze stappen zijn uitgevoerd gaan we kijken naar het maken van het daadwerkelijke design.
Wireframe opbouw
Voordat alle afbeeldingen, kleuren en stijlelementen worden toegevoegd in een design document wordt er eerst gewerkt aan een wireframe document. Wat komt waar te staan, waarom komt het daar te staan en wat moet het kunnen? Een uitgebreid wireframe document maakt het inzichtelijk hoe de gebruiker door de website moet navigeren. Ook bespaard een wireframe een hoop development uren, het verslepen van een aantal grijze blokken in een design document is makkelijker dan het opnieuw coderen van een complete website pagina. Na de goedkeuring van het wireframe document wordt deze als fundering gebruikt voor het final design. Wil je meer lezen over wat wireframes nu precies zijn, kijk dan hier!
Ontwerp opstellen + revisie rondes
Dankzij de goedkeuring van de wireframes is het opbouwen van het design document een makkelijker process en hoeven de positie van objecten niet meer besproken te worden. Aan de hand van styleguide worden de wireframes omgebouwd tot een volledig design waarin de kleuren, fonts en style elementen etc worden doorgevoerd. Het complete beeld van hoe de website er precies uit komt te zien wordt uitgewerkt en voorgelegd aan de klant. Hierna zijn er een afgesproken aantal revisierondes waarin het document wordt doorgelopen met de klant. Hier is het mogelijk voor de klant om nog input te leveren op het document, deze input wordt altijd verwerkt zodat het gewenste eindresultaat tot stand komt. In sommige situaties is het mogelijk dat er meerdere revisie rondes moeten plaatsvinden voordat de klant tevreden is met het eindresultaat.
