Project Overview
Moodlet
Providing a way to users to manage and reduce their stress
Our team was tasked with developing a solution for an accessible app initially designed for individuals with ASD. However, the target audience was expanded to include those with high sensitivity in sensory processing, also known as hyperesthesia. Our goal was to create a customized, user-friendly, and visually safe platform that would be accessible and beneficial for all users.
Role
UX UI Designer
Timeline
Oct 2022 – Jan 2022
Stakeholders
- UX Designers
- Core Researcher
- Assistant Researcher
- Front-end Developer
Problem
Users are unaware of their stress triggers
The existing application does not have sufficient or relevant data to distinguish between different emotions.
Too little or too much information
The main problem lies in the debate about whether users have too little or too much information, which could mislead users without professional guidance.
Unclear data types
Different data types must be filtered and used in one environment to minimize user confusion.
How to design a tool that gives insight into the causes of stress for people with ASD?
Outcome
I designed a mobile app to transform research from various departments into a practical service platform. The app categorizes and displays datasets to effectively inform users about their stress levels, providing tools to manage and reduce stress.
The solution
Planning & Research
Reviewing previous research
& Competitor analysis
Goal
After reviewing past research and stakeholder requirements, I conducted a competitor analysis and heuristic evaluation to identify effective data display methods and user-friendly practices. The goal was to enhance Moodlet’s usability and align it with best practices.
Results
The research revealed that gamification is a widely adopted good practice in many other apps. Additionally, we need to focus on improving onboarding and notification systems, specifically designing enhanced versions tailored for people with ASD. Another critical aspect is data visualization, which must be engaging yet adapted to meet the needs of the target audience.
Brainstorming, Ideating & Prioritising user needs
User stories &
Generating ideas
I organized a brainstorming session to discuss the characteristics of our target group and the data to be provided in the app, keeping the user’s needs in mind. We created user stories to envision these needs and guide our problem-solving efforts.
From these user stories, the team generated ideas for the Moodlet app. To conclude the session, we used the MoSCoW method to prioritise which ideas to implement first.
Empathising with the target audience
Understanding the needs of
users with ASD
Goal
The goal was to create a persona based on interviews and previous research, capturing key insights such as his aversion to routine changes, preference for a self-paced approach, and dislike of complicated tasks or applications.
Results
The team gained valuable insights into individuals with ASD. By reviewing previous research and creating our own personas, we deepened our understanding of their preferences, stressors, and what helps them stay calm. This knowledge guided the development of our application, ensuring it meets their specific needs.
Designing, Testing & Iterating
Low fidelity
sketches, ideas & flows
I brainstormed potential solutions and user flows, utilizing sketches to clarify ideas and visualize the desired interactions.
Medium fidelity,
other designs & wireframes
Following initial sketches, I developed mid-fidelity wireframes to flesh out interactions and flows for user testing. Below is the mobile version of the application.
Usability testing
Main findings
Goal
The goal was to figure out if the user interface is clear and if the users can successfully complete the main tasks the application offer.
Results
Research highlighted areas for improving Moodlet: simplify onboarding language, clarify Moodlet levels and add custom boosters, refine the SAM model explanation, enable journal day comparisons, and improve settings wording. Users appreciated the potato mascot and want personalization. Enhancing clarity, personalization, and design will boost user satisfaction.
Branding
Creating a brand
& new logo set
Based on our atmosphere and the purpose to give off positive and cool vibes, Moodlet is constructed based on the idea of a ‘Mood’. Since we are trying to steer away from the negativity that the word ‘stress’ invokes, we stuck with the word ‘Mood’, and to finish it off, the word ‘let’ came into play.
What does ‘let’ represent? It represents ‘giving into’ the mood of each individual, ‘letting’ their moods define how and what they are feeling.
Mood is a strong word. It represents a variety of emotions, and what better way than to embrace it as a mystery; LET your MOOD be known to the world! And who knows, it might reveal yourself and who you are.
