So, you’ve got some nifty visualizations patched in Apple’s Quartz Composer, and something clever using video mapping in Processing: now combine them. Our friend Steve Cooley writes to say that he’s figured out a way to do just that, starting with a Processing sketch he originally programmed for live video. Thanks to Quartz Composer’s integration with QuickTime (QC patches run inside QT 7 video clips), and Processing’s support for QuickTime, you embed the QC patch as a video clip. Anything that plays back in QuickTime player should play back within Processing. (Note that that doesn’t give you the full interactivity and I/O of Quartz Composer, but as can be seen in the example below, it can create some very compelling effects, particularly as you use both these tools for quick sketches, prototyping, and visual improvisations.)

(As Steve points out, if you want to save videos of your work like this one, check out our friend Daniel Shiffman’s excellent MovieMaker library for Processing.)

Full details and the original Processing sketch and Quartz Composer composition at Steve’s blog:

Quartz Composer inside of Processing [Steve Cooley Fine Art]

No source code, but you don’t need it: just point at the .mov file exported from your QC composition. Needless to say, this is Mac only, and requires 10.4 and QT 7. animation, Mac, processing.org, quartz composer, Tiger, tips, video

Bookmarks, bookmarks, bookmarks. I like bookmarks. While going through my referrer logs this morning, I found Create Digital Motion, which has been added to my bookmarks both as a blog to read and as a learning resource.

With forums and tutorials (complete with video), this site should be of particular interest to VJs and people interested in experimental interfaces. I will certainly be checking it out regularly. 

Processing.org’s fabulous exhibition has been updated with Grass, an installation by The Barbarian Group for Saturn (the car) shown at the recent Wired Nextfest here in New York. As usual, something that looks quite simple has a lot of elements:

1. Installation: Barbarian Group relied on veteran Obscura Digital for the installation; auto exhibition exhibits are an ancient, time-tested trade, and calibrating projectors perfectly is a b****. (I’ve been doing a lot of it this month. I’m terrible at it. I hate it. Straight lines and I don’t get along.) Four back-projected DLPs do the dirty work.
2. Camera tracking: This part is comparatively simple: the camera looks for dark spots against the projection (presumably in the visible light spectrum, since shadows is what you want) and compares frame-to-frame motion for the movement.
3. Grass: The grass is a series of segments, bent along a gradual decay. (Scroll down in the example above; they explain it fully.)
4. Perlin Noise wind: Hooray for Perlin Noise! This random generator works very well for this kind of organic material. (You can also generate Perlin Noise in Flash 8 and later.) Google it; it’s one of the greatest things ever.

The results are lovely, with interspersed text floating in. Of course, Saturn’s needs were comparatively modest; they just wanted a nice, pretty background for pushing their hybrids — it’d be nice to see these concepts taken further.

OpenGL in a Browser

Equally, interesting, though, is that the creators present a simplified version of their Processing file rendered in OpenGL rather than P3D, which is what you’d normally use for 3D in a browser with Processing. Yes, that’s an actual OpenGL rendering inside my Firefox window below. Your mileage may vary; Jaymis reports he can’t make it work in Opera.

If you’re interested in doing this yourself, java.net has an example using the JOGL Applet Launcher:

jogl-demos: JOGL Applet Test

I haven’t yet tried to hack Processing myself to make Processing files work, but both your Processing sketches and other Java JOGL projects should work. Note that you’ll want to look at the video, too, as they had to compromise a bit to make it work well in a browser. Viva Java — can’t do that with Flash, for sure. (Of course, I may have spoken too soon, as Firefox 2 RC3 promptly crashed after looking at the JOGL player.)

I’m guessing that a lot of the polish of the finished work has to do with using creative filtering and anti-aliasing in JOGL, as well.

flickr Feathers

While we’re on the subject of lovely, organic designs, blprnt has created a beautiful sketch that reads image color values from flickr using Flash 8 and later:

Plumage: FineFlickrFeathers (via Processing Blogs)

Flash, not Processing in this case, though you could do something similar with Processing. (And the above project could be adapted for things Flash does well — depends on how 3D you want to go, in part).

But let’s put the technology aside a moment: the real lesson here is that great work is created by working:

I’ve been somewhat disappointed with my creative output as of late. So, with a day off of client work, I set out this morning to make something interesting before the end of the day.

Yep, we’ve been there. Doing a one-day opus is a great idea. As for getting that day off? That I can’t help you with.

browsers, cv, Flash, installations, interactive, java, opengl, processing, processing.org

The video is a screencast of RhNav - Rhizome Navigation visualizing the Blogosphere as a 3D graph using the technorati API. www.rafelsberger.at is used as a starting point.

For more information please take a look at: http://www.metaportaldermedienpolemik.net/blog/Blog/2006-10-18/Animated%20Visualization%20Draft%20of%20the%20Blogosphere

Author: walterra

Keywords: visualization animation blogosphere blogs graph processing.org

