Updated Kinect Library for Processing

A quick post to announce an updated Kinect library for Processing on github. This new library uses the most recent libfreenect drivers (mac os x only still) and builds off of the existing JNI Java Wrapper. Links:

Download library and example:
openkinect.zip

Source:
https://github.com/shiffman/libfreenect/tree/master/wrappers/java/processing

My tests show 30 FPS no problem for either the depth or RGB image, if you request both images, however, I’m only currently getting about 20 FPS. The update fixes a few bugs, exposes the raw depth data and includes a point cloud demo (see above video).

I have a list of “to-do” items here:

https://github.com/shiffman/libfreenect/issues
(a shortened version of the very long list in my head)

Kinect and Processing

Kinect Processing Library in Action

This is all very preliminary, but here is a first pass as a Processing Kinect library:

http://www.shiffman.net/p5/kinect.zip
(Mac OSX only for now, sorry!)
UPDATE (12/18/10): New version of the library can be downloaded from github:

openkinect.zip.

Source: https://github.com/shiffman/libfreenect/tree/master/wrappers/java/processing

None of this would have been possible without the heroic efforts of Hector Martin, the OpenKinect project, and various members of the openFrameworks community. There’s a great thread with discussion and code here:

http://www.openframeworks.cc/forum/viewtopic.php?f=14&t=4947

Video in action here:

Processing code looks like:

 
import shiffman.kinect.*;
 
PImage img;
PImage depth;
 
 void setup() {
  size(640,240);
  NativeKinect.init();
  img = createImage(640,480,RGB);
  depth = createImage(640,480,RGB);
}
 
 void draw() {
  NativeKinect.update();
  img.pixels = NativeKinect.getPixels();
  img.updatePixels();
 
  depth.pixels = NativeKinect.getDepthMap();
  depth.updatePixels();
 
  image(img,0,0,320,240);
  image(depth,320,0,320,240);
}

Processing and Threads

This year in my ITP Introduction to Computational Media course, we added an two new weeks of material about Strings, server-side programming, and databases. These tutorials can be found here: Part I, Part II.

The most common question I’ve received since then is “What if I want to request the data continuously in draw()?” And to answer this question, I’ve posted a new tutorial on the Processing wiki page about Threads:

http://wiki.processing.org/w/Threading

In addition, related to my last post about streaming video in Processing, you can download an example that receives the video stream in separate thread.

Streaming video with UDP in Processing

UDP Video Streaming from Processing

ITP students Jeff Howard and Alex Vessels are working on a video piece for the upcoming Big Screens show. One of the challenges we’ve always had working on the IAC Video Wall is that the computers that actually drive the wall are locked up in a control room far away from the lobby itself. So any external devices (cameras, sensors, etc.) have to communicate with those machines over the network. For this year’s show, we’ve developed a new solution using UDP streaming to send imagery from a camera to the control room.

This example owes a ton to the Processing UDP Library by Stephane Cousot. I’m using the Java DataGram classes directly instead of the Processing library, but the code draws heavily on techniques from the UDP library.

A couple quick notes about the code.

First, whenever sending data over a network, it’s generally a good idea to try to minimize the amount of data. A 320×240 image has 76,800 pixels, each pixel having 3 bytes (red, green, and blue). That’s 230,400 bytes that need to be sent 30 times per second. It’s do-able, but if we could compress the image first (encoding it as a JPG, for example) before sending, this will save a ton. Encoding a JPG in Java is pretty easy since the ImageIO classes take care of that for you. Assuming you have a PImage variable “img” the code looks something like:

  // We need a buffered image to do the JPG encoding
  int w = img.width;
  int h = img.height;
  BufferedImage b = new BufferedImage(w,h,BufferedImage.TYPE_INT_RGB);
 
  // Transfer pixels from localFrame to the BufferedImage
  img.loadPixels();
  b.setRGB( 0, 0, w, h, img.pixels, 0, w);
 
  // Need these output streams to get image as bytes for UDP
  ByteArrayOutputStream baStream = new ByteArrayOutputStream();
  BufferedOutputStream bos = new BufferedOutputStream(baStream);
 
  // JPG compression into BufferedOutputStream
  // Requires try/catch
  try {
    ImageIO.write(b, "jpg", bos);
  } catch (IOException e) {
    e.printStackTrace();
  }

