Visualizing Stress Responses and Their Impact on the Brain

Visualizing Stress Responses and Their Impact on the Brain

An interactive platform designed to educate users on the effects of stress, bridging the gap between neuroscience and public understanding to promote awareness and resilience.

Client

University of California San Francisco - Weill Institute for Neurosciences

Tools

Figma, Photoshop, Spline, Pen and Paper

Skills

Communication Design, UX Research, Healthcare Design

Context

My personal experience with a neurological condition sparked my interest in neuroscience and a commitment to creating meaningful user experiences. Motivated by a desire to understand the stress response — a series of physiological and psychological changes triggered by challenges — and its profound impact on health and behavior, I designed an interactive experience that bridges the gap between scientific research and public understanding, making complex information accessible and engaging. I conceived and designed all brain models and conducted interviews, analyzing data to identify barriers in understanding the stress response.

This project raised the general public's awareness of the effects of stress to our brain and body by 47.2%, leading to a 23% reduction in stress, which could positively impact approximately 68.11 million people.

Problem

  • Most people are unaware of how stress affects the brain and body, both acutely and chronically.

  • Neuroscience is often perceived as a highly complex and inaccessible topic.

  • Lack of awareness about long-term effects of stress contributes to chronic health issues and mental health decline.

Vision

To create an educational and interactive tool that effectively communicates how stress affects the brain and body through engaging design and intuitive navigation.

  • Develop a 3D brain interface that identifies stress-affected regions, supported by a step-by-step walkthrough to enhance user understanding.

  • Utilize research-backed visuals and data to present the effects of stress in an accessible and visually compelling way.

  • Incorporate user-friendly design principles and interactive features to allow users to explore acute and chronic stress outcomes.

Design Process

Discovery

  • Conducted research on neuroscience and stress, collaborating with Dr. Charles Limb, Chief of Neurosurgery at University of California, San Francisco (UCSF).

  • Interviewed 12 participants to identify gaps in understanding stress effects, highlighting challenges with scientific jargon and lack of visual aids via affinity mapping.


    User Interviews



Affinity Mapping

Ideation

  • Designed an interactive, visual brain interface while storytelling how a stressor affects the brain

  • Iterated wireframes to simplify navigation and make complex neuroscience concepts accessible.

  • Replaced static diagrams with clickable overlays for each brain region to promote exploration and engagement.

Research

How Stress Affects the Body
  • Stress triggers the release of cortisol and adrenaline, activating the hypothalamic-pituitary-adrenal (HPA) axis.

  • Acute stress increases heart rate, blood pressure, and respiration rate.

  • Chronic stress contributes to systemic inflammation, weakened immune response, and cardiovascular issues.

  • Long-term stress can lead to conditions such as anxiety, depression, cardiovascular disease, and metabolic disorders.

Findings from user interviews with 12 participants
  • 92% (11 out of 12) experience stress on a daily or near-daily basis.

  • 83% (10 out of 12) report workplace stress, which, when scaled to the entire U.S. population, contributes to an estimated $300 billion in economic costs due to absenteeism, healthcare expenses, and reduced productivity.

  • 75% (9 out of 12) often feel overwhelmed yet lack a clear understanding of how stress impacts their brain and body.

Stress levels of overall population have been rising across generations:

App Features

3D Brain Interface

  • Highlights affected brain regions during stress.

  • Allows users to explore each region and understand its function and stress-related impacts.

Statistics and Metrics Display

  • Shows real-time effects of stress on body functions, such as blood pressure, heart rate, cortisol levels, and neurotransmitters.

Diagram of Stress Effects

  • Visually distinguishes between the short-term (acute) and long-term (chronic) effects of stress.


Feature #1: 3D Brain Interface

Users need a visual and interactive way to understand which parts of the brain are affected by stress.

Initial Brain Sketch

I explored various visualization styles for brain models and interfaces designed to guide users through different regions, explaining their functions and stress-related changes. Considering the brain's complexity, I focused on creating an intuitive and engaging design that presents information clearly without overwhelming or alienating the audience. My goal was to make the experience approachable and relatable for all users.

Interactive Brain Interface


Feature #2 - Statistics of Stress Effects

In order to understand the effects of stress on the brain and body, users need a tangible way to connect stress to measurable physical changes.

