Goodlife Mobile App: Full Project Summary

When I first started this project in Assignment 2, I needed to produce three variations to choose from namely: context variation, aesthetic variation and accessibility variation.

Chosen Concept: Context Variation

Context Variation

This first concept had to be centered around designing an app for rural Australians who suffer from obesity and/or depression. The goal was to provide group-focused exercises on the app so that they feel included and motivated when using the app. Therefore I provided two main features which would enable the users to achieve their goals. And in the end, I chose to go with the contextual variation as chosen concept to develop in this last assignment. This is because I think it is important for usual users to feel a sense of familiarity while using this app and as for the target audience to know Goodlife a bit better through this app.

However, when receiving feedback on these screens, my peers expressed that the app although is respecting the visual design of the company, it looks a bit too plain and lifeless. Therefore it would be better to add more colours on the screen. For instance blue also forms part of the brand’s colour palette and it will be an interesting route to follow.

For the icons, they need to be changed as they are too sharp and do not follow the photons principles which doesn’t make the icon aesthetically pleasing.

Figma Protoype

Landing screen | Homepage | Group-focused exercise | Book a trainer

From these screenshots you can get an idea as to what the app I developed on Figma became after the feedback I received for Assignment 2. Once I was done creating the screen design, it was time to create the prototype. After hours of hard work I was ready to commence the user testing which is a crucial part of the design process for UX design. Without feedback and user testing how do we know our app fully meets its goals and is functional? However, before that there was another step.

A/B Split Testing

For this step I had to use the A/B split testing to create 3 screens with 2 variations each.

A/B Split Test 2 & 3
A/B Split Test 1

User Testing

Then it was time to start with the user testing. I had to find at least 5 participants and the method used was interview. I had already two participants at my house; Jason and Marie-Noelle. Therefore I was physically present during the interview. However, I still needed 3 other participants and decided to use Zoom to contact them and then screen record the user testing. The process went quite smoothly. Zoom meeting participants name: Saadiyah, Salena and Shruti. After that I had to compile the data collected from the interviews into a User testing report.

User Testing Screenshots

User Testing Report

While conducting this user texting I was quite surprised that some of the users did not get right away the purpose of this app and it seemed that some of them also struggled to get started on the app as they had to tap several times on a button or icon for it to complete the task. But I realised that it depends on the internet connection and not necessarily because of the prototype itself. However, they were overall satisfied with the experience.

The version I presented to them was based on the feedback I received on my high fidelity screens in Assignment 2 and decided to add blue and black which are also colours of the Goodlife visual identity. However some of them were quite adamant on the fact that they did not like the gradient effect as it looks a bit to outdated to use on a mobile app. In addition, the app’s body copies were easily readable and legible and although it took some time at first, once they got used to the app features, the users were able to navigate quite easily on the app which is a great sign.

Changes for the final Prototype

The main complaint I received was the lack of an “about” screen on the app explaining the purpose of this app and introducing the client Goodlife health clubs. This is an important aspect I did not consider while creating this prototype. Therefore I will be adding this option in the drop down menu when the user clicks on the hamburger icon.

Next, the second change I will perform is regarding the visual elements of the app by removing black backgrounds and gradient backgrounds as well ass they are either distracting or too outdated for the purpose of this app. The key here is beauty in simplicity.

Finally, I will review the problem of clickable buttons. Some of the users were confused as to what buttons were clickable or not. To do so, instead of using buttons which uses only stokes, In will fill the buttons with solid colours as well as adding drop and inner shadows to signify which buttons are clickable or that you need to input information like for the sign in/sign up screens.

Final Prototype

The last step was to put in practice the feedback I received from the user testing. Here are some of the changes I made.