Life Emotions
Life Emotions is a California-based organization of psychologists focused on providing therapeutic help and reporting on emotional intelligence. The organization requires an application that allows them to effectively accompany its main users, among whom are children and adolescents between 4 and 17 years old who need to learn about emotions or who require accompaniment psychological.
Project overview
The Problem:
At least 20% of children and adolescents around the world develop a psychological disorder associated with stress, depression, and anxiety. The organization Life emotions has detected that a large part of these disorders could be prevented or significantly improved if people had more knowledge about emotional intelligence.
The Goal:
Design an app that provides information on emotional intelligence and related topics, and helps people find psychological help.
My Role:
As a general UI/UX designer, I was involved in a one-on-one project where I designed a virtual tour app. In this project, I used Design Thinking, so I started working on conducting interviews and defined through exercises like user personas and emphatic maps. Then I ideated using Crazy Eight and how might we, for later start to design high and low fidelity prototypes, paper and digital wireframes, UI kit, Design System, navigation schematics, design interaction, voice guidance, and product tone, finally I tested the app through usability test.
Understanding the user
User research - Personas - Problem statements - Competitive audit - Ideation
User research: summary
I carried out my research based on Life Emotions statistics on the precarious information that exists in children and adolescents about emotional intelligence, I conducted interviews with users, and most of the participants were unaware of issues related to mental health; however, a large percentage of them stated that they would be interested in learning more about emotions if they had an app at their disposal that allowed them to learn about them.
Persona: Martha Sierra
Problem statement:
Martha is an early childhood education teacher who cares about teaching her students ages 3 to 5 about emotions. She needs to find an easy and fun way to teach emotional intelligence to her youngest students.
Persona: Santiago Soto
Problem statement:
He is Santiago, a fifth grade student and video game lover; Santiago would like to learn some tricks about being more confident, so he can make new friends at school.
Competitive audit
A competitive audit of some competing products guided us on the gaps and opportunities to address with the Life Emotions application.
Ideation
I did a quick exercise to generate ideas on how to address the differences found in the competitive audience, in this case I focused on prioritizing the daily emotions of the users.
Starting the design
Digital wireframes - Low-fidelity prototype - Usability studies
Digital wireframes
After making some paper wireframes, I created the initial layouts for the Life emotions app. These designs focused on providing information on emotional intelligence and mental health focused on the needs of users.
Low-fidelity prototype
To make a low-fidelity prototype using digital wireframes, the flow of users that connect is destined to carry out the activities of the app, so the prototype can be used to carry out a usability study.
Usability study: findings
Carry out a usability study on 7 people from the low-fidelity prototype. During the investigation process, I was able to determine the following findings:
Round 1 Findings
People want access to different topics about mental health and not just about emotional intelligence
Round 2 Findings
People want to have access to useful contact telephone numbers with psychologists who provide free services
Round 3 Findings
People want the app to specify the age allowed for use
Refining the design
Mockups - High fidelity prototype - Accessibility
Mockups
Based on insights from usability studies, I applied design changes like providing a clear section from any of the screens to go straight to the useful phones.
Additional design changes include adding real sounds to the "recognize emotions" activities to make them accessible to the blind.
Mockups
High-fidelity prototype
Based on user needs, the final high-fidelity prototype features better accessibility and a cleaner user flow for navigating within the application.
Accessibility considerations
1
Videos, activities and books with audio, accessible for blind people
2
A menu is applied to all screens for easy navigation
Responsive Design
Information architecture - Responsive design
Information architecture
With the mobile app designs complete, I started working on the responsive website design. I used the Life Emotions sitemap to guide the organizational structure of each screen layout for a seamless and cohesive experience on each platform.
Responsive design
Layouts for screen size variation included mobile, tablet, and desktop. I optimized the designs to adapt to the accessibility needs of each user.
Going forward
Takeaways - Next steps
Takeaways
Impact:
Users felt emotionally accompanied, they felt motivated to learn more about mental health and emotions, one of the users mentioned "I have learned to control and understand my moods, I feel happy and relieved thanks to this application"
What I learned:
I learned that designing for social good goes beyond designing an application and all that that entails, designing for social good is to improve the quality of life of the people who need it most (and those who don't either), design to include, design to improve the world, design so that everyone can be part of the change; it is a constant creative process that makes you come out of your bubble.
Next steps
Perform usability studies to improve accessibility
I will implement a search engine by location for psychological care
Add more sections on mental health