Added: October 18, 2006

I've been somewhat disappointed with my creative output as of late. So, with a day off of client work, I set out this morning to make something interesting before the end of the day.

I've been exploring color visualization over the last few months, and during one of my experiments, I came up with a result that looked something like a feather. Today I decided to take that idea further, and built Plumage, which takes a Flickr tag and creates a set of feathers from the colour data in the image.

It also gave me a chance to write my first PHP script - two whole lines! Next time, I'll work on three.

Let me know what you think - I'd love to hear comments and suggestions. As always. 

I’ve been meaning to add something to processing hacks for quite some time now. This morning, I needed a basic function to wrap text in Processing so came up with this snippet.

// Function to return an ArrayList of Strings
// (maybe redo to just make simple array?)
// Arguments: String to be wrapped, maximum width in pixels of line
ArrayList wordWrap(String s, int maxWidth) {
  // Make an empty ArrayList
  ArrayList a = new ArrayList();
  float w = 0;    // Accumulate width of chars
  int i = 0;      // Count through chars
  int rememberSpace = 0; // Remember where the last space was
  // As long as we are not at the end of the String
  while (i < s.length()) {
    // Current char
    char c = s.charAt(i);
    w += textWidth(c); // accumulate width
    if (c == ' ') rememberSpace = i; // Are we a blank space?
    if (w > maxWidth) {  // Have we reached the end of a line?
      String sub = s.substring(0,rememberSpace); // Make a substring
      // Chop off space at beginning
      if (sub.length() > 0 && sub.charAt(0) == ‘ ‘) {
        sub = sub.substring(1,sub.length());
      }
      // Add substring to the list
      a.add(sub);
      // Reset everything
      s = s.substring(rememberSpace,s.length());
      i = 0;
      w = 0;
    }
    else {
      i++;  // Keep going!
    }
  }

  // Take care of the last remaining line
  if (s.length() > 0 && s.charAt(0) == ‘ ‘) {
    s = s.substring(1,s.length());
  }
  a.add(s);

  return a;
}

Charming, brilliant, crazy, amazing…

Almost like this, you get the idea. If you have a chance of seeing him, don’t say that i didn’t tell you.

tags:barcelona daedelus

If only my college lessons had looked like this !

Some of my interactive works will be exposed in the concert hall named Florida in Agen, the town where I live and work. This will be part of a global installation focused on the use of free and open-source softwares for creating music, animations, films, …

Among other, Banjamin Cadon from Labomedia will talk about Pure Data, and my friend SevenFive will play live. All is free and opened to public so if you happen to be in the area, just come and stop by.

Grass! New software from The Barbarian Group added to the exhibition.

I received my Arduino today, and in preparation I’ve been saving up some Arduino/Wiring/Processing links of interest to a newbie physical-computerer.

If you haven’t Arduino’d before, here’s Todbot on why it’s a rocking little microcontroller. Tod also tells us how to make an Arduino Breadboard Shield, for quick circuit prototyping.

You should probably familiarise yourself with the Arduino Board, then have a look at ARDUINO meets PROCESSING - physical computing and computer graphics site: Projects containing the basic physical interactions mediated by an Arduino board.

The Arduino meets Processing project intends to make it as easy as possible for anyone to explore the world of physical computing. All you need is an Arduino board as well as the Arduino and Processing software, which you can download on their project websites.

Some of the pages seem a little incomplete, but it contains basic circuit information and code for: Pushbutton, Switch(es), Tilt Sensor, Accelerometer, Potentiometer, LDR Light Sensor, NTC Temperature Sensor, Joystick, Ultrasonic Sensor, Piezo Element.

Of course the Arduino Tutorials page has loads of examples. Of major interest to VJs may be:
Blinking LED.
Dimming 2 LEDs (RGB colour mixing).
LED Driver makes use of an LED Driver in order to control an almost endless amount of LEDs with only 4 pins.

Both Peter and I have Arduinos now, so you can expect things to be getting a little more physical in the future. Don’t be scared, we’ll be gentle. arduino, coding, custom, development, electronics, examples, hardware, how to, learning, LEDs, motion tracking, physical computing, processing.org, programming, Resources

“I just hate information visualization. Those guys want to put lines everywhere”

“That thing that you listen to sounds like a radio out of tune“

“Blogs? Aren’t they those web pages where teens tell their secrets?”

Oversimplification is lovingly enlightening when applied to something that you usually spend a lot of time thinking in.

tags:oversimplification

After the  recent workshop by joan soler-adillon in hangar, we’ve known of two more forthcoming workshops:

• on October the 16th, 19th, 23th, 26th, 30th and November the 2nd, gerald kogler will teach one at the centro cívico Golferichs of barcelona. + info
• on October the 24th, 25th and 26th, federico joselevich will give another one in Granollers, at La Fàbrica de les Arts. + info

tags:barcelona processing.org worshop