Usability test analyse

Design

usability test analyse

Usability Test plan

Testresultaten

Bij elk scenario horen een aantal vragen en/of opdrachten. Per scenario worden de resultaten verwerkt in een tabel. Per gebruiker wordt er aangegeven of ze het juiste antwoord hebben gegeven. Daarbij wordt er per vraag een slagingspercentage gegeven. Dit is handig om later de prioriteit van de functie te bepalen. Belangrijke feedback/opvallende resultaten worden onder de tabellen vermeld.

Legenda

geslaagd: +
geslaagd maar niet als verwacht (percentage wordt gehalveerd): +-
niet geslaagd: -

Scenario 1: Je bent een Administrator en je wilt een nieuwe briefing aanmaken.

Design A

Vraag 1: Welke pagina is er nu actief in het menu?

Antwoorden:

Persoon 1: Testpanels of Mijn testpanels.
Persoon 2: Het is niet duidelijk of het Testpanels of Mijn testpanels is.
Persoon 3: Testpanels.
Persoon 4: Testpanels of mijn testpanels.
Persoon 5: Testpanels.
Persoon 6: Testpanels en mijn testpanels, het is niet duidelijk welke pagina het is.

Opdracht 2: Ga naar de pagina waar je een nieuwe briefing kunt aanmaken.
Opdracht 3: Maak een nieuwe briefing aan.

	Vraag 1	Opdracht 2	Opdracht 3
Persoon 1	+-	+	+
Persoon 2	+-	+	+
Persoon 3	+	+	+
Persoon 4	+	+	+
Persoon 5	+	+	+
Persoon 6	-	+	+
Geslaagd percentage	66,6%	100%	100%

Design B

Vraag 1: Welke pagina is er nu actief in het menu?

Antwoorden:

Persoon 1: Alle testpanels
Persoon 2: Alle testpanels
Persoon 3: Alle testpanels
Persoon 4: Alle testpanels
Persoon 5: Alle testpanels
Persoon 6: Alle testpanels

Vraag 2: Naar welke pagina ga je voor het aanmaken van een nieuwe briefing?
Vraag 3: Waar kun je een nieuwe briefing aanmaken? (op de briefings pagina)

	Vraag 1	Opdracht 2	Opdracht 3
Persoon 1	+	+	+
Persoon 2	+	+	+
Persoon 3	+	+	+
Persoon 4	+	+	+
Persoon 5	+	+	+
Persoon 6	+	+	+
Geslaagd percentage	100%	100%	100%

Design A/B

Vraag 4: Welk design geeft het beste weer welke pagina nu actief is?

Antwoorden:

Persoon 1 kiest voor design B, omdat er een duidelijke kleur wordt gebruikt en niet alleen maar een tint donkerder.
Persoon 2 kiest voor design B omdat de kleur duidelijk aangeeft welk menu item actief is.
Persoon 3 kiest voor design B. Hij geeft aan dat hij verwachtte dat als je op het dropdown menu klik je gelijk naar de overzichtspagina gaat.
Persoon 4 kiest voor design B omdat de kleuren duidelijker aangeven wat de hoofdcategorie is.
Persoon 5 kiest voor design B. Ze had net als persoon 3 verwacht gelijk naar de overzichtspagina te worden gebracht.
Persoon 6 kiest voor design B omdat hij daar duidelijk kan zien wat de hoofdcategorie is.

Vraag 5: In welk design is het duidelijker waar je de briefing kunt aanmaken?

Antwoorden:

Persoon 1 kiest design B, ook omdat er een kleur wordt gebruikt dat maakt het snel zichtbaar.
Persoon 2 kiest design B omdat het met een keur wordt geaccentueerd.
Persoon 3 kiest design B omdat de kleuren duidelijker maken waar je moet zijn.
Persoon 4 kiest design B Hierbij geeft hij aan dat design B er uitziet zoals hij een CMS verwacht, vooral omdat de knoppen duidelijk zichtbaar zijn daardoor voelt het meer als een gebruikers interface.
Persoon 5 kiest design B omdat de button veel duidelijker is.
Persoon 6 kiest design B omdat de knop beter zichtbaar is.

