How To Test A Website On A Web Browser

Transcription

1 user checks! improve your design significantly" Workshop by Userneeds - Anouschka Scholten Assisted by ArjanneAnouk Interact Arjanne de Wolf AmsterdamUX Meet up - June 3, 2015

2 Make people s lives better.

3 Quantitative methods?

4 Getting to empat! w hy! the ability to see an experience through another person s eyes a key function of usability testing usability testing enables you to really see, hear and find out what moves your users

5 Usability Test traditional 1 round of testing" In a lab environment, eye tracking Moderator is a UX er, designer indirectly involved" " Process based

6 Usablity test drawbacks An extensive report, little or no redesign No retest Not in user context High costs: lab, eye tracking, special UX researcher Schedule well in advance (at least 1 month)

7 User Checks Agile Usability Test Test and retest within 1 week In the users context, quick and easy set up Designer conducts the test Value based

8 Design new site ggdhaaglanden.nl User check with a doctor in his office GGD Haaglanden project Angi Studio:"

9 From Ik weet niet wat OGGZ betekent, Milieu en Gezondheid is dit voor mij? I don t know what OGGZ means, Environment and Health is this for me? Menu indeling: geen overzicht, inzicht, herkenning, focus voldoet niet aan verwachting, weg wordt niet gevonden Menu: no overview,- insight, -regognition, -focus doesn t match expectations, user can t find what they need GGD Haaglanden project Angi Studio:

10 To Natuurlijk, ook SOA en bezorgd over kindermishandeling ja, belangrijk! Off course, also SOA and worried about child abuse yes, important! Wijzigingen op verschillende niveaus: wat waar onder valt, naamgeving, hiërarchie, toevoeging visuele cues (affordance), less is more Changes on various levels: IA, labeling, hierarchy, visual cues (affordance), focus, less is more GGD Haaglanden project Angi Studio:

11 Redesign LINDA subscription Project Angi Studio: Bij Meiden verwacht ik 14 tot 21...oh, ik denk dat ik toch wel in die doelgroep val als ik het zo lees? LINDA.Girls.. I expect this is for 14 till 21 year old oh, reading this subscription I think it actually does fit me? Pop-up information about LINDA.meiden

12 Sub home Subscription with incentive - mobile Zo onder elkaar is duidelijk, je kunt er zo doorheen Very clear and easy to walk through this way, underneath each other Lange lijst om te scrollen vormde geen enkel probleem Scrolling was no problem at all on mobile Navigeren met hoofdmenu gebeurde eerst ronde niet. Sticky menu bood ook geen oplossing Navigating via main menu on top wasn t used, it was ignored, even with a sticky menu dead end alert! 2 e round: de footer met menu, werd wel gebruikt Footer with next step was used Project van Angi Studio:

13 User checks drawbacks Too unexperienced biased designer Heavy pressure on improving the design within agile process (keeping in pace with development) With high fidelity testing it demands velocity for retest with high multidisciplinary efforts: product owners, IxD, visual design and content

14 powerful! agile usability testing with user checks

15 User Checks Agile Usability Testing Test and retest within 1 week In the users context, quick and easy set up Designer conducts the test Value based

16 User checks - Agile usability test cycle in 1 week Again or To final design 1 " Test Objectives 6 " Redesign 5 " Evaluate findings 1st round 2 " User goals 8 " Evaluate findings 2nd round 7 " User checks 4 " User checks 3 " Tasks

17 get down to it!

18 Usability testing is about observing behaviour Watch the user do what comes naturally, while performing a task. Don't help. Not asking about opinion.

19 What to test?

20 When to test Early as possible Often as possible ROI Save on development time Less support calls/ s More conversion

21 Procedure usability test 1. Let your user experience the prototype/mvp/site Show don t tell. Put your prototype in the user s hands (or your user in the prototype) and give just the minimum context so they understand what to do. Don t explain your thinking or reasoning for your prototype. 2. Have them talk through their experience (talk aloud) For example, when appropriate, as the host, ask Tell me what you are thinking as you are doing this. 3. Actively observe Watch how they use (and misuse!) what you have given them. Don t immediately correct what your user tester is doing. 4. Follow up with questions This is important; often this is the most valuable part of testing. Show me why this would [not] work for you. Can you tell me more about how this made you feel? Why? " Answer questions with questions (i.e well, what do you think that button does )

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

23 User Checks set up Test script with real tasks 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)

24 Test script-agenda 1. Introduction and questions up front 2. Situation sketch + think aloud instruction 3. Think aloud session 4. Evaluate session, open questions 5. End session - thank participant

25 Example Introduction Thank you for participating, we really appreciate it! I m <name> and there is one person besides me <name> is also here. We re helping a company to develop a new service / to optimize a website This company cares about their customers and thinks it s very important to involve potential customers when developing new services. They want the new service to be valuable for you. That s why we want to ask you some questions and along the way we d like show you the service/site. You can walk through it. The interview takes about a 20 minutes. If you do not understand something, or you want to add something, do not hesitate to interrupt me! Do you mind if we record the session for future reference within our organisation? Everything we discuss and record is confidential; we will not share things without your permission! Any questions?

26 Task-think aloud instruction You are going to see: a draft proposal of the service, which has not yet been developed/ the site now. <if a proptotype> The proposal is only images. It looks finished and you can click through it, but most of it is not working yet. It s also not as fast as a normal app and you can t do anything wrong. <Situation sketch and task> Please open the link on your mobile phone and walk through the app. Can you please say things aloud? Not to me, but for yourself? Everything you do or say is fine, eg. Also "what the hell is this?!. You can start now by clicking the link

27 Evaluation questions Evaluation questions after the think aloud task, zoom in to what you observed, like: You mentioned what did you mean with that? I saw you doing why? What did you expect? How would you call it? You didn t go to why not? What do you expect to find? Also ask service, product or content specific questions, e.g.: You read this advice/text thoroughly, why? You were going back and fourth between product X and Y, why? You chose X and said something about the participants, what did you mean with that?

28 a case!

29 Tell us The main goal(s) of the site/application Target users Main tasks, main questions of the users Context of use Do not tell us how you think the site works now!!!

30 Volunteers 2 moderators 2 users

31 Observers Yellow sticky notes for findings Objective, record behaviour! ONLY write down what you observe, like: mentions X and doesn t seem to not know what X is ; sighs heavily on returning to; is confused about; does not know where to go next, seems frustrated;. Other coloured sticky notes for possible improvements that pop up in your mind, like: feedback is missing; label is not understood; no focus; X doesn t meet expectation;

32 1st user check session! 20 min! 2nd user check session! 20 min! Findings & improvements! 20 min!

33 5 Evaluate Findings The findings, issues Collect Findings Prioritize issues to be solved: prioritize from the business/user goals perspective, rate them Do this with the whole team

34 5 Evaluate Findings Design improvements Improvements on every level, note down (labeling, content, categorization, visual assets, interaction, concept, flow, persuasion) > but keep the business/user goals perspective in mind (focus)! Prioritize by Impact & Effort (matrix) or dot-vote Choose improvement(s) to be re-tested Do this with the whole team

35 Impact & Effort matrix Impact: creates high/low value for users effort: high/low effort in terms of time, knowledge, tools, people Do this with the whole team incl. decision makers! Source:

36 6 " Hypothesis and improve Prepare to retest Improve the design Set up the hypothesis (or more than one) We believe that [this statement is true (e.g adding social proof, better labeling, visual cues will )] We will know we are right/wrong when we have the following result [quantitative feedback; qualitative feedback; KPI; }

37 What do you take along?!!

38 Questions?!

39 thank you!