When I first started out with computer programming, what has grabbed hold of my attention were the drawing functions. Drawing and animating is the instant gratification of computer science learning. One can write the most beautiful code, performing cleaver calculations – but unless there’s more on the screen than a set of numbers, it will fail to grab new student’s interest.
This is one of the things I liked about Turing, it had one of the simplest drawing libraries available. Recently I’ve discovered something better – Processing 1.0 (BETA).
“Processing is an open source programming language and environment for people who want to program images, animation, and sound. It is used by students, artists, designers, architects, researchers, and hobbyists for learning, prototyping, and production. It is created to teach fundamentals of computer programming within a visual context and to serve as a software sketchbook and professional production tool. Processing is developed by artists and designers as an alternative to proprietary software tools in the same domain.”
Processing is a language that favours media. It is incredibly easy to put together interactive animations, or computer generated images. Here’s an example applet, followed by the source code behind it.
* Mouse 2D.
* Processing Example
* Comments by Tony Targonski
// initialize the environment
// window size
// do not outline shapes
// RGB colour mode, 255 max colour, 100 max alpha
colorMode(RGB, 255, 255, 255, 100);
// draw Rectangles from the center, not (default) corner
// set framerate to 30 FPS
// draw frame. Called once during each loop iteration
// clear the background with 51/255 grey
// set drawing colour to 255/255 grey, 80/100 alpha
// draw two rectangles
rect(mouseX, height/2, mouseY/2+10, mouseY/2+10);
rect(width-mouseX, height/2, ((height-mouseY)/2)+10, ((height-mouseY)/2)+10);
I am pretty amazed by how much the environment handles on its own. Setting
frameRate(30); will take care of frame rate control, and one can use
mouseY right away, without initializing or figuring out where is a good place to read updated user input.
I think that Processing is great for prototyping animations, or for working with computer visualization. In fact, it’s already used for teaching at:
And many others
This Java based language is very simple to use. The cross-platform environment is available for Linux, Mac OS X, and Windows. And the generated applets could easily be embedded into webpages for viewing and sharing, such as in this post.