💌 Moodle App

ROLE : UX designer

TIMELINE : December 2021

TEAM: 2 designers

TOOLS : Figma

⚠️ Blast from the past 🚀 this case study is quite outdated! New great things to come 😁

Moodle is a mental health driven journaling app designed to help log and monitor our wonderfully messy emotions. There should be no shame in feeling feelings!

Inspired by the turbulence of mental health, I teamed up with a fellow designer to create a mood journaling app. With specific struggles in mind such as memory loss and brain fog, we were driven to create the perfect environment for users to comfortably and openly express their emotions. Through our experiences, we have found a great amount of merit in writing our hearts out, whether it be through an app or by hand. Although simple, journaling can provide a consistent, reliable means of managing overwhelming emotions and mental health.

GOAL: To create a straightforward, easy to use environment for users to log and monitor moods and daily activities


HIGHLIGHTS: Visual design, UI design, secondary research, prototyping, design systems, brand identity

🔎 Research


Competitor Analyses:

Competitor analysis provided a rich basis for design and structure ideation. We performed audits on three apps: Daily Bean, Reflectly, and Alan Mind. App store reviews provided meaningful insight, in terms of both design and user needs.

Major Research Takeaways:

🎨 Designs


The overarching design goal of ours was to create a very simple, welcoming environment. To avoid overwhelming users, we stuck with clean, simple UI, in addition to consistency in colour and elements throughout the app.

Brand Identity:

Gender neutrality was a driving factor in creating the app’s colour palette. Its diverse array of shades reflects inclusivity, and the multifaceted nature of our emotions. As mental health affects all walks of life, it goes without say that we wanted emphasize inclusive design.

Design System Components:

Onboarding:

The onboarding process is presented in a simple format to create a comfortable environment for the user. Engaging prompts are used to bring the reader to a state of ease, once again establishing a laid back tone.

Home:

The home page serves as a landing page for past journal entries. Users have the option to view entries in an endless scroll format, or through individual navigation.

Journal Entry Process:

Being the central feature of the app, the journal entry process is designed to be straightforward and engaging. Users are first prompted to share their current mood, first expressed in simple emotes, then in more descriptive language. Users are then given the option to select relevant activities, wrapped up with an option to add any relevant notes or photos to the entry. All done! The last two parts of the entry are entirely optional, providing a great amount of flexibility for the user.

Mood Summaries (Statistics + Calendar):

The statistics and calendar areas of the app are created to provide visual mood summaries, a fun and interactive way of extracting patterns and takeaways.

Settings & Customization:

To make the experience as personalized as possible, the settings area provides means of editing and customizing moods and activities.


🍓 More to come

There are a lot of opportunities for future additions and developments for the Moodle app. We are currently in the works of creating the interactive prototype, and plan to create a dark mode. In terms of functionalities, we are in the midst of thinking of ways to expand on the statistics area, in hopes of extracting more detailed connections, such as relationships between certain moods and activities.

Previous
Previous

👩🏻‍💻 UW Computer Science Club Website