I have been following the development of Processing for a couple of years now, and I am generally astounded at its remarkable capabilities. Even the learning exercises are presented in such a elegantly simple fashion, that the language is nothing short of sexy. Add in some of its more robust capabilities of interacting with hardware, its image and video processing features, and it is clear that Processing is a must-have tool for anyone interested in prototyping and code sketching. Well, in the spirit of getting off the sidelines and into the fray, I picked one of the ideas I have been sketching on paper, and have begun to use it as a model to learn Processing. A couple of mechanical details to start off:

• Processing is a Java based variant.
• It features a nice core set of functionality, but relies heavily on external libraries for its true power.
• It includes a fancy pants, light-weight IDE that works pleasantly on my Macs.

I learn by doing, so I immediately started writing my copies of the projects featured on the Processing web-documentation. Pretty painless stuff working through the fundamental drawing/rendering concepts, but I found that I need a better understanding of some fairly sophisticated mathematical concepts. Now, I'll admit, I probably made this more complex for myself than I needed to, but I did had fun figuring this sucker out. The problem: draw a line on the canvas, and then rotate it around its centerpoint like a propeller. Seems simple right! Well let's see how it goes

Pretty simple stuff, just a quick setup of the canvas.

Yeah. I told ya! Well, allright, its actually a lot easier than it looks. Let's break it down. The variables declared first give you a preview of what's to come. I find it easier to think about rotation in terms of degrees, like hands on a clock. Processing, however, deals with rotation in radians, so you know we'll have to deal with a conversion down the line. The pushMatrix() function works essentially as a frame-buffer. This allows you to perform any number of transformations before drawing the result on screen. Now, speaking of transformations: The translate() function is used here to redefine the origin of the canvas to dead center. The reason for this is that the problem statement was to rotate the line like a propeller around the centerpoint, and not one of the ends. With the origin redefined to the center of the canvas, we perform the rotation. As I mentioned before, Processing takes in parameters to the rotate() function in radians, so we need to do a little math first. degVal is basically an incrementing variable. So we convert easy to understand increments of whole numbers into radians by multiplying the increment into (PI/180). Now we finally draw the line! Remember that the origin is now in the center of the canvas. I wanted the line to bisect the window, so my coordinates should make sense. And finally, popMatrix() is the corresponding bookend that outputs the contents of our buffer to screen. I really enjoyed this exercise because I feel like I got to learn a couple of interesting mechanics of Processing by solving a very specific problem. Granted, its not the most complicated or difficult problem, but nonetheless, I was forced to visualize what I wanted to accomplish and explore some different vectors to actually materialize it!.