Scenario 2: Je wilt informatie uit de briefings tabel filteren en sorteren.

Design A

Opdracht 1: Filter op de categorie “Smartphones & Tablets”.
Opdracht 2: Reset de filter.
Opdracht 3: Sorteer de tabel op titel.

	Opdracht 1	Opdracht 2	Opdracht 3
Persoon 1	-	+-	-
Persoon 2	+	+	+
Persoon 3	-	+-	+
Persoon 4	+	-	+
Persoon 5	+	+-	-
Persoon 6	+	+	+
Geslaagd percentage	66,6%	58,3%	66,6%

Notes:

Persoon 1 had veel moeite met het vinden van de filteropties. Hij heeft geklikt op categorie, status, titel en in het navigatiemenu gekeken voordat hij de filteroptie boven de tabel had gevonden. Hij gaf aan de het vinden van de reset knop puur geluk was, omdat het handje er overheen hovert en aangeeft dat het klikbaar is. Als er een kruisje bij stond zou het wel duidelijk zijn geweest. Bij het sorteren op de titel klikte hij op het filter icoon in plaats van de titel, pas na een hint lukte het om te sorteren.
Ondanks dat persoon 2 ervaring heeft met het CMS was ze toch geneigd eerst bij categorie te klikken voordat ze naar het filter optie ging. Ook merkte ze op dat er geen kruisje bij het resetten van de filter staat.
Persoon 3 had moeite met het vinden van de filter knop voor het sorteren op categorie. Hij heeft eerst op het kopje categorie geklikt voordat hij naar de filteropties ging. Hij geeft aan dat hij de reset knop meer op geluk heeft gevonden en dat hij eigenlijk van plan was om weer op de filter knop te klikken.
Persoon 4 geeft aan deze filteropties totaal niet prettig te vinden. De redenen daarvoor waren dat de filter optie er niet klikbaar uitziet. Er zitten meerdere keuzes tussen voordat je kan filteren. Hij wil net als bijvoorbeeld een webshop filter opties direct kunnen zien. Voor het resetten klikt ook hij op de filter knop en daarna pas op de gefilterde categorie. Hij geeft aan dat hij ergens een kruisje verwacht en eigenlijk op de gok op de categorie klikte.
Persoon 5 had geen probleem met het vinden van de filteropties, maar wel met het resetten daar was ze lang naar opzoek. Ze geeft aan dat ze daar een kruisje had verwacht. Bij het filteren op titel klikte ze eerst op het filter icoon in plaats van op de titel.
Persoon 6 doorliep het proces goed, wel gaf hij aan dat hij bij het resetten een kruisje had verwacht.

Design B

Opdracht 1: Filter op de categorie “Smartphones & Tablets”.
Opdracht 2: Sorteer de tabel op titel.
Opdracht 3: Reset de filter.
Vraag 4: Op welke kolom is de tabel nu gesorteerd?

Antwoorden:

Persoon 1: ID, Datum.
Persoon 2: Titel.
Persoon 3: Titel
Persoon 4: Titel
Persoon 5: Benoemt alle categorieën totdat ze toevallig titel benoemde.
Persoon 6: Titel

	Opdracht 1	Opdracht 2	Opdracht 3	Vraag 4
Persoon 1	+	+	+	-
Persoon 2	+	+	+	+
Persoon 3	+	+	+	+
Persoon 4	+	+	+	+
Persoon 5	+	+	+	-
Persoon 6	+	+	+	+
Geslaagd percentage	100%	100%	100%	66,6%

Notes:

Persoon 1 kon niet duidelijk zien op welke kolom de tabel nog gesorteerd was.
Persoon 2 zag duidelijk waar de tabel op was gesorteerd omdat er een donker gekleurd pijltje bij stond.
Persoon 3 zag aan het pijltje waar de tabel op was gesorteerd.
Persoon 4 kon gelijk zien waar de filters opties zitten.
Persoon 5 kon niet direct zien waar de tabel op was gesorteerd, het pijltje was niet voldoende uitgelicht om direct op te laten vallen. Ze geeft aan dat dit eventueel kan met een underline of een accentkleur.
Persoon 6 vond het gehele process duidelijk

