Praktische deel - Workshop van 50 minuten aan een groep van 50 MBO ROC leraren van het vakgebied online marketing. Georganiseerd door Stichting Praktijkleren op 20 januari 2017 Just start: Hoe verkrijg je UX inzichten... In contact met eindgebruikers, usability test in minimale vorm

1. userneeds! @anous
!
User Experience!
Omdat hart voor mensen het verschil maakt
"
Docentendag 19 januari 2017
Door Anouschka Scholten
userneeds
Praktische deel na de pauze

2. userneeds! @anous
!
Wat heb jij nodig, zou je willen
doorgeven aan je studenten?!
!
Learning by doing UX!
Iedereen kan het doen!
Just start!!

3. userneeds! @anous
UX inzichten verzamelen: leer je gebruiker
kennen in direct contact
Dé 3 UX research technieken om je
gebruiker te leren kennen:
• Observeren
• Interviewen
• Usability testen
https://vimeo.com/137711641

4. userneeds! @anous
Interviewen

5. userneeds! @anous
3 interview top tips
1. Sta open voor ieder resultaat
2. Echt luisteren
3. Vraag om ervaringen in verleden of heden
Tips

6. userneeds! @anous
Listning with your mouth shut

7. userneeds! @anous
Oefenen in goed luisteren
De interviewer
Stelt 1 vraag en vraagt aan de geïnterviewde om
hier 3 minuten over te praten (ik geef je zo het
onderwerp).
Daarna ben je stil.
De geïnterviewde
Geeft 3 minuten antwoord. Blijf praten, wat er ook
gebeurt.

8. userneeds! @anous
Instructie bij interview oefening
1. Vorm een nieuw duo
2. Degene in de rol van interviewer bedenkt een open vraag
met als onderwerp: ‘een weekendje weg’
(neem even de tijd om een goede vraag te formuleren)
3. Stel de vraag en wees stil, de volledige 3 minuten lang
• Na 3 min. Draai de rollen om. De interviewer bedenkt een
open vraag met als onderwerp ‘bijzonder moment’

9. userneeds! @anous
Waarom deze oefening?
Stil zijn kan ongemakkelijk zijn, maar door
vooral te luisteren krijg je het verhaal zo puur
mogelijk te horen.
Je stopt er zo minder OMA in:
overtuigingen, meningen en aannames.

10. userneeds! @anous
User Checks
usability testen in minimale vorm

11. userneeds! @anous
Mensen doen niet altijd wat jij denkt dat ze doen!
Mensen doen niet altijd wat jij zegt dat ze doen!
Mensen doen niet altijd wat ze denken dat ze doen!
Mensen doen niet altijd wat ze zeggen dat ze doen!
!
!
Door te observeren en vragen waarom kom je er
achter wat mensen echt !
doen en nodig hebben!

12. userneeds! @anous
Usability testen
gaat in de basis om
observeren van gedrag
Bij gebruik van site, app of product, kijk naar wat de gebruiker uit
zichzelf doet
terwijl hij of zij een taak uitvoert (hardop denkend)
Help niet
Vraag niet om een mening

13. userneeds! @anous
empathy!
a key function of usability testing
to really see, hear and find out
what moves your users
the ability to see an experience
through another person’s eyes
Getting to

14. userneeds! @anous
WAAROM??!!!
Het gaat niet om
Hoe vaak er iets is gezegd of gedaan
het is geen kwantitatief onderzoek, het gaat niet om significatie
Het gaat om
Waarom er dingen gebeuren of waarom er
iets gezegd wordt
Wat zit er achter dat gedrag?
Verwachtte de gebruiker wat anders? Is er iets waar we geen rekening mee hebben
gehouden, iets nieuws of heel erg belangrijk (belangrijker dan wij aannamen)? Een
nieuwe inzicht of mogelijkheid waar we bij kunnen aanhaken of een pijnpunt dat we
moeten voorkomen?

15. userneeds! @anous
Picture credits: Johan Groenen http://www.jgroenen.nl/
NOT the waterfall way

16. userneeds! @anous
Picture credits: Johan Groenen http://www.jgroenen.nl/
The agile way!

17. userneeds! @anous
user checks!
& traditioneel
usability testing!

