Emotilab

EmotiLab

Emotilab is a dynamic and interactive app that empowers children to understand and manage their emotions. Through engaging games, practical resources, and tailored feedback, Emotilab turns emotional learning into an exciting journey. Discover the world of emotions with Emotilab!

Project duration
march 2023 - july 2023
My role
  • ux ui designer
  • Interaction designer
  • visual designer
  • user researcher
  • information architect
  • user experience analyst
The problem
No engaging app for kids to learn emotions & manage them. Urgent need: A platform for kids to understand & handle feelings, boosting mental wellness.
Responsibilities
  • researching user needs, preferences, pain points.
  • guiding decisions via personas, journey maps.
  • visualizing concepts with wireframes, prototypes.
  • crafting user-friendly app, website interfaces.
  • testing, refining designs using feedback.
  • structuring content for clarity.
  • creating cohesive visuals.
  • ensuring consistent experiences.
  • data-driven decisions from user insights.
  • iterating based on feedback, usability.
The goal
Create EmotiLab app to promote emotional intelligence and mental health awareness, empowering users with essential emotional management skills.
EmotiLab

Understanding the user

  • User research
  • Personas
  • Problem statements
  • Competitive audit
  • Ideation

User research: summary

User research for the Emotional Learning App included interviews, usability testing, and analyses of how children aged 7-12 and teachers use the app. The research provided insights into children's emotional learning needs and preferences, which helped to improve the design and functionality of the app to create a more effective and engaging tool for developing emotional intelligence.

Persona 1: Emily

Problem statement: Emily is a young student who needs an app that can help her learn about emotions because she wants to better understand and manage her own emotions.

Emily Persona Story:
As a teenager, I want to use a mobile app that provides daily tips, advice, and inspiration on managing emotions and mental health so that I can build resilience, manage stress, and improve my self-awareness, which will help me navigate the challenges of adolescence and transition to adulthood with confidence and positivity.

Persona 2: Sarah

Problem statement: Sarah is a school psychologist who needs a platform that provides resources and tools on emotional intelligence and mental health because she wants to support the overall well-being of her students and improve her counseling skills and knowledge

Sarah Persona Story:

As a special education teacher, I want to use a tool that provides visual and interactive materials on emotions so that my students with special needs can better understand and express their emotions, improve their social skills, and succeed academically, which will enhance their overall development and quality of life.

Competitive audit

Goals and Thought Process:

  1. Analyse the competition: Understand the strengths and weaknesses of competitors in the emotional learning app market to identify opportunities for differentiation.
  2. Optimise the user experience: Create an intuitive and engaging user interface for EmotiLab based on competitor analysis to ensure a seamless user experience.
  3. Ensure accessibility: Implement accessibility features in EmotiLab to make it inclusive
    and user-friendly for all people.
  4. Emphasise unique value: Emphasise EmotiLab's unique value proposition to stand out in the market and attract our target audience.
  5. Improve features and flow: Improve EmotiLab's features and user flow based on competitor insights to maximise user engagement and satisfaction.

Ideation

  1. Diverse Learning Content: Offer interactive games, videos, texts, and meditations to cater to various learning preferences.
  2. Mindfulness Integration: Include mindfulness exercises for emotional well-being and regulation.
  3. Gamification for Engagement: Implement gamification to make learning fun and encourage consistent use.
  4. User-Centric Design: Prioritize ease of use and intuitive navigation.
  5. Iterative Design Process: Continuously improve based on user feedback.
  6. Inclusivity and Accessibility: Ensure accessibility for all users.
  7. Personalization Options: Provide customized learning paths and recommendations.
  8. Emotional Feedback and Progress Tracking: Offer insights on progress and emotional growth.
  9. Collaborative Features: Promote social learning within a supportive community.
  10. Safety and Privacy: Ensure data security and user privacy.

Starting the design

  • Digital wireframes
  • Low-fidelity prototype
  • Usability studies

Digital wireframes

The overall aim of this app was to resemble an emotion tracker, offering potential solutions to internal experiences through games, meditations, and more. Therefore, the primary screen needed to display the main functions and features. The user interface should be highly user-friendly and intuitive, considering the app's target audience is children. Simplified navigation and interactions are crucial to ensure ease of use for young users. During the framework stage, the meditation page lacked thorough planning and organization. It was missing headings and filtering options to help users easily navigate and find specific meditations. Improving the meditation page's structure and adding clear categories and filters would enhance the user experience.

Initially, considered dividing the emotion of the day into icons and swapping them, but I later realized that this decision was inconvenient and unclear for users. As a result, abandoned this approach. Instead, improved the emotion calendar by allowing users to view statistics for different periods, such as a week, a year, or six months. This enhancement allows users to track their mood changes over time more effectively.

These three screens represent the initial version and are designed to be as standard as possible. However, they are not the final design, and I had limited ideas about the end result at this stage. Therefore, I don't see the need to focus too much on these screens. Further iterations and improvements will be made to enhance the overall design.

