Learn creative coding writing simple programs

150. Webcam light tracking and air drawing

This episode shows two things you can do with a webcam.

The first one is tracking an object which is easy to distinguish from the background. We use brightness() to search for bright pixels, but you could also use red() to search for very red pixels, or one of the other functions that return color properties.

At home at night this works very well. Doing this for an art installation is more tricky, because the location might be very different from your home environment. People can wear crazy colors, the sun spins around continuously changing the light, and lights may be turned on and off. If you want to know more about this field, search for computer vision (CV). There are some libraries out there which can help.

Ideas: try to make a simple game which you control with light, use light to increase and decrease a parameter in your program, or use light to give instructions to your program.

The second experiment we do in this episode is using light to draw. It's actually a very simple trick. Instead of drawing everything that comes out of the webcam, we just draw the bright stuff, and the rest we ignore. In our experiment we draw white on black. But you could change the colors as time passes, or you could continuously fade the drawing to black, giving you a nice trail effect. A more advanced experiment you could do is to create blinking particles and combine them with the video feed, so you could move a magic wand in front of the webcam and it would leave floating sparks :) So many things to try!

Tags: webcam, tracking, drawing, capture

Code editor

You can make changes to the code below. Then

Questions and comments

Try to stay close to the topic of this episode. Use the Processing forums for help with unrelated Processing projects (or hire me for help ;-)

To indicate that a word in your comment is code, use the `backtick`. Example
Do `float` and `int` smell similar?
To highlight code blocks, surround it with ``` code-fences ``` like this:
``` void setup() { size(600, 600); } ```