Think Aloud Protocols are designed to highlight the strengths and weaknesses in a system by encouraging participants to voice their thoughts as they navigate through the system. After conducting a think aloud experiment with four participants, there were elements of our system that caused confusion amongst multiple participants. These elements of our UI may not be designed in the best possible way to ensure a positive user experience. The aim of these experiments was to discover what elements of our system need to be redesigned so that we can offer the best user experience possible and ensure navigation through our application is easy for the user.
There were a few elements of our interface that caused participants difficulty, one of which was the select character screen. One user attempted to press the characters name as opposed to her avatar in order to select the character. This caused confusion as the interface did not react to this interaction. This is a simple design flaw and can be easily fixed by adding a link to the characters name, that way either the avatar or character name will allow the user to progress to the next screen.
A prominent issue that occurred during the experiments was users overlooking the read button that displays the informational text, a few participants had navigated through a few screens before they realised that the button was important to gain the information and put the imagery into context. As a default we had designed the application so that the text div was collapsed, and muted. To fix this design issue the read button will by default have the text on-screen and the button can then collapse it. The voiceover will also play automatically. These design changes will ensure that users are aware of the information text from the beginning as it is of huge importance within the app.
For one participant it took a few screens until they realised there was an interaction when they tapped the image on every page. The user did not press the image and see that they could interact with it, they were a few pages in before they realised that was an option. To fix this issue on the first page with an interaction, the informational text will instruct users to interact with the imagery on screen. Any interactions or animations that can be played on loop to add interest to the imagery should also play without a trigger. This will allow for the screen to seem more interactive and less static.
The final issue that occured with participants was confusion between the ovulation and menstruation screens, as the imagery is similar aside from the position of the egg on screen, one user initially navigated past the second screen assuming it was the same as the first. To solve this issue the background colour on the second screen will be changes so that it is different from that on the first. This will ensure that it is obvious to users that the screens are different. Going forward we will also ensure that all consecutive screens have different background colors.
Let's Talk - Project Blog 