I spent some time earlier in the week refining the drawing algorithm even further, focusing on color palette selection and line weight distribution. I think I’m getting closer to something the produces pretty consistent results.

My next step — or perhaps experiment — will be to create some color palettes based on actual color fields that I produce using real paint or some other image source. I want finer control and intention over the possible color palettes, and while toxiclib’s color utilities are pretty amazing, I’m finding that the ColorRange constraints produce less-than-desirable results most of the time (too much or too little saturation and brightness at undesirable moments).

Here’s a demo of the Processing app so you can see the renders in realtime:

And here is some more hi-res output from the app:

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

+ View hi-res.

Here’s a continuation of the Line Sketching post I did last week. What you’re seeing here are larger, higher-resolution renders that use a further-tweaked drawing algorithm, concentrating more on form and color.

The key to these pieces is seeing them in their native resolution. There’s so much texture and pseudo-form that emerges from subtle shifts in a single line over time. Here’s an example:

Full View

+ View it large!

Detail View

I need to continue tweaking the drawing routine and color choices before I’ll be happy enough to take these to a printer. Also, I’m going to be sticking any additional interesting output from this thing into a Flickr set called “Line Topography”.

In the mean time, here are some interesting ones that came out of the last 50 renders I did yesterday:

+ View it large!

+ View it large!

+ View it large!

+ View it large!

+ View it large!

+ View it large!

+ View it large!

+ View it large!

+ View it large!

+ View it large!

Finally we’ve arrived at the final image to be used for the album art of Mode7‘s upcoming EP “Dusk Drops” (see above). There were a lot of contenders, but in the end, this image satisfied a certain visual balance and the general feeling of ominousness that we were looking to convey.

For these final renders, 2850×2850 images were generated by Sunflow, using the special Thinlens camera which allowed me to simulate a shallow depth of field. Each image took about 12 hours to render on a quad-core Intel i5 Windows 7 box.

Further post-processing was done in Photoshop to simulate things that we’d see in traditional photography: vignetting, chromatic abberation, and a subtle level of visual noise. Some color tweaking and other manipulations were done as well just to make the images a bit richer.

For the CD label itself, we’re going to use the following image:

+ View the piece on Flickr.

And then there were a few more images that I decided to render and treat, just because they were compelling to me and I wanted to see what they’d look like if I took them through the entire process.

+ View the piece on Flickr.

+ View the piece on Flickr.

+ View the piece on Flickr.

I’ll be following this post up with a video demoing the Processing app that I created for generating these compositions once they EP has been officially released in a few days.

After the last post, I went in and tweaked a couple of parameter ranges and how the noisy terrain was rendered and generated another 3,500 compositions, which you can see here:

+ See it super large on Flickr.

After the computer churned these out, I spent a few hours looking through them and managed to cull the set down to an even 350. But as I mentioned before, the next step was to render these using Sunflow, which I did right before I left for Minneapolis. Rendering the 350 images at 1280×1280 with no anti-aliasing and a very low sample setting took about 29 or so hours on a quad-core Intel PC. I had it dumping the output into a Dropbox folder so I could check on the progress on my phone during my trip.

Tonight, I took the next step and chose a final set of 29 images that are contenders for the final render. In that render, the visual noise will fall away considerably, and I’ll be generating a 2850×2850 image suitable for a 300dpi CD cover print.

You can see the 29 images I picked in this Flickr set. As of right now, these are my five favorite renders:

+ View the piece on Flickr.

+ View the piece on Flickr.

+ View the piece on Flickr.

+ View the piece on Flickr.

+ View the piece on Flickr.

As I prepare for my new job which starts on January 4th, I’m taking some time to learn Derivative’s TouchDesigner. It’s a realtime procedural 3D / compositing tool. Well, it’s actually so much more than that, but it’s very difficult to describe.