Design A/B

Vraag 5: Welk design heeft jouw voorkeur voor filteren?

Antwoorden:

Persoon 1 geeft aan absoluut voor design B te kiezen. Bij design A vond hij het filteren moeilijk, bij design B was alles duidelijk en zoals hij had verwacht.
Persoon 2 vind design B overzichtelijker, maar bij design B leidt de filter meer af omdat het niet ingeklapt zit en het daardoor voor haar lijkt alsof je moet filteren, maar ze twijfelt er over omdat je aan de andere kant bij grote tabellen sneller geneigd bent om te gaan filteren.
Persoon 3 vindt design B duidelijker weergeven waar je kan sorteren. Hij geeft aan dat hij bij design A niet het idee heeft dat hij kan filteren. Hij zou ook eerder geneigd zijn om de filter opties te gebruiken bij design B, eerder nog de zoekfunctie die hij bij B er ook bij ziet staan.
Persoon 4 zegt 100% voor design B te kiezen, bij design A heeft hij niet het idee dat hij kan filteren. Design B maakt gebruik van een herkenbare filter.
Persoon 5 kiest voor design B omdat ze de tabel veel overzichtelijker vindt. Bij design A vindt ze dat je te vaak moet klikken om te kunnen filteren.
Persoon 6 kiest ook overduidelijk voor design B omdat je daar gelijk kan zien waar je op kan filteren. Het is veel overzichtelijker.

Vraag 6: Welk design heeft jouw voorkeur voor sorteren?

Antwoorden:

Persoon 1 kiest design B omdat er nu alles in zit wat je nodig hebt om te sorteren, al mag het icoon nog wel duidelijker.
Persoon 2 kiest voor design B omdat je gelijk kan kiezen hoe je het wilt sorteren (van a-z of van z-a) zonder daar een extra keer voor te hoeven klikken.
Persoon 3 heeft geen duidelijke voorkeur, beide iconen geven duidelijk aan dat het gesorteerd is.
Persoon 4 heeft geen duidelijke voorkeur.
Persoon 5 vindt dat design B nog beter kan aangeven waar de tabel op is gesorteerd door zoals boven vernoemd extra accent op de titel te leggen. Maar nog steeds is het beter dan bij design A.
Persoon 6 kiest design B omdat je bij design A overal filteropties tussen ziet. Bij A zie je geen indicatie dat je er op kan sorteren. Bij design B zie je dit gelijk.

Scenario 3: Je wilt alle items verwijderen uit de briefings tabel.

Design B

Opdracht 1: Selecteer alle items.
Opdracht 2: Verwijder alle items.

	Opdracht 1	Opdracht 2
Persoon 1	+	+
Persoon 2	+	+
Persoon 3	+	-
Persoon 4	+	+
Persoon 5	+	-
Persoon 6	+	+
Geslaagd percentage	100%	66,6%

Notes:

Persoon 1, 2, 3, 5 en 6 geven aan de acties liever niet onder een menu te hebben maar direct in de balk naast “x items geselecteerd”.
Persoon 4 vond de extra actie niet storend en kon de acties snel vinden.

Scenario 4: Je bent een adverteerder en je hebt een vraag met betrekking tot het CMS.

Design B

Opdracht 1: Waar ga je heen om contact op te nemen?

Vraag 2: Heb je alle informatie die je nodig hebt?

