Designing a mental health app for c-care — A UX designer case study
Project name : BetterDays (blog part 2)
STAGE 1 PROTOTYPE
Desktop
Mobile
After the stage 1 prototype was done, it was time to test it !

Testing has helped me to understand the user flow better and how I can make navigation throughout the app better. But the main issue was mostly on the aesthetic of the web application as it was dull. The colour didn’t fit the purpose, and the choice of images was too difficult to perceive or understand example, they didn’t know if it was supposed to make the user feel better, especially if they were going through a tough time. So they expect to see something more bright, enthusiastic and motivational.
The improvement to be made
● To work on the design and colour palette throughout the app
●To put indications on how and where to navigate ( makes it easier for the. user)
●To put a positive feedback at the end of each activity on the My track feature to make it more engaging
This a before and after improvements!

The layout stayed the same, but the aesthetic changed. The gradient colour gives the user a soothing feeling, and the image on the homepage was changed to a more lively visual as this would be the first impression. Moreover, the navigation bar was removed as it looked like a traditional website. Thus, not having the nav bar gives the web app a more modernised touch.

The signup and sign-in page layout have changed. Firstly, on the new interface, the users can either sign in or log in without having to go back to the homepage and sometimes, going back to the home page, they can easily lose interest. Giving this option creates a better affordance for the user. Secondly, in the first layout, the background was plain. Instead of making the user feel at ease, it has a serious look and feels, and that’s not what I was aiming for. Therefore I added a vector illustration that looks calming and relaxing. This also gives the user the impression of how they would feel after using the web application.

The 4 sets of question to get the user started!
This will help the user afterwards; once it enters the web app, it will help generate content depending on their current state of mind. Moreover, inspired by my research on design trends, I have used a transparent element and a progression bar, as this indication will help the user know which question it has reached and how many are left.Thus, they won’t lose interest or feel overwhelmed by not knowing.

My track feature was boring initially, so I added a feedback feature. So when the user has completed an exercise, it receives “well-done” feedback to keep them going, which is animated! Hence, this motivates them to complete their everyday exercise and is good for their satisfaction of accomplishment.
Stage 3 prototype Final
Future improvements
. Connect with friends
. Receive rewards upon exercise
. create a ladder board
. Add an urgent feature when booking if the problem can’t wait and the individual want to talk someone straight away it should be able too
. Add motivational notification optional
. Add reminder for appointment
. save or heart features for the tip/ explore page so that it can be reviewed later on