18. userneeds! @anous
User Checks –
agile usability testing

19. userneeds! @anous
19

20. userneeds! @anous
Usability Test traditional
1 round of testing"
In a lab environment, eye tracking
Moderator is a UX researcher
Process based

21. userneeds! @anous
Nadelen traditioneel Usablity testen
• Meestal slechts 1 keer, aan het einde ontwerpproces
• Een uitgebreid rapport, weinig of geen redesign
• Geen hertest
• Niet in context gebruiker
• Hoge kosten: lab, eye tracking, speciale UX onderzoeker
• Product team indirect betrokken
• Ruim van tevoren inplannen (minimaal 1 maand)
Procesgericht

22. userneeds! @anous
http://uxpajournal.org/wp-content/uploads/pdf/JUS_Romano_Bergstrom_November_2011.pdf

23. userneeds! @anous
• Test en hertest binnen 1 tot 3 weken
• In context gebruiker, snelle en eenvoudige opzet
• Ontwerper, product owner of online marketeer neemt de test af
• Team is direct betrokken
• Output is een verbeterd ontwerp/ verbeterde site
User Checks - agile usability testen
Waardegericht

24. userneeds! @anous
User Checks iteratie - agile usability testen
6. Evalueer, Prioriteer
Oplossingsrichtingen
2. Ronde
3. Evalueer, Prioriteer
Oplossingsrichtingen
5. Ronde
1. Design /
MVP/
live site
4. Verbeterd
Design /
MVP
7. Verbeterd
Design /
MVP
Herhaal
of ontwikkel
Based on the RITE-model: https://uxmag.com/articles/the-rite-way-to-prototype USERNEEDS

25. userneeds! @anous
“Elaborate tests are a waste of resources”
Source: http://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/
75% of the problems found with 3 or 4 user tests

26. userneeds! @anous
Een succesvolle UX vraagt om
regelmatig gericht contact
met klanten
Hoe meer ‘exposure hours’ met eindgebruikers
(offline) hoe meer focus en een optimalere UX – elk
teamlid in ieder geval elke 6 weken 2 uur
Jared Spool
Fast Path to a Great UX — Increased Exposure Hours van Jared Spool
h"ps://medium.com/@jmspool/fast-path-to-a-great-ux-increased-exposure-hours-
afde796f2e43#.fffrrevyw
“

27. userneeds! @anous
voorbeelden!

28. userneeds! @anous
Ontwerp nieuwe site ggdhaaglanden.nl
User check met een dokter in zijn praktijk
GGD Haaglanden project Angi Studio:"
http://angistudio.com/cases/ggd-haaglanden.html

29. userneeds! @anous
GGD Haaglanden project Angi Studio: http://angistudio.com/cases/ggd-haaglanden.html
User Checks during completely new design

30. userneeds! @anous
“ Bij Meiden verwacht ik
14 tot 21...oh, ik denk dat
ik toch wel in die
doelgroep val als ik het zo
lees ? “
Pop-up information about LINDA.meiden
Project Angi Studio: http://angistudio.com
Herontwerp LINDA magazine online
abonneren

31. userneeds! @anous
“Zo onder elkaar is duidelijk, je kunt er zo
doorheen”
Sub home Abonnement met
cadeau mobiel
Lange lijst om te scrollen
vormde geen enkel probleem
De footer met menu, werd wel gebruikt
Navigeren met hoofdmenu gebeurde
eerst ronde niet.
Ronde 2: Sticky menu bood ook geen
oplossing
Project van Angi Studio: http://angistudio.com/
3e ronde:

32. userneeds! @anous
User Checks during redesign Greenchoice.nl, project Angi Studio:"
http://angistudio.com/cases/greenchoice.html

33. userneeds! @anous
Subsidie aanvraagsysteem Gemeente Den Haag, project Angi Studio:
http://angistudio.com/cases/gemeentelijk-subsidie-loket.html
User Checks during completely new design

34. userneeds! @anous
Snel een beter ontwerp!
!
een beter converterende website
een betere dienst of product