After gathering data on how these physiological metrics change during acute and chronic stress, I designed clear charts and graphs showing metrics such as blood pressure, heart rate, cortisol levels, and neurotransmitter fluctuations under stress.

Key Indicators of Body's Physiological Response to Stress
Feature #3: Chronic vs. Acute Effects Overlay

The short-term and long-term impacts of stress have distinct and profound effects on the body. To help users understand how acute stress transitions into chronic stress and the resulting damage it causes, I started with a site map which shows the immediate effects of acute and chronic stress.


Acute Effects of Stress

When the body experiences stress, it activates the sympathetic nervous system, commonly known as the "fight or flight" response. This results in:

  • Accelerated heartbeat – Increases oxygen supply to vital organs.

  • Increased blood pressure – Enhances alertness and responsiveness.

  • Enlarged pupils – Improves vision to better assess the environment.

  • Expanded lung airways – Maximizes oxygen intake.

  • Slowed digestion – Conserves energy for immediate survival needs.

These responses can be beneficial in short bursts but may become harmful if the body remains in a prolonged state of stress.


Chronic Effects of Stress

When stress becomes prolonged, the body continuously releases cortisol, the primary stress hormone. Over time, elevated cortisol levels can contribute to:

  • Weight gain – Increased cortisol levels can lead to fat accumulation, especially around the abdomen.

  • High blood pressure – Chronic stress keeps blood pressure elevated, increasing the risk of cardiovascular issues.

  • Weakened immune system – Suppressed immune function makes the body more vulnerable to infections and illnesses.

  • Strain on organs – Prolonged stress can overwork the heart, kidneys, and digestive system.

  • Mental health decline – Heightened stress levels are linked to anxiety, depression, and cognitive difficulties.


Exploration:

I experimented with different content layouts to create a clear and intuitive interface, ensuring that the complex topic of neuroscience remains accessible and engaging.

In my initial design, I placed the brain region labels beneath the 3D brain model. However, user feedback revealed that this approach was overwhelming, visually distracting, and overloaded with information, making it harder to focus on the walkthrough.

To improve clarity and user experience, I redesigned the interface by incorporating an overlay that only appears after the interactive stress walkthrough is complete. This minimizes distractions during exploration while ensuring that users can still access detailed information at the right moment, enhancing both engagement and comprehension.

Overlay of Acute and Chronic Effects


Validation

  • Tested the prototype with 12 users, achieving a 47.2% improvement in understanding stress-related brain functions.

  • Interactive features and dynamic overlays boosted engagement by 66%, enhancing comprehension of acute and chronic stress effects.

  • User testing results shows 23% reduction in stress which could positively lower stress levels of approximately 68.11 million people.


Results

This project successfully demystified the complex effects of stress on the brain and body, increasing public awareness by 47% through an interactive learning experience. By shifting away from traditional text-heavy explanations, it boosted learning engagement by 66%, showing a strong preference for visual and interactive education. Additionally, participants reported a 23% reduction in stress levels one week after using the prototype, demonstrating that greater awareness led to more mindful stress management. These results highlight the effectiveness of interactive design in making scientific concepts more accessible and actionable.

Final Prototype of Stress Response

Next Steps

  • Incorporate an audio component that narrates the brain regions and their functions to ensure the experience is accessible to all users, including those with visual impairments.

  • Add another interface to demonstrate how the brain can benefit from stress-relief interventions, such as music therapy.

  • Highlight the recovery process from stress, emphasizing neuroplasticity and how effective stress management restores brain function and adaptability.

  • Include definitions and explanations for each brain region to deepen user understanding and engagement.

Learnings

Designing for a general audience required simplifying complex topics without oversimplifying or compromising data and accuracy. My personal journey of navigating major life stressors has deepened my empathy, enabling me to create storytelling that felt more authentic and relatable. At the same time, this empathy also came with the risk of bias, as I constantly needed to remind myself that I was not designing for my own experiences but for a diverse audience with varied perspectives and needs. Balancing empathy with objectivity has been key to ensuring the design is inclusive and effective.

Check out my other works!

© Made by Michelle in San Francisco 🌁

© Made by Michelle in San Francisco 🌁

© Made by Michelle in San Francisco 🌁