Malmberg is één van de grootste educatieve uitgeverijen in Nederland. Er worden leermethoden ontwikkeld voor het basis-, voortgezet en middelbaar beroepsonderwijs en aangeboden via digitale leerplatformen en boeken.
In 2009 lanceerde Malmberg een groot nieuwe digitaal leerplatform voor het voortgezet en middelbaar beroepsonderwijs. Het digitale leerplatform kon gebruikt worden als aanvulling op, of zelfs ter vervanging van de lesboeken.
De lesstof werd zoals gebruikelijk ontwikkeld door Malmberg zelf, deels gebaseerd op het lesmateriaal dat in de boeken aangeboden werd en aangevuld met multimediale en interactieve onderdelen. De digitale omgeving werd ontworpen door een grote internationale designstudio uit Amsterdam.
In het eerste jaar na de lancering van het leerplatform kwamen veel klachten binnen van leerlingen maar vooral van docenten over de gebrekkige usability van het platform. Samen met een collega en een extern onderzoeksbureau werd ik gevraagd de problemen in kaart te brengen en een nieuw design te maken voor het leerplatform.
Usability testen met leerlingen en docenten.
We begonnen het project met het opzetten van verschillende usability testen van de huidige applicatie. We schreven een testscript met realistische scenario's, gingen op zoek naar respondenten en planden afspraken in op een aantal scholen. We namen de tests op met een recording applicatie die het scherm, de respondent én het geluid opnam zodat we de testen later terug konden kijken. We deden dit samen met een onderzoeksbureau uit Amsterdam.
Na de eerste testronde op basis van de huidige applicatie maakten we nieuwe designs die we als lo-fidelity prototypes opnieuw testte met gebruikers. Dit proces herhaalde we een aantal keer totdat we een design hadden zonder noemenswaardige usability problemen.
Vervolgens konden we aan de slag met het visual design. Ten slotte deden we nog één laatste usability test om de definitieve designs te testen.
Lo-fidelity prototype – De eerste versie van de nieuwe designs hebben we als lo-fidelity prototype getest bij gebruikers. Dit hielp ons met het testen van de nieuwe flows en navigatie zonder afleiding van het visuele design.
Navigatie – De navigatie van het oude design was complex en overweldigend. Veel pijnpunten die tijdens de usability testen naar boven kwamen hadden daar direct of indirect mee te maken. De navigatie bestond uit tabs als hoofdnavigatie met daarin een subnavigatie en daaronder een accordion navigatie. In het nieuwe design heb ik de navigatie vereenvoudigd. Je ziet daardoor altijd waar je op de site bent en de navigatie neemt aanzienlijk minder ruimte in beslag.
Dashboard – Het dashboard moest het centrale startpunt voor gebruikers zijn met daarop de belangrijkste inzichten en uit te voeren acties om snel mee aan de slag te kunnen. Uit de onderzoeken met gebruikers kwam echter naar voren dat het oude dashboard niet op die manier werd gebruikt omdat de inzichten en uit te voeren acties niet relevant waren. Voor het nieuwe design hebben we samen met de gebruikers gekeken naar wat het dashboard zou moeten bieden.
Resultatenpagina – De oude resultatenpagina was lastig te scannen omdat alle informatie onder elkaar stond. In het nieuwe design heb ik de gegevens in een tabel geplaatst. Verder heb ik functionaliteit zoals het geven van punten bij de desbetreffende scores geplaatst omdat die aan elkaar gerelateerd zijn.
Header – De gegevens in de header stonden door elkaar. Er was geen duidelijke groepering van aan elkaar gerelateerde informatie en functionaliteit. Ditzelfde probleem zagen we overigens op meerder plekken in het platform. Met behulp van card sorting hebben we samen met de gebruikers een logische structuur weten te achterhalen. Dit is onder anderen terug te zien in het nieuwe design dat ik maakte van de header.
White labeling – Het learning platform werd voor alle gangbare lesmethodes van Malmberg ingericht. Door slechts twee kleuren aan te passen en het logo te vervangen konden we in een handomdraai het design geschikt maken voor andere lesmethodes.