35. userneeds! @anous
Met User Checks
Probleemdetectie
Spoort vroeg problemen op en voorkomt verspilling
Optimalisatie
Verzekert dat gebruikers succesvol aan de slag kunnen en geeft weer waar
hun tevredenheid verbeterd kan worden
Innovatie
Biedt inzichten tav dienstverlening, propositie of productconcept
zwakheden
Overtuigen
Benadrukt dat een wijziging in het ontwerp nodig is
Betrokkenheid
Zorgt er voor dat betrokkenen begrijpen hoe gebruikers hun product/dienst
gebruiken
Focus
Biedt focus bij maken van besluiten (user stories bijv.)

36. userneeds! @anous
Verandert organisatie van
binnenuit, creëert bewustzijn bij
medewerkers!
!
“ !
Sterker: ik heb het datamodel
aangepast naar aanleiding van de
user check video’s, toen werd me
goed duidelijk waar het om draaide.
Dataspecialist ontwikkelteam

37. userneeds! @anous
Just do it!
Iedereen kan met user checks "
aan de slag

38. userneeds! @anous
Live user check test sessie - uitvoer!
Publiek observeert!

39. userneeds! @anous
Bevindingen verzamelen en
prioriteren!
!

40. userneeds! @anous
Oplossingsrichtingen bedenken
en prioriteren!
!

41. userneeds! @anous
• 1 proefleider
• 1 observator (1 is noodzakelijk, jij kunt niet alles vastleggen als
proefleider. 2 of meer mag, maar te veel kan de gebruiker afleiden)
• Testopstelling: proefleider en observator zitten
schuin achter de respondent (kunnen meekijken
op device en gezichtsuitdrukking zien)
• Audio opname (via je telefoon) ter naslag en evt. live screen capture bijv.
Via http://www.lookback.io http://www.airsquirrels.com/reflector/ of
http://www.telestream.net/screenflow/overview.htm of
https://www.techsmith.com/camtasia.html (ook voor Windows)
• Wat ook kan, maar maakt het minder eenvoudig: Video opname apparatuur
Testopstelling en Rollen

42. userneeds! @anous

43. userneeds! @anous
De 4 basics van een User Check
1. Doe vooraf een klein interview
Stel op gemak en vraag om ervaringen; hoe doet hij/zij …
de vorige keer? Stel open vragen m.b.t. Datgene wat je wil
gaan checken zodadelijk.
Laat de gebruiker zelf formuleren wat haar/zijn doel is, de
situatie, de behoefte/taak/vraag… gebruik die situatie voor
de user check.
2. Laat de gebruiker zelf het prototype of
de werkelijke site/dienst ervaren
Observeer, instrueer niet!
Geef het prototype/de site in de handen van de gebruiker
met de context/de situatie zoals uit interview naar voren
kwam, zodat ze weten wat ze moeten doen. Laat ze hun
gang gaan!

44. userneeds! @anous
3. Laat de gebruiker hardop denkend aan de
slag gaan & Observeer actief
Kijk toe hoe ze de site/dienst gebruiken (observeer waar het
goed gaat en waar het mis gaat, wat opmerkelijk is, …), luister
en kijk ook goed naar de gebruiker (mimiek, zuchten, toon).
Corrigeer nooit direct wat er ‘mis’ gaat!
Stimuleer alleen om hardop te praten: “Waar denk je aan?”
4. Evalueer achteraf met open vragen
Dit is belangrijk en vaak het belangrijkste deel van de sessie,
ga in op wat je zag of hoorde: Je zei… wat bedoelde je? … Ik
zag dat je hier dat en dat deed… waarom? Wat verwachtte je?
Hoe zou jij het noemen?
Beantwoord vragen met vragen, bijv.: … wat denk jij dat die
button doet?
De 4 basics van een User Check

45. userneeds! @anous
1 vrijwilliger

46. userneeds! @anous
Case Een ROC website
• https://www.rocmn.nl/zoek-mbo-opleiding
• Met dame uit de catering als vrijwillige gebruikster, woont in Amersfoort
• Doelgroep – gebruiker
Moeder van een dochter die naar het MBO gaat
• Hoofdtaken, vragen van gebruikers
Oriënteren op ROC Midden-Nederland, of die school voor haar dochter
interessant is.

47. userneeds! @anous

