Nonkululeko Mashiyi
Mental Life
UX Design / UI Design / User Research/ Usability testing
My Role
Sole UX/UI Designer
Duration
Tools
Figma, Sketch, Paper & Pencil
3 Months
Overview
As part of a rigorous hands-on design course that covers the design process from end-to-end, I was tasked with completing a project. I chose to create Mental Life, an easy to use mobile first app that connects users to professional therapists and credible mental health resources.
Watch a Demo of the Final Product
Design Process
Empathize
I started the empathize phase of my process by conducting market research and interviews to better understand who the potential market could be as well as better understand the solution that needed to be created.
Interview
I conducted remote research interviews to gain a well-rounded understanding of my users’ needs, goals and pain points. I asked questions focused on users’ experiences with finding mental health resources and finding therapy. I then analyzed my users’ experiences with finding mental health resources and finding therapy. I then analyzed my users’ answers by sorting them into an Empathy map to gain in-depth insight
Personas
Using my findings from the user research and interviews, I created user personas to represent users with different needs, paint points and backgrounds
User Journeys &
Flows
In addition to the personas I also created user journeys and user flows for the apps main functions. I wanted to understand how MENTAL LIFE users would complete a function and what they would need to accomplish it.
Define
My findings revealed that there was one well-known, direct competitor to my app, the only difference being that the competitor only offers a responsive website. This means the potential for Mental Life App is huge. I decided to seize the opportunity of creating an app users’ didn’t know they need.
Problem & Solution statement
My findings also assisted me in drafting my problem statement and creating possible solutions to the user needs
User needs
The user research helped me revise my possible solutions and user stories. Moving forward, I started designing the app, with the following functions
Ideate
I started the ideate phase of my process by conducting market research and competitive audit to better understand who my competitors were and what they did well or lacked.
Site Maps
Then created a site map to organize the structure of my app and have a visual depiction of the screens and how they relate to each other.
Sketch
Next I started sketching low-fidelity wireframes with pen and paper.
Prototype
I moved on to Figma for my mid- and high-fidelity wireframes. Throughout the different fidelity stages, continuous iterations were made to improve the app’s functionality and UX.
Test
Usability Testing
I prepared for usability testing by creating a test plan and test script to ensure an easy and smooth testing experience for my participants.
I conducted moderated remote usability tests and was able to gain valuable insights. Using my findings from the tests, I noted the findings into a spreadsheet then created a affinity map to analyze the results and map out insights and prioritize the errors that occurred during testing.
Final Mockups
Style Guide
I used real and vibrant images to engage users and get them excited to use the Mental Life App. I wanted the images to be inviting and inclusive in representation to give users an idea of possible therapists that are attainable on the app for different users. The images and features also showcased a wide variety of information for each therapists at different price points to ensure that the app was appealing to different users’ needs and budgets.
Colour
The apps main color is green. The choice in green came from my goal to make the experience of finding mental health resources fun, lively and enjoyable. I decided to do my research on the color green and discovered that the color green is the color of life and it is universally associated with nature, health, growth, and prosperity as it is often found in grass, plants and trees. I also discovered that the color green also represents growth and renewal, being the color of spring and rebirth. This closely correlates with the main purpose of the Mental Life app; users seeking mental health resources in their efforts to find help, healthy habits, growth, health and renewal in their mental health.
Typography
For the typography I made use of Mina for the Logo, to give the app a professional and an inviting appeal to it. For all other text I made use of Poppins, a geometric sans-serif typeface font, to ensure legibility and a clean and simple interface.
Icon
I made use of simple and universal icons, ensuring that the icons were visible and clear was my main aim. For the most part making sure that the colors and size were appropriate for the UI of the app.
Final Reflection
I found that through discovering the pain points from interviews with people practicing within the psychology field and assessing their experiences in finding mental health resources for themselves, I discovered new insights and ideas that could be added to the solution. Having interviews really allowed me to empathize with the user ensuring that the solution created is not just another product but actually a solution to users’ specific needs. The aims for this solution was to make a seamless process of scheduling an appointment with a therapist, acquiring healthy life skills through articles and book resources by using the responsive website or application.
​
Though I was drawn to the visual design of the app, I discovered that the part I found most crucial was research and usability testing. I also learnt that I need to work on acquiring participants that are diverse and more inclusive, as this project was limited to participants that were in close proximity. Because the product can have a wide variety of users, ensuring different participants test it is vital to making the design better after every testing.
​
I would also like to increase the accessibility of the app considering language translation options making the app equitable. I would need to also test the app on older users because considering old users who are less tech-savvy and/or impaired need to also have their needs met as they use the app.