You might also notice that the above code includes a try/catch statement around the encoding of the JPG. Certain “exceptions” (i.e. errors) in Java require special handling and try/catch is one way of fulfilling that requirement. You’ll see in the example code that try/catch is also required for the UDP communication. For more about exception handling in Processing check out: http://wiki.processing.org/w/Exceptions.

Finally, you’ll also notice in the examples that you are required to specify the IP address you are sending to and the port, i.e.

int clientPort = 9100; 
InetAddress client =  InetAddress.getByName("localhost"); 
ds.send(new DatagramPacket(packet,packet.length,client,clientPort));

The port can be anything (as long as it doesn’t conflict with a port you are using for something else). Generally, 9000 and above is a safe bet. The IP address should be the IP of the machine receiving the video stream. For demonstration purposes, it’s simply “localhost”, i.e. we’re going to send and receive on the same machine.

Finally, the checkForNewImage() function in the VideoReceiver example is blocking, meaning if no data is coming in Processing will stop and wait. So really, it should exist in a separate thread. Stay tuned for an updated threaded version as well as simple thread tutorial!

Update: the thread example is in the download and more here:

http://www.shiffman.net/2010/11/13/processing-and-threads/

Download the code for sending and receiving: image_streaming.zip.

ITP at Maker Faire

This weekend, at the mind-blowing Maker Faire NYC 2010, I presented the Most Pixels Ever framework in the ITP Cafe. I was lucky enough to be included with my software-only project even with my ineptitude at physically making actual stuff.

This was my first Maker Faire and I sincerely hope it won’t be my last. A special thanks goes out to Tom Igoe, author of Making Things Talk: Practical Methods for Connecting Physical Objects for doing an amazing job of organizing the ITP Cafe.

Processing the Summer

IMG_1079 IMG_1085

School is out for summer so I’m taking a break from teaching classes in order to teach (?!?!) workshops. I just returned from a lovely visit to Amsterdam, where I led two full-day intensive Processing workshops at Mediamatic. I also was super thrilled to present with Jer Thorp at Mediamatic’s Processing Salon. Jer’s work is fantastic and inspiring. His presentation was one of the highlights of my trip.

IMG_1095 IMG_1103

Next stop a 3-day advanced Processing workshop with the D3D masters students at Naba in Milan. I was lucky enough to be in Milan for the opening of Triennale’s Design of the Other Things exhibit, which included work by Massimo Banzi of Arduino fame. Also, a special thanks to Filippo Vanucci who came in as a guest presenter to talk about his ITP thesis project: Scrollables.

This month, I’ll be teaching a few sessions at ITP’s new Summer Camp (for grownups) as well as two Processing workshops at this year’s OFFF. I’ve been getting many e-mail questions regarding what exactly will be covered at the OFFF workshops so here’s a quick outline for anyone thinking of attending.

Processing Pixels, June 24, 10 am to 2 pm

  • What is Processing?
  • The “pixels” array
  • The PImage class, loading and displaying an image
  • Image Processing 101, reading and writing pixels
  • Image as look-up table of colors
  • The Capture object, creating a software mirror with live video
  • Introduction to computer vision, color tracking, etc.
  • Overview of computer vision libraries: BlobDetection, openCV, CCV/TUIO/multitouch
  • Time to work and ask questions

Most Pixels Ever, June 25, 11 am to 1 pm

  • What is Processing?
  • What is openFrameworks?
  • Examples of ITP “Big Screens” projects
  • How does MPE work?
  • What is MPE good for?
  • Demo of MPE for Processing
  • Demo of MPE for openFrameworks
  • Time to work and ask questions

Box2D ContactListener in Processing

view applet, download source

Above is a new Box2D Processing example that demonstrates two key aspects of working with Box2D:

1) Though tempting as it may be, you cannot set the location manually of an object in the Box2D world and expect the physics to continue to work. Box2D doesn’t understand teleportation (which is the equivalent of telling an object to disappear and then reappear at a different pixel). Rather, if you want to move an object manually, you can attach a joint to the object and tug it around. This way, you control its motion and yet it still lives within the world of Box2D physics. The example demonstrates how this is done with a MouseJoint. The object moves according to an perlin noise algorithm (unless the mouse is pressed in which case it follows the mouse).

2) The example also demonstrates how to use Box2D’s ContactListener to know when objects have collided. The circles turn red when they encounter the square.

It’s my intention to eventually add this example with further explanation to the Box2D tutorial.