48. userneeds! @anous
Jullie
Observeer het gedrag van de gebruiker
1 sticky per issue/observatie
Noteer wanneer de gebruiker:
• Aarzelt, zich zorgen maakt, zich verwondert, uitdrukkelijk nadenkt
• Iets niet goed begrijpt
• Gefrustreerd raakt of verveeld
• Onzeker is
• Opgeeft
• Verrast is
Denk ook aan uitdrukkingen van emoties die de revue passeren
Oordeel niet, bedenk nog geen oplossingen

49. userneeds! @anous

50. userneeds! @anous
Evaluatie bevindingen
Doe dit met hethele team
Per groep
• Verzamel de bevindingen op een flipover
• Categoriseer ze (wat hoort bij elkaar) en label per
categorie
• Wat zijn de grootste issues (tav doelstellingen
van de site, tav gebruik)?
- Je mag 3 ’dot votes’ plakken

51. userneeds! @anous
• Collect all findings
• Re-arrange, categorize
them, label them
• Dot-vote (3 per person):
what is most important,
what should we tackle
The problem dot-voted
most: concentrate on that
one for the solutions…

52. userneeds! @anous
Verbeteringen bedenken
• Verbeteringen of oplossingen
op elk niveau en niets is fout:
elke oplossing apart op een sticky note
Labeling, content, categorization, visual assets,
interaction, concept, flow, persuasion, proces…
• Prioriteer via Impact & Effort (matrix) or dot-
vote
Kies de oplossing(en) die je opnieuw wilt checken
met eindgebruikers
Doe dit met hethele team

53. userneeds! @anous
Impact & Effort matrix
Impact: creates high/low value for users
effort: high/low effort in terms of time, knowledge, tools, people…
Source: http://www.innovationgames.com/impact-effort-matrix/
Doe dit met het
hele team, incl.
beslissers!

54. userneeds! @anous
• Implement the solutions
that have the most positive
impact/value for the user
and take the least effort to
realize
And re-test!

55. userneeds! @anous
Een succesvolle UX vraagt om
regelmatig gericht contact met klanten
Hoe meer exposure hours met eindgebruikers (offline) hoe
meer focus en een optimalere UX – elk teamlid in ieder
geval elke 6 weken 2 uur
Fast Path to a Great UX — Increased Exposure Hours
h"ps://medium.com/@jmspool/fast-path-to-a-great-ux-increased-exposure-hours-
afde796f2e43#.fffrrevyw

56. userneeds! @anous
Template core model
5
Holistische focus op een
goede gebruikerservaring!
Begrijpen
Uitvinden
Maken/
Verbeteren

57. userneeds! @anous
Bedankt voor jullie aandacht!
anouschka.scholten@userneeds.nl
www.userneeds.nl
Twitter: @anous
LinkedIn: https://nl.linkedin.com/in/anouschkascholten

58. userneeds! @anous
Extra’s

59. userneeds! @anous
User Checks set up
• Test script with real tasks (back up)
• Real target users as participants
• Ideally conducted in context user on their own
device
• Record audio and screen capture
• 1 test moderator, 1 observer
(more observers are possible, but not too much
and really on the background)

60. userneeds! @anous
Key: moderating the test
If they…
Say…
Are not talking
“What are you thinking?”
Ask you a question (e.g. “Is that
what I should do here?”)
Rephrase the question (e.g “ What do
you think you should do?”)
Get a task right or wrong
“Thank you , that is very helpful”
“Thanks for the feedback”
Mess up
“Remember, you can’t make any
mistakes. You’re doing a great job.”
Are unsure if they have
completed a task and ask you
“Is this what you would do if you were
doing X at home?”
Criticize the design
“Thanks for the feedback”

61. userneeds! @anous
Uitvoer van de user check
a. Voorgesprek
Introductie: doel test en duur + opname toestemming
Kort interview, wie heb je voor je
b. Situatie en Taakopdracht(en)
• Hardopdenk instructies, niet jij wordt getest
• (Prototype uitleg)
• Taak voorleggen/vertellen
• Taak hardop denkend laten uitvoeren, niet onderbreken
c. Evaluatie taak
• Open vragen, pad doorlopen, verwachtingen checken en
doorvragen
d. Afsluitende vragen,
bedanken en evt. vergoeding of incentive geven.

