Air Pollution: An Immersive Social Learning Experience

Virtual Reality  |  INTERACTION DESIGN |  UX RESEARCH  |  EDUCATION | Climate Action | Storytelling

Project Overview

Air Pollution: An Immersive Social Learning Experience aims to educate people and increase empathy regarding the impact of air pollution on the climate and human health. By exploring potential futures, users can experience the world in the coming decades based on actions that increase or decrease air pollution. Although air pollution is a complex, heavy topic, this experience is entertaining and cinematic, with a choose-your-own-adventure twist at the end. It is shareable through a link and can be viewed in both virtual reality (VR) and on a desktop, making it easily accessible for most people.

Project Details

Goal

To educate and bring awareness to show how air pollution impacts our planet in an engaging yet simplified way on a weighty topic. 

Timeline

August, 2022 – March, 2023 

Final Product

A working web-accessible shared experience with visual and audio storytelling elements and a choose-your-own-adventure game to explore potential futures.

Target Audience

Students and educators

Process

  1. Industry Research

  2. Brainstorming

  3. Prototyping: Phase 1

  4. Testing: Phase 1

  5. Prototyping: Phase 2

  6. Testing: Phase 2

  7. Prototyping: Phase 3

  8. Lessons Learned

Introduction

Global warming has many contributors. Yet, I chose to focus on one area that significantly affects the Earth and its life: air pollution. From the beginning, I knew I wanted to utilize spatial computing (VR) to present these complex topics to those with the most influence in driving change.

But I started with some big questions: Would a cinematic experience with simple interactive elements be enough to retain complex information? Would it be enough to convince people to make a change?

1. Industry Research

Air pollution information is usually conveyed through articles and documentaries. These sources often contain complex data that viewers may need help understanding. They may feel overwhelmed and unsure of the actions they can take. Viewers who haven't experienced the effects of air pollution (or so they think) may feel detached from the issue.

I assumed that creating immersive stories could influence large corporations and individuals to take action with a significant impact. In theory, VR experiences could convince corporations to implement extensive changes that could help significantly reduce air pollution.

I gathered all the required information and articles regarding air pollution, including the five major air pollutants acknowledged by the WHO and the EPA. While collecting images and crucial information about each air pollutant, I focused on the sources that emit them and how the public currently experiences air pollution, ranging from the use of respirators to the development of chronic illnesses.

Comparative Analysis

I also needed to know what digital media and games were addressing the climate crisis. A few I came across were:

  • Floodland: A societal survival game set in a world destroyed by climate change.

  • Coral Compass: A 360° VR documentary on a small island in Micronesia, home to coral reefs.

  • Greenland Melting: An educational VR narrative experience with 360° imagery that shows the current melting state of glaciers.

  • An Inconvenient Truth: An emotionally-provoking documentary on climate change.

Furthermore, I compared other types of immersive experiences that emphasized the educational aspect and sought to understand how storytelling in spatial computing can evoke empathy. I came across two unrelated topics to climate change but meaningful in these ways:

  • Titans of Space: an educational VR experience that puts the user in outer space and displays the planets of our solar system.

  • Goliath: Playing with Reality: a cinematic narrative experience about a man with schizophrenia. It only uses basic shapes, animations, and interactive elements, yet it is conceptually complex and evokes empathy for those who have never experienced psychosis.

comparative analysis
A comparative analysis of five VR applications and one climate change documentary.

Through this research, I discovered three significant missed opportunities in these current apps.

1. All experiences were single-player.

2. All were only accessible through download onto a VR headset.

3. None explored air pollution directly.

comparative analysis missed
After further research, two additional categories were added: "Shared Experiences" and "Web Accessible".

Initial Discussions

During my conversations with potential users, I faced the challenge of determining who has the greatest impact on climate change and how we can effectively reach them. To gather their thoughts, I conducted a series of informal discussions and interviews with friends, students, professors, and small business owners. In addition to these discussions, I researched the user problems and barriers to business/corporation impact. I wanted to know: Should we focus on making this a business-related or education-related experience?

Research Findings

Air pollution, while complex, can be broken up into bite-sized pieces easily digestible for a younger audience.

This experience should be targeted to those most influential in making a change—students and educators, who can share what they've learned with others.

