Air Pollution: An Immersive Social Learning Experience

Convincing Climate Change

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

Introduction

Global warming has many contributors. Yet, I chose to hone in on one area that significantly affects Earth and its life: air pollution. From the beginning, I knew I wanted to use spatial computing to present these complex topics to those with the most influence to drive 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?

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 not know what 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 with significant impact to take action. In theory, spatial computational 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 WHO and EPA. While collecting images and crucial information about each air pollutant, I focused on what sources emit them and how the public currently experiences air pollution, from wearing respirators to chronic illnesses.

Comparative Analysis

I also needed to know what immersive experiences addressing the climate crisis were out there. 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.

Further, I compared other types of immersive experiences that highlighted the educational aspect and wanted to understand how storytelling in spatial computing can evoke empathy. I came across two unrelated 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.
An analysis of six different VR experiences
An analysis of six different experiences relating to VR, education, and/or empathy

Through this research, I discovered three significant missed opportunities these current programs:

  1. All experiences were single-player.
  2. All were only accessible through download onto a VR headset.
  3. None explored air pollution directly.
comparisonchart2
After further research, two additional categories were added: "Social/Shared Experiences" and "Accessible on the Web".

During my conversations with potential users, I faced the challenge of determining who impacts climate change most and how we can reach them effectively. 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?

I found that... 

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.

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

While lead is a toxic substance, it's less concerning 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-58

Educator

Asset-60

College Student

Asset-59

High School Student

While I found the college student persona essential to explore, I decided to focus on the high school student and educator. This is because there are more issues around keeping high school students engaged in complex topics.

Meet Shawn, the high school student... 

Personacard

High School 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 chatroom. So, he invited a friend to join them. Together, the two friends had a fun and educational experience while also being able to hang out. Afterward, Shawn felt motivated and impacted by this new way of learning.

storyboardpersona

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.

Dense topics can be challenging for students who lack engagement in traditional learning methods. The question was, 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. Furthermore, 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.

Brainstorming the Experience

From what I learned, Mozilla Hubs, a social and spatial 3D platform with development and customization capabilities, was the best option to build out 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. Users learn best through audio-visual narratives that combine scenic content with audio, allowing them to absorb information. I hypothesized that providing students with a cinematic and immersive experience can help them learn subject matter quickly.

Sketching Concepts

Exploring various concepts through sketching based on my research, I discovered a concept similar to the magic school bus: users shrinking in size, making air pollutants visible to the human eye. Inspired by 3D renderings of air pollutant molecules, I wanted to show how they emit from their sources and how they get absorbed into the human body and lungs.

sketches

Initial Journey Map

njourneymap1

Initial Storyboard

storyboards

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?

journeymapi

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-50

Utopian

Asset-48

Ucronian

Asset-49

Dystopian

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 initially, this was not ideal, developing a separate experience afterward could encourage a more engaging and hands-on approach while exploring potential climate futures.

Journeymapaltfutures-1
alternate-future-storyboard

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.

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

Before shrinking down

showingscale-06

After shrinking 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.

Image showing all of experience from a topographic view
1. Platform shrinks 2. Narration introduction 3. Air pollutants and their sources 4. Effects on the environment 5. Effects on human health.

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.

BestAlternateOutcome

Best alternate outcome

CurrentTrajOutcome

Current potential trajectory

WorstAlternateOutcome

Worst alternate outcome

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

1.   Overall impact

2. Retention and learning outcome

3. Usability

User Testing: Phase 1

This was to replicate a scenario where students could experience it in a lab setting. After observing and conducting interviews, I found that although the experience impacted the participants, there were substantial issues with interactivity and storyline throughout (including being unaware that they had shrunk down to a small size). Additionally, the retention of information could have been more successful than I initially assumed. However, it was unclear whether the lack of retention was due to usability confusion or other factors. Lastly, when going into the alternate future, participants wandered around and tried to interact with highlighted objects that were not interactive.

UserTesting1@150x
UTcallout1

Observation during testing:
Participants had not realized they traveled into an exhaust pipe.

UTcallout2

Observation during testing:
Participants did not discuss what they were learning between breaks in the narration.

UTcallout3

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

UTcallout4

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

UTcallout5

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

UTcallout6

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

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

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

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 alternate future scenarios were confusing as the participants tried interacting with features that were not interactable. 

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

First, I added more clear introductory information and redesigned the signage layout. This would allow the user to absorb information in steps and have an idea of 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 as a visual indicator that the truck was important.

introsignagebefore1.1 introsignageafter2

before <|> after (move the bar to see the difference)

Next, I improved the design system and included clear visual indicators for various elements, ensuring users could easily comprehend their use. 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 upon its sound, size, and location to play an essential role in setting the mood for the scene.

designsystemdiagram-07 designsystemdiagram-08-1

before <|> after (move the bar to see the difference)

User Testing: Phase 2

With prototyping phase 2 done, I needed to determine if my changes helped solve 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.

usertesting-phase2.1
UT2callout1

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

UT2callout3

“Air pollution is bad, but I can’t recall certain facts or details.”
— 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 saw that they missed some important key features in one of the alternate future scenarios, leading me to believe they were too similar.

usertesting-phase2.2
UT2.2callout2

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

UT2.2callout1

Observation during testing:
The participants moved right past this feature in future 3. I later discovered it was because they thought they had already listened to the same audio from Future 2.

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 major problems I needed to address: 

That users still retain little information from the narrative experience.

That users felt lost in the alternate future experiences.

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

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, knowing that participants required more help retaining information in the narrative experience, I had to brainstorm ways to address this problem.

Alternate Futures Redesign

I spent some time thinking about effectively demonstrating the cause and effect of climate futures due to 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 they affect the result. For example, the grocery story 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.

altfuturesjourneymaprevised-closeup

Addressing Retention

Instead of only 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 are in and highlighted important information to draw their attention to it. 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

Through feedback from a confidant new to the experience, 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.

Alex Leeds

I design meaningful experiences and products using research, testing, and creativity.

View