Moodiy: Feel It. Track It. Understand It.

A new way to visualize emotions — bridging mental health and design through intelligent, human-centered interaction.

Background

Overview

Moodiy is an interactive mental health journal that transforms emotional tracking into an intuitive and engaging experience. Unlike traditional text-based journaling, Moodiy uses emoji drag-and-drop interactions, AI-powered insights, and visual mood analytics to help users understand their emotions effortlessly and reflect with compassion.

Research

Problem Statement

  • High cognitive load in text-based journaling

  • Lack of direct manipulation for emotional input

  • Minimal feedback or long-term insights

Research

Desk Research

Before designing, we reviewed research papers and UX studies to understand why most mental-health journaling apps fail to keep users engaged. We analyzed findings from both psychological effectiveness and user experience perspectives.

User’s Perspective
  • Text-heavy journaling creates high cognitive load, especially during low-energy moments.

  • Lack of visual feedback makes emotional patterns hard to notice or reflect on.

  • Users want journaling to feel personal, flexible, and emotionally expressive.

Design & Research Perspective
  • Studies show apps with validated therapeutic frameworks improve emotional well-being (Lecomte et al., 2020).

  • AI-assisted reflection can support habit formation when designed adaptively (Kim et al., 2024).

  • Engagement increases when users gain real-time insights and visual summaries of mood trends (Smyth et al., 2018).

Research

Competitive Analysis

Daylio
violates Flexibility & Efficiency of Use by limiting one emotion per entry.
Reflectly
violates User Control & Freedom with forced prompts.
Journey
violates Recognition Rather Than Recall, relying solely on text.
Ideation

Developing the Solution

|

HCI Justification
  • Recognition Rather Than Recall – Emoji-based selection reduces cognitive load since users select rather than generate emotional descriptions.

  • Flexibility and Efficiency of Use – Dragging multiple emojis allows users to reflect complex emotional states more accurately.

  • Aesthetic and Minimalist Design – Clean interface with clear visual feedback enhances usability.

Design Solution
  • Use an emoji-based system for quick emotional logging.

  • Allow users to drag and drop multiple emojis to reflect complex feelings.

  • Use color-coded emojis to help users instantly identify mood patterns.

Ideation

Moodboard

We explored visual references from wellness and journaling apps to understand how color, typography, and layout affect emotional perception.
Our goal was to design a calm yet expressive interface—one that feels human, approachable, and reflective.

By analyzing soft color palettes, rounded icons, and balanced spacing, we established a visual system that supports Moodiy’s empathetic and mindful identity.

Ideation

Initial Concept (Wireframe Exploration)

We began by mapping out the core information architecture and wireframes for a simple journaling app.
At this stage, the design relied on conventional emoji selection and text-based entries, establishing the foundation for mood tracking and navigation.

There was no direct manipulation or color-mixing idea yet — the focus was on logging emotions via emojis or text and building basic navigation.

Ideation

Low-Fidelity

In the low-fidelity stage, we refined page structure and tested key screens, including mood journaling, AI guide, and statistics. This phase helped us define information hierarchy and interaction flow, though the input method remained tap-based. Feedback at this stage revealed the need for a more expressive and engaging journaling interaction.

Ideation

High-Fidelity

In the high-fidelity phase, we evolved from static logging to interactive, emotion-driven journaling. Users could now drag emojis to reflect complex moods, watch colors blend to visualize emotional nuance, and receive AI-generated summaries for reflection. This iteration unified usability and emotional design, making self-reflection both intuitive and meaningful.

Final Demonstration

Commercial Video

We created a short promotional video to communicate Moodiy’s concept and emotional value. It highlights how users can effortlessly express feelings through emojis, track patterns visually, and receive AI-guided support — turning self-reflection into a simple daily habit.

Final Demonstration

Expert Presentation Video

To evaluate the design from an HCI perspective, we produced an expert presentation analyzing Moodiy through heuristic evaluation, cognitive directness, and user feedback. This video details how our design decisions reduced cognitive load, enhanced direct manipulation, and aligned with usability principles.

Design Evaluation

Strength

1. Low Cognitive Load in Mood Logging - Emoji-based input makes journaling quick and effortless — especially helpful during low-energy moments.

2. Flexibility in Emotional Expression - Users can select multiple emojis to represent complex or mixed feelings, instead of being limited to just one.

3. Personalized Feedback Through AI - AI-generated insights help users understand mood patterns and offer relevant suggestions to support self-care.

Design Evaluation

Weakness

1. Oversimplification of Emotional Complexity - Users might struggle to express emotions that don’t align with predefined icons.

2. Cognitive Load in Insights Dashboard - The statistics page may overwhelm some users with excessive data at once.

3. Lack of Deep Personalization in AI Suggestions - AI-generated advice may feel generic and disconnected from user’s specific context.

Design Evaluation

Potential refinement

1. Expand Emoji Library & Customization - Let users create and label their own emoji sets to reflect their emotional vocabulary.

2. Multi-layered Emotional Input - Enable users to “weight” each emotion by dragging emojis closer to or further from the center.

3. Emoji History & Smart Suggestions - Let users quickly reuse recent or frequently used emoji combinations to reflect emotional patterns.

Create a free website with Framer, the website builder loved by startups, designers and agencies.