62. userneeds! @anous
Voorbeeld Voorstellen
In spreekstijl
Hallo, hoe is het met u? Fijn dat u tijd voor ons vrijmaakt!
Mijn naam is Anouschka Scholten. Ik neem dit interview af en met mij
is <naam collega> die het interview vastlegt. Ook hebben we <naam>
meegenomen, hij werkt sinds kort bij ons en kijkt graag een keertje
mee.
Wij zijn van Userneeds en helpen <organisatie x> met het neerzetten
van websites en in dit geval eigenlijk meer een webapplicatie.
<Organisatie x> vindt het belangrijk dat de webapplicatie gemakkelijk
werkt voor degenen die er mee aan de slag gaan.
Daarom willen we u een aantal vragen stellen en u de eerste
ontwerpschetsen voorleggen.
Het interview neemt ongeveer een uur in beslag.
Heeft u er bezwaar tegen als we de sessie opnemen ter naslag ?
Alles wat we bespreken en opnemen wordt vertrouwelijk behandeld!
Heeft u nog vragen?

63. userneeds! @anous
Voorbeeld Vragen vooraf
Persoon & Context
1. Wat is uw leeftijd (voor zover onbekend).
2. Hoe ziet uw (werk)dag er uit? (doorvragen om te achterhalen wat
focus heeft/wat niet en hoe, om aan te sluiten bij de taak zo dadelijk)
3. Zit u vaak op internet, waar gebruikt u het zoal voor: e-mailen, sites
bekijken, bankzaken regelen? (Ervaringsvraag)
4. Gebruikt u internet ook op uw mobiel? Zo ja, welk type/wanneer/
waarvoor/ hoe vaak?
En op een tablet? Zo ja, welk type/wanneer/waarvoor/ hoe vaak?
5. Wat maakt dat u met een glimlach op staat (om te gaan werken, dat
u er echt zin in heeft)?
6. Waar ligt u wel eens wakker van, vindt u minder makkelijk (in uw
werk)?

64. userneeds! @anous
Voorbeeld instructies
Prototype instructie
We testen een ontwerp en daarvoor maken we gebruik van een prototype. Het
prototype presenteert webpagina’s zoals het moet gaan worden. Dit betekent dat
niet alles klikbaar is of werkt en dat onderdelen niet ingevuld zijn.
Schrik dus niet als er iets niet werkt, daar kunt u niets aan doen!
<Na voorleggen van de situatieschets en opdracht>
Hardopdenk instructie (formeel)
Tijdens het uitvoeren van de taak wil ik u vragen om hardop te praten terwijl u bezig
bent: probeer alles waar u aan denkt, hardop te verwoorden. Dus ook al denkt u
tussendoor ‘ik moet niet vergeten nog boodschappen te doen’ ik wil het allemaal
horen, niks is fout! Zegt u niets dan zal ik vragen waar u aan denkt.U praat niet tegen
mij, maar voor uzelf en ik zal dus ook geen antwoord geven.
Hardopdenk instructie (minder formeel)
Ga uw gang en…
Als u zo de site doorloopt, wilt u proberen hardop te zeggen wat u denkt?
Niet tegen mij, maar voor uzelf?
Niets is fout, alles is goed, bijv. ook ’wat is dit nou weer?!’

65. userneeds! @anous
Voorbeeld Afronding sessie
Voorbeeld overall vragen
• Mist u iets? Zou u zo aan de slag kunnen denkt u? Waarom wel/niet? Wat heeft
u nog nodig?
• Hoe zou het beter kunnen vindt u? Waarom?
• Als u de website zoals u deze heeft gezien, zou omschrijven in 3 woorden,
welke woorden zou u dan noemen? (Bijv. standaard, spannend, warm, saai,…
Waarom per woord, in welke mate).
• Zou je deze site/dit product aanbevelen bij anderen?
(schaal van 1 Zeer onwaarschijnlijk naar 10 Zeer waarschijnlijk))
Afronding
Hartelijk dank voor uw medewerking! Hoe heeft u het interview ervaren? Bent u evt.
bereid nogmaals deel te nemen aan een interview?
Vindt u het goed als we een fotootje van u nemen voor het verslag dat alleen aan de
betrokken projectleden wordt getoond? Uw foto wordt absoluut niet zonder uw
toestemming verspreid!