Persoon 1 geeft aan eventueel los het bedrijf te vermelden waarmee je contact opneemt.
Persoon 3 geeft aan het prettig te vinden om een gezicht bij de contactgegevens te zien.
Persoon 4 raad aan een een tour door het CMS toe te voegen. Met de tour krijg je een virtuele rondleiding door het CMS bij de eerste keer dat je inlogt. Voor de plaatsing van het icoon/pagina had hij verwacht dat het rechts onderin zou staan zoals regelmatig op websites een chat button staat.
Persoon 5 dacht bij de contactgegevens in eerste opzicht dat het haar eigen gegevens waren. Daarbij zou het duidelijker aangegeven kunnen worden dat bijvoorbeeld de email klikbaar.
Persoon 6 mist een responstijd zodat je ook weet binnen welke termijn je antwoord kan verwachten.
Personen 2,4,5 en 6 geven aan graag een FAQ terug te zien op de pagina, zodat veelgestelde vragen makkelijk beantwoord kunnen worden.

Vraag 3: Staat het icoon op de plek waar je de contactpagina zou verwachten?
Vraag 4: Uit deze 6 iconen, welke past het beste bij de contactpagina?

Persoon 1 kiest voor Icoon 4 omdat hij dan verwacht dat hij daar een vraag kan stellen.
Persoon 2 ze kiest voor Icoon 4 omdat bij icoon 2 verwacht ze informatie over het systeem en bij icoon 4 verwacht ze een vraag te kunnen stellen.
Persoon 3 kiest voor icoon 6 omdat hij het echt een contact icoon vindt en anders icoon 2 omdat het aangeeft dat er informatie is.
Persoon 4 kiest icoon 4 omdat het aangeeft dat je om hulp kunt vragen. Bij icoon 2 verwacht hij informatie. Daarom vindt hij icoon 4 passender.
Persoon 5 zou gaan voor icoon 4 maar ze denk dat er misschien nog wel een beter icoon is.
Persoon 6 kiest icoon 4 omdat die het meest aangeeft dat je een vraag kunt stellen.

	Opdracht 1	Vraag 3	Vraag 4
Persoon 1	+	Ja	Icoon: 4
Persoon 2	+	Ja	Icoon: 4
Persoon 3	+	Ja	Icoon: 6 of 2
Persoon 4	+	Nee	Icoon: 4
Persoon 5	+	Ja	Icoon: 4
Persoon 6	+	Ja	Icoon: 4
Resultaat	Geslaagd percentage: 100%

Scenario 5: Er staat veel data in de tabel en je wilt de data beter lezen.

Design B

Opdracht 1: Hoe zorg je er met één klik op deze pagina dat je de tabel breder kan maken?

Vraag 2: Was het voor jou duidelijk dat je het menu kon inklappen?

Persoon 1: Ik had het pijltje in het menu niet gelijk gezien voor het inklappen, maar het is wel de plek waar ik verwacht het te vinden. Misschien kan je het groter maken, het icoon teken is verder duidelijk.
Persoon 2: Ik verwacht dat er nog tooltips verschijnen bij het ingeklapte menu.
Persoon 3: Ik had verwacht dat je de tabel zou kunnen vergroten, compleet full screen te kunnen maken. Maar het inklappen van het menu is ook een prima begin en het was duidelijk dat je het menu kon inklappen.
Persoon 4: Ik zou het persoonlijk niet gebruiken maar ik kan me voorstellen dat het handig is op een kleinere laptop scherm.
Persoon 5: Misschien zou je ook de tabel kunnen slepen om groter te maken.
Persoon 6: Ik had gelijk gezien dat het menu kan inklappen.

	Opdracht 1	Vraag 2
Persoon 1	-	+-
Persoon 2	+	+
Persoon 3	+-	-
Persoon 4	+	+
Persoon 5	+	-
Persoon 6	+	+
Geslaagd percentage	75%	58,3%

Scenario 6: Review.nl heeft een nieuwe huisstijl. Je wilt de huisstijl doorvoeren in het CMS.

Design B

Vraag 1: Waar kan je de styling aanpassen.
Vraag 2: Welke 4 opties heb je voor het aanpassen?
Vraag 3: Welke file extensies kan je uploaden?

	Opdracht 1	Vraag 2	Vraag 3