While lead is a toxic substance, it's less prominent as an air pollutant than others. For simplicity's sake, I didn't include it.

User Persona Development

The most impactful users, particularly the younger generation, can create change from the bottom up. At this point, I had a hunch that immersive learning can enhance the effectiveness of a structured learning environment for students and educators, allowing them to apply their knowledge to real-life situations.

Asset 99

While I found college students essential to explore, I decided to focus on high school students and educators. There are additional challenges in keeping high school students engaged with complex topics.

Meet Shawn, the high school student.

personanew

High School Student User Scenario

Shawn had trouble engaging with science class, prompting the teacher to suggest an alternative approach to help him learn about air pollution. In addition to studying from the textbook, the teacher recommended an immersive experience and offered extra credit if Shawn participated. The teacher shared a URL with him that could be accessed via a browser or a VR headset. As Shawn was getting ready to put on his VR headset, he realized the experience was through Mozilla Hubs, a virtual chat room. So, he invited a friend to join them. Together, the two friends had a fun and educational experience while also enjoying quality time together. Afterward, Shawn felt motivated and impacted by this new way of learning.

personastoryboard

Some assumptions I made at this point were:

Teachers will find the framework of the product as a helpful learning tool for students.

Students will share this experience with others.

VR can help students learn and memorize complex topics.

Teaching students the importance of our choices can make an impact, no matter how small.

User Persona Findings

Dense topics can be challenging for students who lack engagement in traditional learning methods.

What kind of immersive educational experience would be the most effective for engagement and retention and easily shareable?

Based on my research, a narrative cinematic experience with matching visuals could help to drive the story.

Through VR, users can be fully immersed without any distractions from the outside world.

Spatial computing allows users to visualize an experience that would not be possible in physical space.

The best way to share different user scenarios would be through a URL that could be viewed in VR or on a desktop if a headset is unavailable. To achieve this, I used Mozilla Hubs. I could quickly create scenes on this social web-based platform and have a developer add interactive and audio elements.

2.  Brainstorming the Experience

From what I learned, Mozilla Hubs, a social VR platform on the web with extensive customization capabilities, was the best option for building this experience. The possibilities of spatial computing are endless, and I wanted to create an experience that cannot be achieved through conventional video content, 2D websites, or other forms of digital visual communication. Knowing that users learn best through audio-visual narratives, I hypothesized that providing students with a cinematic and immersive experience can help them understand the subject matter quickly.

Sketching Concepts

While exploring various concepts through sketching, I discovered a concept similar to the Magic School Bus: users shrink down, making air pollutants visible to the human eye. Inspired by 3D renderings of air pollutant molecules, I aimed to illustrate how they are emitted from their sources and their impact on the human body and lungs.

Asset 100

Initial Journey Map

I created a journey map to outline the user experience. It starts with onboarding, followed by an overview of the five major air pollutants, their sources, their environmental impact on global warming, and their effects on human health. their effects on human health.

journeymapnarrative

Initial Storyboard

Creating the storyboard allowed me to visualize the placement of elements, their relationship to the user, and the transitions between scenes.

narrative experience storyboardv3

Through feedback on this journey map and storyboard, I realized there needed to be more interactive elements. How could I implement interactive elements into the experience while considering Mozilla Hub's developer constraints?

journeymapiv2

Brainstorming Interactivity — Climate Future
Scenarios Exploration

As the primary objective of this stage was to enhance interactivity regardless of the technical limitations, I planned to provide users with three alternative futures to explore at the end of the narrative experience, each with a utopian, uchronian, or dystopian theme.

Asset 103@150x

This would transition them into a different scene where I had more creative freedom to incorporate interactive elements using the Hubs Blender Add-On Feature. While this was initially not ideal, developing a separate experience afterward could encourage a more engaging and hands-on approach when exploring potential climate futures.

journeymapaltfuturesv2

After journey mapping and storyboarding each alternate future and exploring their features, I gathered enough information to start prototyping both the narrative and alternate future experiences.

alternate future storyboard

3.  Prototyping: Phase 1

During the development phase, I conducted internal testing using VR and desktop platforms to ensure all features were implemented as planned. One of the most critical aspects of spatial computational media is focusing on scale and space in relation to the user.

showingscale-05

At normal scale.

showingscale-06

After scaling down.

