What if Your Browser Understood How You Feel?

This short project was created as part of my Emotional Design class with Mengqi Cao and Allison Chen. We collaborated with Breathing AI, a startup that leverages facial data to detect emotions and promote digital well-being through a browser extension. Our goal was to design an advanced application that utilizes this emotional data meaningfully.

We began by exploring users’ emotional experiences while browsing and discovered that anxiety is a prevalent emotion often stemming from three core uncertainties: what to do, when to do it, and how to do it. Interestingly, users also expressed a desire for anticipation and moments of surprise—elements that could help ease anxiety by making the experience feel more guided and reassuring.

We designed an emotion-aware browsing assistant that helps users reflect on what to do, when to do it, and how to do it—based on their current emotional state. It uses AI to break down tasks and leverages emotional patterns from past data to offer thoughtful, timely, and delightful guidance for each decision.

The Psychological Effect of Planning

Research indicates that having a clear, actionable plan can significantly lighten mental load, elevate mood, and reduce anxiety. We applied this insight to address the question: What should I do? When users take a moment to self-reflect and create a daily plan, it helps alleviate the anxiety caused by uncertainty around tasks. While there’s often resistance to the extra effort of planning, this is eased through the Bay Schema effect

The Baby Schema Effect

At the heart of our smart assistant is a charming mouse character, inspired by the film Ratatouille, where a mouse helps make life easier. By introducing a lovable character, we aim to evoke positive emotions, spark curiosity, and foster a sense of care and companionship. This emotional connection not only captures users’ attention but also encourages ongoing engagement with the app.

Emotion Aware Smart To-Do List

The smart to-do list guides users to the most appropriate task based on their current mood and energy derived from facial expression data, creating a sense of emotional support and personalisation. When users feel acknowledged on an emotional level, their engagement increases naturally. By adapting to individual behaviors and preferences, the system doesn’t just follow a schedule it responds to the person behind it. This emotion-driven approach opens the door to moments of surprise and delight, deepening user connection and overall satisfaction.

Cognitive Off-Loading & Smart Emotional Analytics

The assistant also supports users by breaking down tasks into manageable steps, reducing cognitive load and making it easier to understand how to approach each task. This form of cognitive offloading helps ease anxiety and prepares users for potential challenges. Additionally, through reflective design, the system encourages users to evaluate their experiences, fostering emotional awareness and personal insight. By analyzing how tasks affect their mood and behavior, users gain a deeper understanding of themselves, leading to more intentional and empowered decision-making.

Design as An Emotional Journey

In this redesign of Breathing AI, we incorporated a range of smart features rooted in emotional design principles, guiding users on a journey from anxiety to surprise. By applying psychological insights, we strategically designed features that addressed specific emotional states, resulting in a product that meaningfully enhances the browsing experience.

This project marked a uniquely transformative design approach for me, centered entirely on emotion, it deepened my empathy for users. Once we look beyond the complexity of psychological terminology, we find practical and intuitive ideas that can easily be integrated into any design process. This emotionally driven perspective has become my favorite approach and now shapes the way I view every user journey I design.