Persoon 1	+	-	+
Persoon 2	+	+	+
Persoon 3	-	+	+
Persoon 4	+	+	+
Persoon 5	+	+	+
Persoon 6	+	+	+
Geslaagd percentage	83,3%	83,3%	100%

Notes:

Persoon 1 dacht dat de voorbeeld van de buttons een aparte customizer optie waren waarbij je de styling passend bij de staat van een button (focused, hover etc..) kon aanpassen.
Persoon 3 had verwacht dat de opties onder systeem settings zou vallen en dat het niet perse een losse pagina nodig had.
Persoon 4 vond het duidelijk wat je kan aanpassen.
Persoon 5 geeft aan bij het upload velden er nog bij te zetten dat het een drag & drop veld is.
Persoon 6 vond het process duidelijk.

Scenario 7: Je wilt een nieuwe profielafbeelding.

Design B

Opdracht 1: Waar kan je je profielafbeelding aanpassen?
Vraag 2: Was het duidelijk waar je dit kon doen?

	Opdracht 1	Vraag 2
Persoon 1	+-	Ja
Persoon 2	+	Ja
Persoon 3	+	Ja
Persoon 4	+	Ja
Persoon 5	+	Ja
Persoon 6	+	Ja
Resultaat	Geslaagd percentage: 91.6%

Persoon 1 vindt het wel logische plek maar het lijkt net of settings onder het kopje profiel hoort omdat het er geselecteerd uit ziet.

Conclusie

Uit deze user test blijkt duidelijk dat alle gebruikers een duidelijk voorkeur hebben voor design B omdat het er overzichtelijker uit ziet. Uit de test blijkt namelijk dat bij design A een gemiddelde slagingspercentage van 66,6% is voor het kunnen uitvoeren van een categorie filter in een tabel. Bij design B lag dit op 100%. Deze user test bevestigd daarmee dat het huidige CMS elementen mist die standaard in een CMS horen zoals filteropties en zichtbare knoppen. Dit wil echter niet zeggen dat design B geen verbeter punten heeft gekregen. Bij het bulk verwijderen hadden 5 van de 6 gebruikers moeite met het vinden van het verwijder icoon die momenteel onder een actiemenu zit. Bij scenario 5 was de vraagstelling niet duidelijk waardoor de antwoorden niet helemaal betrouwbaar zijn, de gegeven feedback wordt wel meegenomen in de designkeuzes.

Problemen/verbeteringen

1. Bij het dropdown menu verwachten gebruikers direct naar een pagina te gaan.
Priority: Low
Mogelijke oplossing: In het systeem zorgen dat de er een overzichtspagina achter de dropdown pagina zit.
Het pijltje bij het sorteren van de tabel geeft niet duidelijk genoeg weer dat de kolom is gesorteerd
Prioriteit: High
Mogelijke oplossing: Met een underline of een accentkleur de gesorteerde kolom accentueren.
Gebruikers moeten zoeken naar het verwijder icoon bij het bulk verwijderen in de tabel, deze zit momenteel onder een actie menu.
Prioriteit: High
Mogelijke oplossing: De actie iconen in de balk zitten naast “x items geselecteerd.
Icoon 4 is het meest gekozen icoon voor de contact pagina
Prioriteit: High
Oplossing: Vervang het huidige icoon door icoon 4.
De email en telefoon nummer op de contact pagina zien er niet klikbaar uit.
Prioriteit: Low
Mogelijk oplossing: Met de standaard link styling laten zien dat email en telefoon nummer klikbaar zijn.

Extra functionaliteiten

Naar deze functionaliteiten zal onderzoek gedaan kunnen worden of deze wenselijk zijn als standaard functionaliteit in het CMS.

Een FAQ toevoegen aan de contact pagina
Een bedrijfsnaam toevoegen aan de contact pagina
Een foto toevoegen aan de contact pagina.
Een virtuele tour door het CMS toevoegen die de gebruiker krijgt bij het eerste keer inloggen om bekend te raken met het CMS.
Tooltips toevoegen aan het ingeklapte menu.