Gene Lu's Portfolio

Airloom Accomplished

As the semester was coming to an end, we had set our eyes on a working prototype that would provide users with an accurate Airloom experience. Prior to jumping into production, we had set up checkpoints to help us reach our, what seemed at the time, almost impossible goal.

Creating the Airloom
All I can say is that we were REALLY fortunate to have an industrial designer on the team. Using only a lathe and some sandpaper, Evinn Quinn was able to turn a block of wood into the Airloom’s final form (as seen in the proposed sketches below). I’ll leave it to him to explain the whole process along with his journey across the island of Manhattan in search of a wood shop with a working lathe. Apparently, the SVA sculpture studio’s wood-working equipment decided to go fishing during the last week of school.

Sketches of the Airloom by Evinn Quinn

Sketches of the Airloom by Evinn Quinn

Airloom's final form with a working virtual power button projected onto it

Airloom's final form with a working virtual power button projected onto it

Hardware Setup, a Projector and Rings
In order to simulate a touchscreen interface without shelling out money for a $10,000+ table, we took cues from IDEO Lab’s multi-touch Flash API and Wiimote hack, which uses infrared lights to communicate with the Wiimote through Processing. To help project the interface onto the table, Russ Maschmeyer strategically clamped a projector to the ceiling along with a Wiimote attached to its back.

DIY touch table with Wiimote mounted to a projector from the ceiling

DIY touch table with Wiimote mounted to a projector from the ceiling

Russ then went through several iterations of “touch” rings, which consisted of an infrared light, a button switch as an input sensor, and a cell battery to power the whole setup. These rings would be used to simulate “touching” by users while interacting with the Airloom’s touchtable interface.

Prototype of touch ring

1st Prototype of touch ring

2nd Prototype of touch ring

2nd Prototype of touch ring

 

Coding the Darn Thing
Russ and I worked on coding the interface using AS2 since that was what IDEO’s multi-touch platform called for. Prior to diving into the code, there were a couple of things that we did to make this epic task more manageable.

  • Listed out all the different views and corresponding interactions required by the interface (on a whiteboard wall of course!)
  • Reused some code from an Actionscripting class I took a few years ago with J. Davis
  • Utilized the powerful Tweener to do all our tweening programmatically
  • Created and shared functions between Russ and I (I’m sure we could of used classes and all, but we only had a week to do this)
Testing the touch table with code from Joshua Davis

Testing the touch table with code from Joshua Davis

User Journey through Illustration
While Evinn was creating the Airloom, and Russ and I cranking away at the code, Kristin Gräefe did a killer job on creating the final user journey for the presentation. In spirit of our initial user scenario, she beautifully illustrated us as how we would look in the future, when we would have our own Airlooms that would be passed down to our younger generations.

The Airloom team as sketched by Kristin Graefe

The Airloom team as sketched by Kristin Graefe

Final Demo
During our final presentation and demo, I realized that all the hours we had put into the project within a short amount of time was well worth it. I even witnessed several “oh shit!” moments as people watched the Airloom come alive during the demo. The president of the School of Visual Arts even took part in the Airloom experience.

Comments are closed.

Information

  • 05 May 2010

Filed Under

Tags

Recent Articles

Lead UX Designer on Nike+ Running at R/GA.