They are watching. - Interactive display (Flash/AS3)

By Stephen Holdaway

10 Oct, 2011

Instructions:

  1. You need a webcam or other video device plugged in. If you don’t, you’ll just see black.
  2. Toggle the application on. It’s reasonably CPU intensive even when idle, hence it’s off by default.
  3. Allow flash to use your camera
  4. Select the right camera (if required) under the flash settings menu
  5. Use the controls below to play with it. You’ll probably want to press D to change display modes, since the default mode isn’t much fun. Also, move out of frame, then click to get comparison frame without you in it; the effect is better this way.

Controls:

Left click - take a new comparison frame (used for computing difference)
D - Cycle display modes
C - Cycle resolution (640x360, 960x544, 1280x720)
F - Toggle fullscreen (non-embeded version)
G - Toggle grain
H - Toggle reflect horizontally

Behind the scenes

Following closely on the heels of the text-to-speech rap I created in the previous project for this course, this interactive display was my own take on our group’s ‘life as a role-playing computer game’ manifesto. A large part of our manifesto suggested measuring everything that every person does in order to have game-like stats and leveling up in real life. Naturally this would require an obscene amount of surveillance; They are watching was a response to this.

I ended up with a few days around classes to develop an application from my design concept. I knew roughly how the code would work, since I had already completed two projects using a similar method – image difference combined with blob tracking. The primary issue was that I needed a cross-platform solution for capturing video from a webcam. I first tried Processing since I had used in my first year at uni, however that required QuickTime and a few other nasty hacks just to get a video stream. Next I tried Java, but again I couldn’t find a solution with no dependencies and/or a guarantee to work. Finally, after a a night of trying odds and ends in a variety of different languages, I settled on Flash and ActionScript 3; it just worked with webcams, and as a bonus I found an existing blob tracking algorithm written in AS3.

The next slight hurdle was that I had never worked with Flash or ActionScript before. Ever. Not to worry! I figured out the syntax on the go and had a working application by the end of the night. Not the most efficient application, but it worked.

Notes

Since this was made for controlled deployment with my own webcam, three resolutions are hard-coded (at 30fps): 640×360, 960×544 and 1280×720. I have no idea what will happen if a device doesn’t support one of these resolutions, but I imagine the application won’t work.

If you have trouble with the embedded version above, you can download a windows binary of this application (5MB).

You can download the source files under the Creative Commons Zero licence.

Images

Rotating panes of fake information tracking on each passer by. This was quickly restricted by time constraints and the rudimentary blob detection algorithm I used.

Presentation display mode.

Running on a TV in the design school atrium

This is a backdated post. The publish date reflects when the it would have been posted originally, however the actual publish date was later. This post was last modified 11 Oct, 2012.