short attention span
project blogs
video clips
behind the screen
contact us

Behind the Screen

This section documents the various flash based experimental programs and scripts developed by Short Attention Span over the course of the project. Many of these experiments were developed to interact with mouse movements before integration with Luminance and phyiscal motion input was attempted.

Bezier Curves
These experiments were developed to test interactions with dynamic curves being drawn using the Flash drawing API.
1 | 2

Circle Transition Prototype
Example of enlarging bubbles transition (no mouse interaction)

The Scenes

This scene grew out of an initial idea we had to have the system default to an "attract" mode when it was idle. Lee came up with the idea of a bouncing eye that would react to the user, eventually allowing the user to move to more advanced scenes.

The simplest scene was our first. This started as a proof of concept, demonstrating that our prototype worked. It was also simple and fun to play with, and Lee felt that it was a good primer to train users to interact with later scenes. Much later, we added some light artwork and added it to the rotation.

This scene started also started as an experiment, based on our first forays with Grant Skinner's proximity management engine. Scott had been trying to incorporate the proximity manager into Luminance, and was using the line drawing code from Skinner's demo to check if the dots were capable of interacting with each other. It was compelling enough on the large screen that we decided to polish it a bit and put it into the rotation.

"Inflation aka the Stay Puft Marshmallow Man"
Born on our initial storyboards, the artwork was originally meant to be a trail of expanding bubbles that the user would paint across the screen. Much later in our development, we decided that it would make a perfect transition to the "Foggy Windows" scenes.

"Foggy Windows"
Also one of our early ideas, this series of scenes was the most technically challenging. Our initial idea was to have a window on the screen that the user would have to repeatedly wipe, as if they were looking through a foggy window at a scene in the distance. In our brainstorming, we hit on the idea of having a moving scene in the background with interactive objects, as if the user were looking out a car window.

Flash's drawing API did not, however, present a clean method to have the wiped areas fade back to opaque, as we had hoped. JJ hit on the idea of dividing the window into squares, and dealing with each square's opacity individually. While this dramatically changed the character of this scene, it also prompted a major redesign of Luminance's architecture.

Developing Foggy Windows rewarded us with a wealth of knowledge about the technology we were working with, and about the way users would interact with it. Foggy Windows seems to elicit the greatest variety of user responses; some treat it like a puzzle, trying to guess what the underlying image is, while others treat it like a game, racing to uncover all of the squares.

Foggy Windows Prototypes

These early examples of the foggy windows interaction tested different scripting methods of controlling alpha values layered above a photograph.
1 - Drag the mouse over the image to reveal different parts of the photo
2 - Simple linear change in Alpha property of photograph
3 - Uses a grid of white boxes over a photograph and controls alpha property of each individual box.


"Koi Pond"
Directly from the storyboard, the development of the Koi Pond also posed tremendous technical challenges. Early versions simply dealt with having the fish flee the cursor. Creating this scene taught us how to incorporate three basic user interactions into other scenes: pushing, pulling, and touching. Later revisions introduced us to problems such as integrating video footage into the background, and color management.

The code for these scenes was inspired by a series of demos from Specifically, they came from a set of lecture notes by Jared Tarbell at Flash Forward New York 2004, called Hatching Computational Creatures.

Barslund Repulsion


Creative Commons License
This work is licensed under a Creative Commons License.