Nestlé Hydration Calculator 04: Final user testing

A brief introduction: During my graduation internship at Poke I was asked to work on the Nestlé Pure Life website, specifically the hydration calculator and infographics. In this series of post, I’m writing about my design process and what I’ve been learning along the way.

Learning from last user test, I didn’t take me long to prepare for the final user test. I already had my interview guide prepared and I knew how to choose my test subjects.


  • Dom: Design director at Poke
  • Jen Williams: Head of UX at Poke
  • Sam Hails: UX designer at Poke
  • Johan: Back-end developer at Poke
  • James: Junior designer at Poke
  • Lee: Producer at Poke

Note: As some of my participants are experienced in the field of UX and UI design, the user testing sessions were partly interview and partly expert review.

Interview guide

I used the interview guide which I has already created in the first user test.

Screen record of the prototype I used during the user test (mobile)

Desktop Prototype:
Mobile Prototype:

Conducting the tests

Over 2 days, I conducted the tests with 6 users. Each session lasted about 20 minutes. For some session, I tested both the desktop and mobile prototypes. However, not all participants had the time to go through both versions.

Learning from the previous user test, I set up audio recording in order to focus on interacting and observing users. After the tests, I listened to the audio file and wrote down the important thoughts, comments, and suggestions.

Analysing Data

There were a lot of feedbacks, some of them were subjective, some were useful. At this stage, I was nearly finished with the design and didn’t have enough feedback to group it into meaningful themes. Sam and I went through the feedback together to extract the useful points.

I then prioritised the feedback based on the following criteria:

  • Red: Stops the user completing the primary task (completing the calculation) and secondary goals, in order of priority:
    —clicking on the sett up a delivery button
    —browsing bottle sizes
    —sharing on Facebook
    —continue browsing via the ‘read more’ module
  • Yellow: Negative but not critical comment — worth discussing
  • Grey: Subjective comment not backed up by other test subjects.
  • Green: Positive comments.

Actions to take

Due to timelines and the knowledge that we would need to absorb client feedback, we decided to action the red points and some of the yellow points that made sense and were easy to implement. For the rest, we held back until we receive feedback from the client.

The red points were:

  • Turn the ‘Start again’ button into a small CTA. The copy should read ‘Start a new calculation’ to make the destination more clear. This is not the primary CTA. At the moment, it’s too dominant and not the most important thing on the page.
  • Need an arrow that guide people to scroll down on the result page

After discussing with the team, here are some of the yellow points that we decided to take action:

  • Simplified the groups in the ‘Activity Level’ question. The copy should read ‘What is your general activity level’ in stead of ‘How often do you exercise’?
  • Create an tick box in the first step of the family calculator to ask if any of the adults in their household are pregnant or breastfeeding. Only if they check it, then we show the ‘Special consideration’ step.

Updated Marvel Prototype:



In general, the feedbacks I received were quite specific with only two red points. Testers found it easy to go through the calculation and gave compliments on the design. The positive comments I received on the little water character and the did-you-know fact confirmed that they do make the experience more caring and helpful.


Although I’d love to get feedback from the client before presenting my graduation project, it was simply not possible due to the commercial reality and project timeline. However, the design has been signed off internally by the team during our review.