The Narrative Experience

In this magic school bus-style experience, it was important for users to view the virtual landscape without any constraints, so we implemented a moving platform offering complete 360-degree visibility. The journey would introduce the five major air pollutants and show them emitted from their sources, their environmental consequences, and their impact on human health.

narrativeexperiencediagramv2

Alternate Futures

I designed and developed three hypothetical scenarios—utopian, uchronian (a hypothetical time period of our world), and dystopian—in a low-income city area. Each scenario featured the same setting and characters. Still, users could observe or interact with varied visual and audio cues in each timeline. I used simple animated visual cues to draw the user's attention to each feature.

best

Best outcome

current

Current trajectory

worst

Worst outcome

Finally, it was ready to test with a few select users. The three things we wanted to test were:

1. Overall impact

2. Retention and learning outcome

3. Usability

4.  User Testing: Phase 1

This setup aimed to simulate a scenario students could experience in a lab environment. Through observations and interviews, I discovered that while the experience effectively evoked empathy and concern among participants, it also presented significant challenges in terms of interactivity and storyline. For instance, many participants were unaware they had been shrunk to a smaller size.

Moreover, information retention was lower than I initially expected, though it was unclear whether this was due to usability issues or other factors.

Finally, participants in the alternate futures often wandered and attempted to interact with highlighted objects not designed to be interactive (important to notice, but not interact), leading to confusion.

usertestingv4

Observations

callout4

Participants had not realized they had traveled into an exhaust pipe.

callout3

Participants did not discuss what they were learning between breaks in the narration.

Interview Findings

callout2

“Well, obviously air pollution is bad, but I couldn't tell you a specific fact that was discussed during the experience.”
— Participant C

callout1

“It made me feel concerned for our current situation and the direction we are heading.”
— Participant B

callout1

“Experiencing it was better than looking at notes.”
— Participant A

callout5

“Features that I thought were interactive were not.”
— Participant A

“The controls were confusing. I’d appreciate tips closer to each feature.”
— Participant B

“I had some confusion on where to go.”
— Participant C

5.  Prototyping: Phase 2

Before proceeding with another round of user testing, I needed to address these significant usability issues. 

  1. The Introduction and premise of shrinking down were unclear. One sign had too much text and insufficient contrast between the background (the scene they spawn into) and the foreground (the sign that introduces them to shrinking down).
  2. The highlighted key features in alternative future scenarios were confusing, as participants tried to interact with features that were not interactive. 

Prioritizing these challenges first would allow us to examine retention and impact outcomes effectively.

Improving Clarity with Redesigned Intro Signage

First, I added clearer introductory information and redesigned the signage layout. This would allow the user to absorb information in steps and know what they can expect in the experience, such as shrinking down. I included a picture of the truck and left space between steps 1 and 2 to indicate that the truck was essential to the narrative.

introsignagebefore1.1 introsignageafter2

Before <|> After — Move the bar to see the difference.

Improving Clarity with Redesigned Intro Signage

Next, I refined the design system and incorporated clear visual indicators for various elements, ensuring users could easily understand their purpose. I decided against using the same visual cues for non-interactive elements. Instead, I used a distinct visual cue for the radio news to communicate sound omitted from its source. As for the air purifier, I left it up to the user to explore and relied heavily on its sound, size, and location to play a crucial role in setting the mood for the scene.

designsystemdiagram-07 designsystemdiagram-08-1

Before <|> After — Move the bar to see the difference.

6.  User Testing: Phase 2

With the second phase of prototyping, I needed to determine whether my changes solved the usability issues. During the first round of testing, I worked with one user.

  • The participant knew she had shrunk down as part of the experience.
  • Overall, she understood the concept, was moved by what she learned, and appreciated the fully guided nature of the narrative experience.
  • However, she needed some help recalling important information from the narration and clarification about what to do in the alternate future scenarios.
UT2diagram

Interview Findings

callout2

“Air pollution is bad, but I can’t recall certain facts or details.”
— Participant D

ut2callout1

“I loved the tour aspect of the narrative experience and understood I had shrunk down.”
— Participant D

ut2callout2

“I wish there was more guidance in these scenarios. I wasn’t really sure what to do here.”
— Participant D

User Testing: Phase 2.2

