Folláine
Mental Wellness for All
Project Type:
UI/UX Design
Date:
June, 2024
About:
Folláine (pronounced fuh-LOW-in-yay) is a new app that seeks to provide support and guidance to individuals on their mental health wellness journey. This forward-thinking app is human-centered and aims to make mental wellness accessible to all individuals by offering a variety of resources and tools to promote emotional well-being. With a focus on inclusion and accessibility, Folláine is designed to provide a comprehensive approach to mental wellness for users of all backgrounds.
The Challenge
Mental health is a major part of our lives that people are thinking about much more since the issues of the COVID-19 pandemic worldwide, but treatment - especially in the form of therapy - can be difficult to obtain, prohibitively expensive, and is associated with social stigma. The challenge was to develop a solution that would meet the needs of people, but those needs would be highly individualized.
My Role:
My role as the sole designer on the team was to research what solutions users actually needed and wanted, develop and ideate the solution, and perform user tests to ensure that the final product worked smoothly.
Tools Utilized:
Figma, FigJam, Google G-Suite, Miro, Mobbin, and Zoom
The Process
Finding the Right Problem
For this project, research was done in a variety of formats, including secondary research of available data and user interviews.
Research used sources from major mental health associations. To read the entire paper, please go here. All logos are owned and copyrighted by their respective association.
Secondary Research
Research highlighted the significance of identifying the most suitable mental health support for individuals, which can vary from treatment by medical professionals to self-paced options. It also showed that current mental health solutions primarily focus on prescribing medication, which can lead to dependency and discrimination. Furthermore, the stigma surrounding mental health concerns persists, though efforts are being made to reduce its occurrence. This suggested that a solution would need to be accessible within the normal daily activities, be able to have portions individualized to the user, as well as minimize any form of negative associations with its use in order to be successful.
User Interviews
User interviews were completed in order to gain a depth of understanding of what the users needs and wants were. Through the use of a screening questionnaire, five individuals were invited to meet and discuss their experiences with mental wellness and if a solution could be developed to better suit their needs. The insights gained were then used to direct the decisions made when developing the application.
Analysis
Click on the images above to open a full-sized document.
Data from the user interviews was organized through a thematic analysis and empathy map, which were then used to create a persona of the average user for the app. The key takeaways from this analysis:
-
Users wanted a variety of activities from which to choose.
-
Users wanted support and direction, but still wanted to feel "heard."
-
While time commitment and affordability were mentioned as barriers, they were not prohibitively so.
Putting these findings together, a more defined problem statement was developed to better direct the purpose and ideation of the solution.
The Problem Defined
People are struggling with mental health, outside of taking a pill, which gives them a sense of feeling less than, incapable, or broken.
How might we:
-
increase users’ confidence in getting the support they need for their mental health?
-
improve the affordability of supp9orts while maintaining their benefit?
-
increase user buy-in to the activities in which they participate?
The Pathway Uncovered
A new application that will guide users in finding a variety of activities to support their mental wellness, track their progress, and provide the encouragement to continue moving forward in their journey.
Designing the Right Solution
The time for ideation had arrived! First, a comprehensive look at what would define the Minimum Value Product was made to determine what were the critical pieces to develop. By focusing on what the users indicated was important to them, the sense of being overwhelmed by the possibilities was avoided. Highest among these priorities were the aspects that provided support and guidance - specifically with activities and developing helpful habits. Several components were deemed necessary for proper functionality, but did not set the app apart from others - such as account creation. A number of ideas were determined to be best saved for a future version of the app.
User Story to User Flow
After narrowing the list of possibilities to the priorities most desired by the users, a flow of the most important pieces was developed -- first as a site map and then as a flow chart indicating questions and inputs. This assisted in seeing the biggest steps of the process come together and set up the next stage of development.
Heuristic Competitor Analysis
By looking at competitors, the strengths and weaknesses of current mental health and wellness apps was considered. Industry standards for user controls, language, and content were determined. This helped to sharpen the focus on the features that would be offered, while decisively working to make the new app to be set apart from others.
Sketching Initial Thoughts
This is the first time that the ideas begin to take the shape of an app. Inspiration was drawn from a number of other websites and apps, including Facebook and Pinterest (icon placement and cards with images, respectively). While this was done, it allowed some further thoughts on placements and features to come to light.
Low-Fidelity Wireframing
Converting the hand-drawn sketches into their digital wireframe counterparts really brought a depth of ideas. Copy and images were reduced to greyscale so that balance and spacing were at the forefront of the process thinking. Some of the original thoughts were created easily enough for appearance, but would be difficult to prototype in higher fidelity. Furthermore, it showed that, while having varied input mechanisms (sliders, checkboxes, typing fields, etc.) might look interesting, it actually took away from the overall cohesiveness of the app. At this point, the thought of speech-to-text and AI was introduced to produce a more accessible interface.
Bringing Folláine to Life
If the wireframe is the skeleton of the app, then the copy, color pallet, icons, and imagery are what gives it true substance.
Brand Platform
First, brand platform was built to lay the foundation for the thoughts behind and feel of the finished look. Focusing on the vision, personality, and attributes provided a written artifact that could be referred back to to maintain the feel of the app.
Mood Board
Second, a mood board was created to help broaden that foundation visually. Colors were identified that promoted the feel that was desired, and imagery of both competitor apps and ones that had little, if anything, to do with mental wellness were included to show the desired feel of the design.
Style Guide
Finally, a style guide was started to record the features of the app so that future versions would also have the same feel. This document was maintained, reviewed, and updated throughout the process as icons or images were replaced. Any future edits of the app would still follow these standards.
Transforming Wireframes into High-fidelity Mock-ups
Once the brand platform and style guide were determined, the time had come to use those to bring forth the spirit of the app itself. Throughout this processes, small-scale usability tests were done, such as A/B testing for color pallet, selectors, and icon choices. The original color scheme, which included a separate primary/secondary color set based on the portion of the app accessed by the user, was set aside in favor of a single, continuously used color pallet.
A Few Areas of Focus - Red Routes
Medication Tracker - Support/Guidance
Focus on support and guidance were two of my main goals. By including a medication tracker, the user is supported in establishing and maintaining the healthy habit of taking their medications every day.
Do/Activities - Guidance/Variety of Activities
In order to provide additional guidance and include a variety of activities, the "Do" portion of the app was created. It includes four categories of activities, with the ability to select guided meditation or exercise videos that play directly in the app.
User Testing
Two rounds of user testing were conducted using the high-fidelity, clickable prototype. The first round consisted of five users and determined that users were having difficulties knowing which portion of the app contained which actions or activities. This led to the addition of a tutorial when a user first creates an account.
The second round of usability testing showed that this was effective in eliminating the confusion. Users also shared insights for possible future designs, including scheduling doses at intervals longer than a week for such things as monthly infusions.
The Prototype
After incorporating the tutorial and fixing a few cosmetic details, the finished prototype was finally ready for delivery! Please feel free to check it out!
Clickable Prototype
Learnings to be Used in the Future
Throughout my first UX project, I gained a wealth of knowledge and experience. the sole designer allowed me to explore all aspects of UX/UI design.
-
The essence of UX/UI lies in the user. I was unaware of the extent to which users influence UX/UI projects before embarking on this project It is now clear that we create designs with the user and their experience in mind, as they are the ones who will ultimately the product.
-
Conducting research is an essential aspect of the project. Initially, I didn't anticipate the amount of research required. I found this part to be very enlightening in the forms that the research can take, as well. However, every decision will be backed by thorough research.
-
Conducting tests and interviews is crucial in developing top-notch UX/UI designs. During the project, I participated in numerous tests and interviews, which played a significant role in refining the design into optimal version.
-
The design process is iterative, meaning it requires constant validation and refinement based on user feedback. This approach is not only present in my project, but also in many other successful apps. Even the most well-designed products continue to iterate their designs to ensure the best possible user experience.
-
Both UX and UI are crucial elements in design. Initially, I used to think they were interchangeable terms. However, after taking a course, I learned about their distinctions and how they work together to enhance the user experience.