Anyway, I’m trying to learn it. And I’ve found the best way to learn stuff (for me) is to take something I’ve already made and try to recreate it in the new environment. So, that’s what I’ve started doing here. I’m not sure how much further I want to go with this, but it’s nice to know that I could pull this much together after about an hour’s worth of work.

This software is terribly powerful, and more and more documentation / improvements / tutorial videos are being added all the time. It’s making me very excited about 2010.

+ View the piece on Flickr.

+ View the piece on Flickr.

+ View the piece on Flickr.

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.

+ View higher res image.

For those of you following me on Twitter today, you witnessed the pain I endured under the cruel, icy grip of OpenGL.

That pain: learning how to compute vertex normals.

But eight hours later, I managed to pull it off with the help of the OpenGL SuperBible, this thread, and this article. Oh, and this amidst porting it to C++ (openFrameworks) for maximum control and speed.

Along the way, I learned how OpenGL lighting works. I was having such a hard time with it before because my form didn’t have its surface normals nor its vertex normals correctly calculated. So light wasn’t bouncing off it the way I expected. Now it’s all making good sense.

My next steps will be adding interactivity. I’m going to try to use my HP TouchSmart for touch input along with its webcam for vision input. Separately, I’ll try to make some sort of music visualizer out of this — or at least make it audio-responsive.

Check out a video from today:

I’m continuing the Perlin noise saga. The last thing I did was port the Noise Column project over to Processing and openFrameworks.

This time I wanted to add some actual volume — not just perceived volume — to the form. These are just some initial tests that you see above. I’ve got a ton to learn about lighting and optimization and matrix transformations. Robert says I need to use “per-vertex normals”. I say “OKAY!” Hopefully I can start adding some of these things over the next couple weeks and really use this project as a general learning tool.

For now, I’m developing all this in Processing using the PGraphicsOpenGL renderer. I’m not using any actual OpenGL calls directly; I’m only using the Processing API. One little discovery I made yesterday: PeasyCam turns out to be a really sweet little camera library for Processing. Adds mouse control over the camera with a single line of code.

The ultimate goal of this is to create two different pieces. One will be a rendered motion piece. It probably won’t have any audio and will function as an ambient looping video. It will be submitted to this call for entries: Flow Interrupted.

The second piece would actually be interactive. I’m going to toy around with camera, audio, and touch as discreet inputs (all separately). This will give me a chance to play with the new HP TouchSmart PC I got. So you could consider the second execution to be more of an interactive installation piece. And that’s going to be submitted to this call for entries: FLUID Interactive Digital Art.

Check out some of the stills:

+ View larger Image.

+ View larger Image.

+ View larger Image.

+ View larger Image.

For my friend Nate‘s 30th birthday, I created a one-off set of prints based on the Noise Column and Noise Column Wallpaper Generator mini-projects. It was largely an exercise in creating something with OpenGL.

Thus began the effort to port a bunch of ActionScript 3.0 vector drawing commands over to line loops in OpenGL. I used Processing as my framework since I’m used to it, and it gave me a 1:1 mapping of the OpenGL API. I was able to use various C++ OpenGL tutorials and books to accomplish my goals. I used the super-helpful TileSaver classfrom Marius Watz to generate hi-res renders.

Now after all this, I realized that it was time to take the plunge and start getting closer to the metal. Thus began the next port of Noise Column; this time I went to C++.

I’ve been reading Stephen Prata’s C++ Primer Plus for the last couple months on and off. For me, learning from books makes sense. Moreover, learning the reasons for writing the code you write is so essential for retention for me. This book is simply great.

So for the C++ port, I moved over to openFrameworks as my C++ framework. OpenFrameworks is great, but there’s still a long way to go before it becomes the Processing of C++. Regardless, I had learned just enough C++ to figure out how to port all this stuff over. Two days later, I was able to generate a moving version of Noise Column:

Now it’s time to start doing stuff with “real” 3D in OpenGL — a dimension I’ve got nearly zero experience with.

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.