The second round involved six participants. I observed from a remote position (in Hubs). Most were in VR, with a few on a desktop. I noticed that they missed some important key features in one of the alternative future scenarios, which led me to believe they were too similar.

ut2.2diagram

Interview Findings

UT2.2callout2

“I’m not sure how I got here.”
— Participant E

Observations

UT2.2callout1

The participants moved right past this feature in Future 3. I later discovered that they thought they had already listened to the same audio from Future 2.

The Turning Point

During the two usability testing sessions, I noticed that although the participants understood and appreciated the narrative experience, they still needed help retaining vital information. Likewise, there was a disconnect between the cause and effect of the alternate futures. As a result, participants left the experience perplexed about what led to each alternate future. At this point, I realized there were still three significant problems I needed to address: 

That users still retain little information from the narrative experience.

That having no transition for how they got to the alternate future scenarios lead users to feel confused.

That users felt lost in the alternate future experiences.

7.  Prototyping: Phase 3

After the second phase of user testing, I concluded that not only were the alternate futures and features within those scenes not drastic enough, but they lacked the cause-and-effect aspect, leaving users needing clarification about what led up to each scenario. This made me rethink the entire second part of the experience.

Second, I had to brainstorm ways to address retention, knowing that participants still needed help remembering information in the narrative experience.

Alternative Futures Redesign

I spent some time thinking about how to effectively demonstrate the cause and effect of climate futures resulting from air pollution. The challenge was creating an experience that guides users while allowing them to make their own choices. Additionally, each scenario had to be distinct from the others. To tackle these challenges, I developed a choose-your-own-adventure-style game that presents three prompts, each addressing a specific real-world problem that can be heavily impacted by air pollution.

altfuturesjourneymaprevised

Each prompt offers two choices that lead to vastly different outcomes through various timelines. Users can witness cause and effect through their choices and observe how these choices affect the outcome.

altfuturesjourneymaprevised-closeup

For example, the grocery store prompt suggests that shopping locally or going to the closest grocery store over time would positively impact the environment, thus decreasing the amount of air pollution produced.

grocerystore-prompt

At their residence, they are prompted to grab a few items: Either they can choose to go to the grocery store across town, or walk to the nearest local market.

grocerystore-alt1

Choice 1: Over time, shopping local cuts down on emissions, and thus they can see the abundant amount of fresh produce and talk to the grocery clerk about current environmental conditions.

grocerystore-alt3

Choice 2: Over time, going to the store across town to the corporate grocery store encourages products to be shipped in from elsewhere, as well as burning fossil fuels to get there.

Addressing Retention

Instead of just providing information about the five major air pollutants initially, I created an infographic that users could refer to throughout the experience.

Additionally, I included an index to help users keep track of which part of the experience they were in and highlighted important information. I added discussion prompts between pauses in the narration to encourage active engagement.

Screenshot-2024-02-13-at-9.44.32 AM

Finally, a short quiz was developed to further test the users' retention of information before and after the narrative experience.

before

Insights Gained from Fresh User Feedback

I wanted to test my improvements in addressing the cause-and-effect challenges in the alternate climate futures and see if the infographics and short quizzes addressed the retention issue in the narrative experience. Through feedback from a confidant, I learned...

greenflag

The choose-your-own-adventure experience significantly improved and helped the user understand the cause and effect.

redflag

Still, it was hard for this user to retain important information, even with the infographics and quizzes.

Lessons Learned

While Air Pollution: An Immersive Social Learning Experience successfully stirred thought and emotion and felt adequately guided, the educational aspect still needs improvement. Measuring impact in numbers is crucial. I would need further user testing to measure the learning outcome.

The immersive social learning experience on air pollution can be accessed through a single virtual room URL. However, this can lead to multiple users unintentionally ending up in the same room. I need to think about how back-end development must be packaged along with the Mozilla Hubs scenes to ensure various groups can access it without interference.

Throughout this process, the social and easily accessible aspect was a priority. Still, Mozilla Hubs may not be the best tool for an educational, cinematic, yet interactive experience. I need to break up information into smaller pieces further, work on pacing, and make the narrative experience interactive to improve learning outcomes.

Let’s build something thoughtful.

Have an idea? I’d love to hear from you.

© 2025 Alex Leeds · This site was designed and built with care.