Joyfull
Lead UX/UI Designer
A daily mindfulness app, providing guides on meditation, exercise, to improve overall wellbeing.
Time scale: December 2020 - April 2021
Tools: Figma, InVision, Illustrator
UX Designer: Including researching, interviews, wireframing,
prototyping, personas etc.
Design Process
I followed this methodology, but then looped back when developing the projects.
This iterative process is what allows me to continuously check in with the users point of view and continuously improve the outcomes.
Understand
Hypothesis
Problem Statements
Competitive Analysis
The starting point for my project was to define the problem we wanted addressing. This was outlined by an initial hypothesis. From this I wanted to address problem statements from the user’s perspective and then conducted a competitor analysis to discover what was already existing in the market.
Initial Hypothesis
During the pandemic and lockdown, life’s distractions have been removed. The usual structure and routines that had been created have been disrupted and on top of this everyones mental wellbeing has been challenged. Therefore, we believe that by encouraging Joyfull users to take time each day for themselves, this will improve their health, both mentally and physically.
Problem Statements
We want to help users build a ritual for themselves into their routine, and while there is a growing popularity with tracking personal health information with different apps. Users need a way to view this information all together. We want to keep this information clear and personalised to avoid too much extra time looking at a screen due to its detrimental affects.
We know this to be true when we see dedicated daily users becoming informed of their key data and completing their personalised goals, while not hunting for separated information in various apps.
Competitive Analysis
Similar apps, such as Calm and Headspace offer such services, however Joyfull will have wider mental health reach and an option to feed the user a daily session. This could be meditation, podcasts while heading out on a walk to get some fresh air or conversation starters with friends to open up with each other.
The research was focused by using the SWOT analysis approach to review their overall points then concentrated on the more specific UX/UI elements.
Observe
User Survey
User Research
Goals for user research:
Better understand mental health awareness
Discover what habits people identify as helpful/harmful for their mental health
Find out if people would be willing to develop a new habit
Establish how + where people use fitness/meditation apps
User Survey
While some of the participants state how important routines are, all of them say they don’t always stick to such plans. Therefore, while it’s a goal to set up daily routines, the tone of the app should be encouraging participation in sessions but not pushing for strict schedules.
Daily commitments can intimidate users too, so here it would be important to get to know the user, and their goals. Users stated that if they are persistently and frequently reminded to complete tasks, they’re more likely to delete the app entirely.
User Research
I conducted three initial interviews, gaining a huge amount of research. I took the feedback from these conversations and used affinity mapping to group similar topics.
This ending up in a focus on: Behaviour/Attitudes, Needs/Goals, Frustrations, Routines and Features.
POV
User Personas
We created three personas for the project from the surveys, interviews and research conducted.
Each differing in situations, allowing us to step into the shoes of different users, each with their own perspective.
Josh
The planner
They are organised and plan ahead. They like working out when they can and appreciate the physical and mental health benefits.
It’s important to them to schedule things in so that they stick to the plan.
Julia
The spontaneous
They’re active but don’t like to follow a set timetable. They enjoy flexibility in all areas of life.
They love having options available but will dip in and out of varying routines.
Katie
The aware
They know how to keep on top of their mental health and that prevention and constant work is whats best for them.
They keep on top of things and openly talk to friends and family for advice and help.
Ideate
User Flow
User Journey
At this stage of the project we started to visualise each step the user would take to complete tasks. Due to the personas we could be more personal and emotionally informed when designing the user journeys, too. It felt important at this stage to look at the overall flow, rather than just screen by screen.
Prototype
Wireframes
Low to High Fidelity PrototypesWe could then begin to bring all the research and planning to life, first with low fidelity sketches, and slowly iterating them into high fidelity screens. Here you can see the development made across some of the screens.
Test
Usability Testing
Next we conducted six usability tests with the prototype, the tests started with a brief introduction to app to them, then the participants were asked to try and complete three simple tasks. After these were completed, we then discussed general feedback they had regarding any aspect of the app. This process led to a huge amount of valuable feedback, which then fed into the next iterations.
Background Questions
Do you ever use any wellness/fitness/meditation apps?
If yes, which ones? If no, why?Do you stick to routines with these apps or use them often?
What helps you stick to routines?
What’s the main thing you’d use a wellness app for?
E.g. guided runs, walks, meditation, mood trackers etc?
Tasks
How would you personalise the main home screen?
Find a session that suits your mood and change the length of the session for the time you have available.
Using the app, schedule some sessions to remind you to stick to your routine.
GOAL
Our primary goal was to review the learnability of the app for a first time user. Then we wanted to check how easily the users grasp the navigation by requesting they complete some of the common tasks within the app.
OBJECTIVES
Test the app’s information architecture. Does it make sense?
Does the user understand the apps mission and could this fit into users lives?
Do the features function and do the participants have feedback on the flow?
RESULTS
All six participants could complete the task and generally found the design intuitive. However, tasks showed some points of the app that could be improved on so I used a usability map and rainbow spreadsheet to organise and prioritise the iterations.
Visual Design
Style Guide
BrandingTo pull the whole design together, we focused on calming colours throughout the UI.
Creating a cohesive and united brand is important for the user within the app,
and then onto the marketing of the product. It’s the last step for communicating the product’s intention.
Handover to Development
& Conclusion
To ensure the handover to development was smooth, I checked the file was labelled clearly, provided the style guide and shared the tidy Figma file.
After the reiterations of the design process, it was a chance to reflect on the project. Moving forward I’d like to plan more detail with the site mapping, and explore the initial features of the product.