Low-fidelity prototype

  • Home Screen: Users are greeted with a welcoming interface featuring the emotion of the day and access to various emotional learning activities.
  • Emotional Diary: Users can record and track their emotions daily, view past entries, and access statistics to understand their emotional patterns.
  • Meditation Page: Users can engage in guided meditation sessions, filter content based on their preferences, and explore different topics for emotional well-being.

Usability study: parameters

Study type:

moderated usability testing

Location:

Remote (video call)

Participants:

Children aged 7-12 and teachers working with children in this age group

Length:

30-60 minutes per participant

Finding

Participants strongly desired more engaging and interactive activities in the app. They highlighted the need for content that involves active participation and provides a hands-on learning experience.

Finding

Some participants found certain scenarios in the app confusing, indicating a need for improved clarity and guidance during these interactions. Providing additional explanations and step-by-step instructions can enhance user comprehension.

Finding

Participants reported difficulty understanding emotional vocabulary presented in the app. To address this, integrating emotionalvocabulary education with real-life scenarios and practical examples can improve user learning and retention of emotional terms.

lmproved wireframes

Reduced design

  • Mockups
  • High-fidelity prototype
  • Accessibility

Mockups

Usability study led to enhancements: Enriched emotion materials, improved content engagement. Highlighted points and lives for user progress. Enhancements foster interactive, rewarding experience, promoting emotional exploration.

After conducting a usability study, we made significant improvements to the app. One of the key changes was the addition of a meditation filter, allowing users to easily find specific meditations based on their preferences and needs. In addition, the app now has a separate section dedicated to recommended meditations. users personalised and curated content to enhance their meditation experience. These improvements have been made in order to increase user satisfaction user satisfaction, ease of use and overall engagement with the meditation feature in the app.

High-fidelity prototype

Peer Feedback Implementation:

  • Based on user feedback, I simplified the navigation and made the games more visual for children.
  • I added playful animations and illustrations to make the meditation section more appealing to young users.
  • In response to feedback, I refined the layout of the emotion diary, making it more intuitive and accessible for children to express their feelings.

By sharing these low-fidelity prototypes with peers and incorporating their valuable feedback, I aimed to create an emotionally enriching and user-friendly app that resonates with the target audience of children aged 7-12 .

Accessibility considerations

Inclusive Font Size and Contrast: The app design ensures a customizable font size and contrast options, allowing users with visual impairments or specific readability preferences to adjust the text appearance for better legibility

Screen Reader Compatibility: The app includes built-in screen reader support, making it accessible for users with visual impairments by providing audible descriptions and instructions for all app elements and content

Color and Contrast Considerations: The app design carefully considers color choices and contrast levels to ensure readability and usability for users with color vision deficiencies or visual impairments. High contrast between text and background elements enhances the overall accessibility of the app

Responsive design

  • Information architecture
  • Responsive design

Sitemap

The sitemap is designed to attract new customers and promote the Emotional Learning App effectively. It focuses on showcasing the app's educational materials for children and teachers while emphasizing the call-to-action to download the app. The goal is to provide valuable information about the app's features and benefits, guiding potential users through the download and onboarding process, and ultimately encouraging them to subscribe and start their emotional learning journey. The sitemap was crafted with a user-centric approach to ensure it delivers a clear and compelling message to the target audience.

Responsive designs

The main goal is to ensure a consistent and optimized user experience across devices, attracting new customers, providing educational materials, and encouraging app downloads. The thought process involves modern web development techniques, while implementation focuses on user- friendly layouts, navigation, and regular monitoring for improvements based on feedback and data analysis.

results

  • Takeaways
  • Nextsteps

Takeaways

impact:
The impact of the concept designs was well-received by users, as one participant mentioned, "The idea of an emotion learning app for children with interactive activities and personalized recommendations sounds like a fantastic way to promote emotional intelligence in a fun and engaging manner.

what i learned:

  • user-centric design: prioritizing user needs and preferences is crucial for creating engaging and effective digital products.
  • user research and usability testing: conducting thorough research and testing with the target audience provides valuable insights for improving the design.
  • accessibility and responsive design: incorporating accessibility features and ensuring responsive design enhances user experience across various devices.
  • empathy-driven design: understanding users' emotions and experiences helps create more meaningful and impactful designs.
  • iterative design process: continuously refining prototypes based on peer feedback and user insights leads to better outcomes and user satisfaction.

Next steps:

  1. The first step in this project would be to conduct in-depth user research and gather feedback from the target audience, children, and teachers. This will help identify their specific emotional learning needs and preferences, which will guide the design and development of engaging and effective activities for the app.
  2. The next step would involve iterating on the app's design based on the user research findings. This includes refining the user interface, incorporating gamification elements, and improving the overall user experience to ensure the app is easy to use and appealing to children.
  3. The next steps for this project would involve refining all the pages of the website to ensure a seamless and user-friendly experience for potential customers. Additionally, I would focus on enhancing the games in the app to make them more engaging and motivating for children to learn about emotions.
Product design

Let’s Skyrocket Your Next Project Together

Join forces to drive success in our upcoming venture. Head to our contact page and let's ignite this project together!