Mitty portfolio-05.png

Particle in a Box

 

Particle in a Box

Mitty portfolio-05.png

Background

This was my project as a Research Assistant in the Design and Social Interaction Lab. The goal was to help students learn quantum mechanics using an interactive environment. My paper about this project has been accepted at the Games and Learning Society's conference.

Role: User research, Interaction Design, Narrative Development, Programming, and Animation

Tools: Illustrator, Paper and pen, HTML, CSS, Javascript

 

PublicationsGLS 11, Madison WI

Awards: Winner of Student Choice Award at the Serious Games Competition at NTSA's I/ITSEC Conference

Link: Particle in a Box demo

 

Introduction

The abstract nature of Quantum Mechanics makes it difficult to visualize even for experts studying the field. Existing visualizations (and the very few educational games that exist) for QM are highly technical, hard to approach and too focused on mathematical formulae. Our goal was to tackle this problem by exploring supporting materials such as interactive visualizations and games for teaching and learning quantum mechanics.

 

Challenges

  • How can the design environment enable students to build on their past experiences and knowledge, while facilitating their ability to break free from it?
  • How can we design an integrated environment that is both scientific and immersive; serious or playful?
  • How can we connect what the students learn in textbooks to this interactive environment?

 

Building on student's past experiences

Concepts such as energy, position, and momentum differ in classical and quantum mechanics. Students are familiar with the classical world since they experience that everyday. Objects in the quantum world behave unexpectedly. Our broad strategy was to use comparison to demonstrate these differences between the classical and quantum worlds.

 Classical Physics concept

Classical Physics concept

 Quantum Mechanics concept

Quantum Mechanics concept

Integrated Environment

The second key challenge we faced was to design a visual environment that was both scientific and immersive; serious and playful. Our response to this challenge was to create an integrated environment that combined the scientific representations of quantum mechanics concepts with the game environment.

 Concept of the wavefunction – A static diagram that represents the connection between the wavefunction (blue curve) and the electron’s probability distribution (faded blue dots)

Concept of the wavefunction – A static diagram that represents the connection between the wavefunction (blue curve) and the electron’s probability distribution (faded blue dots)

 Concept of the energy levels - A change in the energy level of the electron adds more peaks and nodes to the wavefunction (blue curve). This change is represented in two sequential static figures

Concept of the energy levels - A change in the energy level of the electron adds more peaks and nodes to the wavefunction (blue curve). This change is represented in two sequential static figures

Tutorials

Given the abstract nature of QM concepts and the educational aims of the game, it was important for the game to include simple tutorials that helped players learn how to play the game. The tutorials were 3-4 pages of text presented before the beginning of each level with each page accompanying an interactive image to explain a key concept.

 An example of a tutorial page

An example of a tutorial page

 

Storyboards

 We followed an iterative design process for the entire project. Here are some of our initial storyboards for the interactive environment:

 Storyboard for the Classical World: 'the dude' has to travel and bring back collectibles. Each new collectible affects the total energy of the system making the obstructing ball move faster.

Storyboard for the Classical World: 'the dude' has to travel and bring back collectibles. Each new collectible affects the total energy of the system making the obstructing ball move faster.

 Storyboard for the Quantum World: 'the dude' has to travel across the wave to bring the collectibles back. Each new collectible affects the total energy of the system, and changing the amplitude of the wave.

Storyboard for the Quantum World: 'the dude' has to travel across the wave to bring the collectibles back. Each new collectible affects the total energy of the system, and changing the amplitude of the wave.

 

User Testing and Updates

Since this is an ongoing project at the lab, we conducted a series of evaluations and updated the game along the way. We conducted different types of tests, based on the type of feedback we were looking for and the target audience available to us each semester.

Many of the game elements in both worlds changed as a result of this frequent user testing and discussion. For example, the energy sources in the old iteration of the classical world were “weights.” However, they were not read as weights and appeared to the students as “suitcases.” We then used a different visual metaphor connected to the idea of “lifting weights” in the next iteration. This kind of iterative process was adopted for all other design changes to the environment.

 Iterations in the Classical World

Iterations in the Classical World

 

Closing Thoughts

Particle in a Box is one of my favorite projects. I learned skills such as project management, organization and documentation which are very important to the design process, but never given as much emphasis. Since this was an ongoing project, we had to hand it off to the next researchers when we graduated, making documentation a very important part of our process.

We tested the game amongst our target users and conducted in-class studies with students of quantum mechanics as often as we could. It was heartening to work with real-world users, get their feedback and see how the game affected their understanding of this very confusing and very important topic.

The game receives frequent updates from the students working on it at any time. You can play the current version of the game and check out the progress here.