Spent a little time today on another tangent. One thing I didn’t like about those faux-cityscape renders was the fact that you completely lost all sense of the originating data. This isn’t necessarily a bad thing, but part of the reason I developed this whole system was to bring forth the energy and motion that actually went into creating the “seed” drawing.

So I took a step back and created a new renderer that let me isolate the individual “strokes” that were captured during the drawing session. In these renders, I’ve isolated three strokes; each has a unique color. The peaks in the height are derived from the relative velocity of a stroke at a given snapshot in time.

In Cinder, I created a GL scene that has a positionable camera and lets me page through each stroke. Then I can tap a key and dump out that stroke’s Sunflow scene data to the console. Along the way, I learned how to use the TriMesh class in Cinder. It made dumping the Sunflow scene data easier, since it really parallels Sunflow’s “generic-mesh” type.

The render at the top uses three sphere lights, a basic diffuse shader for each object, and Sunflow’s path-tracing global illumination system. The render below uses the Sunflow sunsky light, a foggy Phong shader on the three strokes, and the “fake” global illumination setting in order to get some vague ambient light. I started discovering that there are a lot of possible combinations for lighting in Sunflow — almost an overwhelming number.

Next I’m gonna try a different drawing technique for rendering these strokes.

+ View large.

Well, that itch has resurfaced, and I realized I was making things way too complicated. This time, I’ve turned to using some open source tools for the data capture portion of the project. Components include:

• Computer
• Webcam
• Community Core Vision (CCV)
• Color Tracking Patch for CCV
• Processing TUIO Client API

It’s actually really simple to get set up. Here’s a little demo of how it all comes together.

Next steps include making a client to listen for the TUIO data generated by CCV. I’m probably going to opt for an AS3 AIR client, since it’ll be fastest for me to create. Then create a web application that captures and stores this data. This I’ll build in CodeIgniter, again, since it’ll be fastest for me to create in this environment.

I’ve got a lot of stuff on my plate this month, and I want to participate in this month’s NaNoDrawMo on top of it. So, we’ll see where things net out.

No, guys, seriously. This is pretty bad. So bad, I don’t even want your comments. But I really needed to do something that was not programming.

I think once a week, I might try to make an iPhone wallpaper. Here’s the first. Looks like crap on your iPhone. No, seriously. Download it and then delete it.

The font is MOD™ from Fontfabric™. It’s free. You should snag it.

Some progress has occurred. C++ is becoming clearer. Here’s what progressed in the first couple images:

1. I created a Tween class for animating values. It’s modeled after CASA Lib’s Tween class. I’ll probably be releasing it to the community soon.
2. I hooked up my MIDI controllers to the piece, so I could have more control over tweaking values. I’m using a great add-on for openFrameworks called ofxMIDI.
3. Along the way, I learned how to implement openFrameworks event dispatchers and listeners. (Hint: search for “poco events” in the openFrameworks Wiki if you want to learn how.)

In doing all this, I was able to trigger light movements with a MIDI controller. I used my M-Audio Trigger Finger’s velocity-sensitive pads to animate two lights. Hard tap = fast movement.

+ View hi-res on Flickr.

Here’s a video of the animated lights in action. Please excuse the stutters; while this does run at 30fps in realtime, SnapzPro isn’t able to keep up because of the CPU usage of the piece.

Now after all this, I came to realize that I really wanted to be able to loop the Perlin noise that was creating the height map of the tube. Because, though you can’t see it, there’s an awful seam on the side facing away from the camera. By looping the noise, I could reliably look at it from all angles.

After some research, I came across a great library called libnoise. Took me a little while to get it to compile, only to realize that while it did the job, it dropped my framerate from a respectable 45fps to 9fps. Definitely not suitable for realtime noise generation.

So I went back to the fastest Perlin noise generator I could find (this class from John Ratcliff), and I decided to live with the seam in the back.

Amidst all this, I also stumbled upon this awesome blog post about Twisted Architecture. I thought it would be cool to implement something like that in my piece. So I did. But then I forgot about it.

It was only when I started twisting the “twist-associated” knob on my MIDI controller that the damn seam actually came to life. So, you can see how it starts to play out in the rest of the images here:

+ View hi-res on Flickr.

+ View hi-res on Flickr.

+ View hi-res on Flickr.

+ View hi-res on Flickr.

Also, in those last couple renders, I added a convex mesh to the background so that I could start incorporating background colors properly. Moreover, so I could get some light-generated gradients happening. More to come… more to come.

I promised a friend I would draw her something. In color. Today. So I did.

While the light was being beautiful, I grabbed a clock and an Ikea light and created a quick composition. Below you can see the source reference photo and the process. Took about a half hour. Plus or minus some wine and scotch. You can catch the higher res images over on the Flickr set.

+ View the hi-res on Flickr.

+ View the hi-res on Flickr.

+ View the hi-res on Flickr.

+ View the hi-res on Flickr.

Well, that took long enough. Last night I launched the new version of mikecreighton.com. This morning, I polished up a couple things, so technically this post is a “YESTERDAY, CREATED.” update.

There’s still some work to do, like hooking the content up to ExpressionEngine, implementing this “Faust” technique, and sticking some Google Analytics events in there.

But for now, I’ve got something fresh online representing some of my work.

I needed to get this prototype out ASAP since some of the strength of the design direction I’ve chosen has to do with this uber-zoomed image pixel grid thingy. When I was designing it, I wanted to take advantage of Flash’s ability to smooth a scaled Bitmap. So, that’s what you’re seeing in this prototype.

I still have to figure out what to do with the motion, but the overall effect is achieved in the prototype. In the end, I’ll be sampling a 35×35 pixel rect of a loaded image and blowing it up to fill the stage. This is a little smaller than that, but the performance remains fast at either size.

Yesterday, I was trying to unload the charge of my (now old) MacBook Pro, in an effort to calibrate it. I thought, what better way to kill the battery than to open up Netflix Watch Instantly, pump up the volume (or the jam), and jack the display brightness as high as it would go. Movie of choice: Helvetica.

I was drawn into the interview at the beginning with Wim Crouwel and his description of his use of the grid. The man is absolutely masterful using the grid as a constraint and rule system — and exploiting the hell out of it.

Inspired, I decided to continue playing with that word pair “Hyper Violent“.

Also, my first time using the new Illustrator CS4…

On my new 15″ MacBook Pro…

Jeez, someone get me away from the computer. I seriously have no idea what I’m doing.

I spent the last couple days making a desktop wallpaper-generating web app out of the previous experiment. Click the image above to check it out.

I tried to add a majority of the common 4:3 and widescreen desktop screen sizes. Make sure you’ve got Flash Player 10. The app will generate a slightly-compressed JPG for you.

Now that I’ve created this, I’m going to apply for a Kuler developer API key so that I can add a “randomize” button for the color palette that pulls in a color scheme from Kuler.

UPDATE (11-29-2008): Added a size for the iPhone.