Hoe maken we een herontwerp dat aan hele strenge usability- en toegankelijkheidseisen moet voldoen? Een herontwerp dat alle technische, juridische, ethische, politieke en veiligheidskaders naleeft. Dit is de uitdaging waar ik (Rowan Verbraak) me het afgelopen half jaar in heb vastgebeten.

Het herontwerp in kwestie, is een Mijn-omgeving van een digitaal product met een gebruikersbase van 14 miljoen burgers, die hen in staat stelt overheidszaken te regelen. Omdat het een website voor het publieke domein is, moet het voldoen aan strenge toegankelijkheidseisen (denk aan de WCAG). Maar het moet ook zo simpel mogelijk in gebruik zijn. Sommige voor de hand liggende interactiepatronen zijn voor veel Nederlanders toch te ingewikkeld en bepaalde instellingen kunnen te abstract zijn om te begrijpen. Hoe pak je zoiets aan?

Samenwerken is key

Het antwoord is te vinden in transparante samenwerking. Als UX ontwerper alleen ga je het niet redden. Het is onmogelijk voor één persoon om een volledig beeld te hebben op alle kaders, eisen en limitaties. Het is simpelweg te complex. Omdat ik de enige UX ontwerper ben bij het product moest ik wel de kennis van mijn collega’s in andere vakgebieden opzoeken. Gelukkig is er op de werkvloer een open sfeer en vliegen de conference calls je om de oren. Dus heb ik door het gehele proces mijn collega’s van UX, functioneel ontwerp, product owner, UX research, architectuur, communicatie, klant contact centrum en development betrokken en gevraagd om te helpen iets op te bouwen wat de burger écht gaat helpen.

Test je producten met het hele team

Dat begint al bij het onderzoeken van de ‘problem space’. Waarom hebben we een herontwerp nodig? De eerste redenen kwamen boven water bij een gebruikersonderzoek met visueel beperkte burgers. In het kader van toegankelijkheid hebben we minstens eens per jaar zo’n test, vooral omdat de WCAG richtlijnen niet voldoende zijn om je product echt toegankelijk te maken. Het is pas toegankelijk als de doelgroep het als zodoende ervaart. Zo zagen we tijdens de test dat bepaalde knoppen buiten beeld vallen bij mensen die Zoom software gebruiken. Maar ook dat de indeling van de pagina screen-reader gebruikers niet helpt een beeld te vormen van de inhoud. Omdat dit onderzoek gezamenlijk geleid en uitgevoerd werd door mijzelf, de UX researchers, een functioneel ontwerper en mijn product owner, was de behoefte om te verbeteren gelijk breed gedragen binnen de teams. We zien samen een kans om deze burgers te helpen.

Vervolgens kwamen er vanuit meerdere hoeken redenen om deze Mijn-omgeving te verbeteren. Gebruikersonderzoek met de doorsnee burger gaf aan dat men overweldigd werd door de lange verticale kolom met informatie op de landing page. Daarnaast werd er intussen gewerkt aan een nieuwe lange-termijn product visie. Zo moesten bepaalde instellingen meer naar voren komen en willen we de burger meer controle geven over hun digitale veiligheid. Afgelopen januari hadden we binnen de teams een goed beeld van de ‘problem space' en begon ik stapsgewijs met een herontwerp.

Itereer, itereer, itereer!

Eerst herzie je samen met je collega’s de informatie architectuur (indeling en structuur) van je pagina’s en content. Wanneer dit slaagt voor alle technische en juridische eisen, maak je een visueel ontwerp voor verschillende schermgroottes. Vervolgens test je deze met gebruikers en itereer je. Uiteindelijk bouw je naast de schermen een component Library en style guide voor zowel Light en Dark mode samen met de ontwikkelaars, zodat iedereen goed in de materie zit. Dat laatste is waar ik nu sta. Samen met de ontwikkelaars en functioneel ontwerper zijn we de puntjes op i aan het zetten op de componenten, ook op gebied van toegankelijkheid.

Een van de opmerkelijkste veranderingen is dat we bovenaan de pagina een banner hebben toegevoegd met dikke letters en niet-te-missen kleuren. Deze banner vraagt de burger om hun digitale veiligheid te vergroten. Dit kan door bepaalde instellingen op actief te zetten. De test met burgers toonde aan dat deze banner, samen met andere elementen, heel effectief de gebruiker ‘nudged’ (stuurt). Zo zagen we dat men uit zichzelf moeite wilt doen om rode elementen groen te krijgen. Hierdoor kunnen we de burger goed begeleiden in het vergroten van hun digitale veiligheid.

Niet alleen de eindgebruiker profiteert

Door samen te sparren hebben we nu een product dat aantoonbaar beter wordt ervaren door verschillende type burgers. Een product dat toekomstbestendiger is en zelfs de cohesie in de teams heeft vergroot. Want iets groots dat je samen maakt geeft altijd een trots gevoel. Ik word zelf altijd enorm enthousiast van hele complexe producten, maar dat is wel zo gegroeid nadat ik afleerde om zelf alles alleen te dragen. Je kan eindeloos blijven puzzelen, maar fouten of gemiste kansen zul je altijd maken. Die had ik ook tijdens dit proces. Vraag om hulp en advies en respecteer andermans vakgebied, dan doen ze dat ook bij dat van jou. Dan ligt er op het einde een sterk product klaar voor de klant, stakeholders én vooral de eindgebruiker.