User engagament voor een goede gebruikerservaring. Designers krijgen er altijd mee te maken: ‘User Engagement Design’. Hiermee wordt bedoeld hoe je gebruikers meer kunt betrekken wanneer zij gebruik maken van de website.
Het uiteindelijk doel van webdesigners is dat de eindgebruiker de website supervet vindt om te gebruiken of dat de site bijdraagt aan hun dagelijks leven.
In deze Kiwi Byte leggen we aan de hand van 6 principes uit hoe je de betrokkenheid met de eindgebruiker kunt verbeteren in een ontwerp.
Kortom, zo creëer je user engagement:
1. Discoverability
Maak de gebruiker duidelijk welke belangrijke acties er mogelijk zijn en houd de stijlen consistent, zodat informatie makkelijk gevonden kan worden (ook wanneer de gebruiker voor het eerst je website bezoekt). Bijvoorbeeld navigatie, een belangrijke Call To Action of andere elementen in de visuele hiërarchie van het ontwerp.
2. Feedback
Wanneer bezoekers door je platform navigeren, voeren zij verschillende acties uit waarop zij visuele feedback moeten ontvangen. Bijvoorbeeld als je met de muis over een klikbaar element gaat en je dan verschil ziet met hoe het ervoor was; de ‘hover state’. Deze hover state is feedback die je nodig hebt om iets uit voeren of wanneer je iets hebt uitgevoerd en zorgt voor een goede gebruikerservaring.
Maak om die reden gebruik van micro-animaties om bij sommige acties feedback te creëren met aanvullende context. Ook zorgt dit ervoor dat een ontwerp meer intuïtief aanvoelt. Hieronder staan drie voorbeelden van visuele feedback.
- Voorafgaand: voorafgaand aan een actie kan je makkelijk duidelijk maken waar je op moet klikken.
- Tijdens: waar bijvoorbeeld meer informatie kan worden getoond zoals na het indrukken van een knop of het laden van het gevolg daarvan. Zie het voorbeeld hieronder.
- Naderhand: bijvoorbeeld ter verificatie zoals het voorbeeld hiernaast.
Om de (micro) animatie niet kunstmatig te laten lijken, is het belangrijk dat het object dat animeert niet lineair beweegt maar een versnelling of vertraging krijgt, net zoals alle objecten in de fysieke wereld.
3. Expectation
De bezoekers moeten vrijwel zonder na te denken door een platform heen navigeren. Maak gebruik van duidelijke iconen of voeg labels toe, zodat de verwachte actie van de gebruiker ook past bij het doel van het ontwerp. Voldoe aan de verwachting.