Representation

How users understand a representation can be influenced by subtle cues that trigger different intuitions.

The Breath-Games initiative at the University of Vermont Medical School investigates ways that kids with asthma and other respiratory conditions may be able to improve awareness and control of their own breathing, by playing computer games in which a spirometer (an airflow-sensing device that players breathe through) serves as the game controller. In 2014 Tertl was brought in to help refine and diversify the types of games being tested.

One of UVM's prototype games challenged kids to match their breath flow to a target pattern, presented as a graph of breath flow over time. The player's own breath was represented by a dot that moved left to right with time, and up or down depending on the spirometer reading. The object of the game was to get the dot's trail to match as closely as possible to the graph.

 We noticed a recurring error among beginning players. At the top and bottom part of the curve, players would try to follow the curve by changing the direction of their breath, from in to out or from out to in.  This was an error not of breath control but of reading the representation. The intuition is natural: the line is changing direction, so my breathing should too. But in this case it's wrong. The upper and lower extremes of the graph represent the fastest in and out flow rates. To bend the line back toward the middle, all you have to do is keep breathing in the same direction, but more gently.

Beginning physics students make similar mistakes when they confuse position graphs and velocity graphs. But with this game, even adult users who remembered their calculus were getting tripped up. Their theoretical knowledge was overridden by the salience of that hump in the curve. All players could gradually adapt, but the confusion was distracting.

While making this game more game-like, Tertl also needed to make it more intuitive. Could we preserve the overall flow-versus-time structure (desirable for a variety of reasons), but reduce the tendency for players to misread it in the heat of gameplay? Through a combination of adjustments, we did.

1. We used animation to help highlight flow rate. Instead of a dot, the player's avatar is a feathery ball that spins, with the direction and speed of spinning depending on the direction and speed of air flow.
2. We made the "graph" move across the ball, rather than the other way around. With its x-position fixed on the screen, the ball's single dimension of control became a little easier for kids to track.
3. To highlight flow even more, we turned the interface into a breath-controlled musical instrument, with a musical game sound that varies instantaneously (like a harmonica) with the direction and speed of the player's breath.
4. We gave players more chances to build their feel for the breath ball, by playing with it by itself, and by taking it into other fun challenges (like navigating a maze) that didn't look graph-like.
5. We changed the original graph line into a series of discrete target objects, breaking up the misleading line.

With the game and challenge posed in this form, the "breath reversal error" ceased to be a problem.

There are many ways to represent breath

By using the player's breath to drive different representations, we can challenge the player to become aware of different aspects of their breath.

• To visualize how much air the player can exhale in one second (a standard medical measure, FEV1) we used a rotating cannon that sprays rainbow balls. The harder you blow, the more balls are sprayed and the denser the rainbow that results.

Many creative representations are possible. The choice depends on your goals and on users' needs..