Simple Shapes in Processing

My first experiment with Processing. Draw a simple two-dimensional shape. I've chosen to draw a chess board, or checkered pattern.

Getting Started

I installed the Processing environment and got up and running pretty quickly; the only thing that I tweaked was to point to a sketches folder in my Dropbox, so that when I save a sketch it’ll be uploaded to into the ether-cloud for safe keeping. I will probably end up using some sort of source control, but this will do for now.

The Challenge

I want to draw a chess board pattern in Processing using the rect(); function we were shown today, and I also want to see how processing uses loops and conditionals; for and if.

Problems

This little exercise turned out to be a bit tricky actually. I ended up using some loops and inner loops to step through drawing rectangles horizontally and vertically - with two loops to see if the row was odd or even to start with either a rectangle filled with white or black. I am sure that there is a very, very simple way of doing this with a 2D array (or just better code in general), but I am more than a bit programming rusty. Anyway, I got there in the end.

Final Sketch & Source

The applet is acting weird across different browsers - I’m not sure why. In the meantime here is a non-troublesome image of the sketch, and you can download the source or the jar to run this yourself. You might also be interested in some of the many hilarious failures along the way.
Chessboard Processing Sketch

A small photo of The Author with some lovely tea by way of a witty footer
Paul May is a researcher and designer from Dublin, Ireland; he is currently a student at NYU's Interactive Telecommunications Program (ITP). Feel free to directly (or you can use the contact form). You can also get him on twitter or flickr. Paul enjoys writing in the third person.