03 – Usability Tests on Paper Prototype

Design and construct a low fidelity prototype of a solution to address a user need, by applying principles of design thinking, problem solving and critical thinking.

“Pay attention to what users do, not what they say” – Jakob Nielsen

User 1 Video: The user was asked to carry out two tasks. Add food to a meal in the Diary. Update fitness goals.

User 2 Video: The user was asked to carry out two tasks. Add food to a meal in the Diary. Update fitness goals.

User 3 Video: The user was asked to carry out two tasks. Add food to a meal in the Diary. Update fitness goals.

Below is the backup work that led to these videos.

1. Iterations on Paper

We practiced Crazy 8’s in class and collaborated on a few paper iterations. crazy8s-in-class.png

We created some on our own too*.

iteration-2

2. MarvelApp

From the sketches I created myself on paper, I created a series of iterations and imported them into MarvelApp: Iteration 1 Iteration 2 Iteration 3 Iteration 4 Iteration 5 Iteration 6

3. User Testing MarvelApp Iterations

I asked a user to test out Iteration 3 along my journey. I used DU recorder to do a quick test:

4. Findings from User Testing MarvelApp Iterations

After the user had tested it out, one observation he made was regarding the calendar. The user felt that there was an inconsistency in standards regarding selecting the date and that the tick and x options went against the efficiency of use. So I made an interation on paper, to amend this.

updated-calendar-after-testWe have since removed the calendar from our prototype, as it was not essential to either of our user tasks, but it was interesting to receive the feedback and reiterate the prototype.

From our individual paper prototype collaborations and MarvelApp prototypes, Sebastian created a more polished protoype in Balsamiq to test users carrying out two tasks.

All iteration tests can be found on my YouTube Channel.

5. The Actual User Test

We then met up and tested our first task on User 1, based on our persona of ‘Elaine’, who wishes to easily add food to a meal in the app. Sebastian read the script while I took the notes. We found that there was an error with the visibilty of system status after she added an item to her meal because there was no obvious confirmation when her task was completed and she felt like she was in a loop. She also found there was some visual overload, due to the hand drawn prototype and said it would be more flexible, efficient and easier to avoid errors and to recogise her position within the app if the prototype was more ‘digital looking’.

“Confusion and clutter are the failure of design, not the attributes of information” –  Edward R Tufte

So we created a clearer and more minimal and aesthetically pleasing version in Balsamiq and tested her again, the following are our findings:

User 1 Test (same as top of blog)

We also performed a second user test based on our persona ‘Paul’ who wished to update his fitness goals. Here is the result of User 2 performing this task, plus the task of adding food to a meal in the diary:

User 2 Test (same as top of blog)

Finally, we performed a third user test based on our persona ‘Karen’ who wishes to add food to a meal in her food diary and update her fitness goals. Here is the result of User 3 performing these tasks:

User 3 Test (same as top of blog)

Backup for Final Tests

6. Observations for Next Iteration

“Good designers want to be proved wrong, bad designers hope to be proved right” – Andy Budd

“I wasn’t sure if I need to go to the diary or my day to add meal, but I chose correctly” – User 1, Magda

Based on the above comment plus other points we picked up from observation such as:

Verbal comments included:

  • “Make path to diary clearer”
  • “Home screen needs more consistency”
  • “There are circles for update goals, diary is confusing”
  • “Make + button bigger”
  • “Diary should also have circles”
  • “Confusion on how to get back to home screen”

But as Jakob Nielsen says,

“Pay attention to what users do, not what they say” …

The following things I observed by watching how the user navigates the app:

  • User 1 goes to the top of the food history in search of an egg. It was where she expected it to be. (Path 1)
  • User 2 also began his search for the diary at the top of the screen. He found it in the second place he looked; the middle of the screen. (PUT DIARY AT THE TOP OF PAGE)
  • User 3 immediately went to the bottom bar to add to the diary. (Path 2)
  • User 1 uses the + button to add to the meal. (Path 1) User 2 did not use the + button to add to his meal, he clicked the heading of the meal ‘Breakfast’. (Path 2) 
  • User 3 also clicked in the diary area rather than the + button and said the + button was too small to see. (MAKE THIS BIGGER)
  • User 3 became lost on the home page when entering the second item to the meal, bacon. The visual hierarchy was not clear to her, consistency and standards were not being met for this user.
  • User 1 goes to the top of the app and scans left to right in search of the home button, second place to look is where it actually is, in the bar at the bottom right. It was in the third place she looked and wasn’t where she expected it to be.
  • User 3 went straight to the bottom bar again for home, but User 2 also searched for the home button on the top left first, as did a user in an earlier iteration I made. (PUT HOME BUTTON TOP LEFT)
  • To update fitness goals, again User 1 scans the top of the app for the bar, left at the burger and then right, finds it at the top right. It was in the second place she expected it to be, top right. User 2 found this top right straight away. (CAN BE KEPT TOP LEFT)
  • Users 1 and 2 chose to enter the goal weight by clicking on the onscreen keypad. (Path 1)
  • User 3 tried entering the new weight into the field where the original weight was and became confused when she couldn’t achieve her goal. (Path 2) (MAKE NUMBER FIELD A PATH TO CHANGE GOAL WEIGHT ALSO)

We took notes on post-its regarding the highlights and lowlights and user comments throughout both tests:

highlightslowlights2.png

highlightslowlights in realtime

teresa highlights lowlights

7. Conclusion

After testing, observing and surveying users, we believe the following improvements need to be made:

“It doesn’t look like I can click on the diary section on the home screen, it needs to be more consistent” – User 2, Padraig

  • There should be a home button on the top left
  • Circles for the food diary to make it consistent with exercise and progress
  • Diary should go at the top of the page
  • Add colour
  • Add clearer visual confirmation of weight updated
  • + Button bigger

We wrote up a post test survey for our users to complete so as to give us some insight for the next iteration.

*All my iteration sketches, consent forms, questionnaires and scripts can all be found in my attached zip file

References:

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s