Programming with Processing – CFMS course

I convene a Production Programme in Interactive Media at the Centre for Film and Media Studies at the University of Cape Town. The second semester of the course centres around an Introduction to Programming unit. This is definitely the most difficult part of the programme for the students, as it is where the course shifts from a design course to one which emphasizes the need for students to grapple more seriously with the development, systems and coding of online media.

When I started teaching this course, I taught ActionScript. This was easy for students in certain ways, but I never felt it really produced the kind of technical learning that I aimed to facilitate. Apart from the cost of the software, the fact that Flash was a closed proprietary system did not assist the students with learning from other programmers’ code. The visual interface also meant many code-shy students were able to avoid really engaging with scripting, and the distributed code could be extremely confusing. Finally, the programme is built for industry workflows, and thus also assumes that the user is a skilled scripter who is familiar with concepts such as object orientation. Last year, with the assistance of Lyndon Daniels, who put together some open content learning materials I ditched Flash and shifted the curriculum to the Processing language.

Robot mini game by Paige Aupiais
Robot mini game by Paige Aupiais

This alien game by Paige Aupiais is an example of the kind of mini game which students are able to develop after four weeks (16 hours) of classes in Processing. While it is not a playable game just yet, it does show how Processing makes it possible to master basic concepts such as variables and operators, functions, controlling program flow with loops and conditional statements, and even objects and classes  (You’ll need to have Java installed on your machine if you want to try out Paige’s game.)

So where did this wonderful little language and ecosystem originate?  Processing is a language that was developed by Ben Fry and Casy Reas, initially as part of an award-winning project intended to introduce programming to visually trained artists and designers.

Processing works as a kind of wrapper for the Java language  which simplifies students’ first experience of programming and also makes it (relatively) easy to program visual output. This makes it an excellent introduction to programming for artists and designers since it immediately gives complete novices the ability to generate graphical effects and interactions. (In Processing, Hello World is a one-line sketch which draws a shape such as a line, ellipse, or rectangle.) Unlike other beginner environments though, when the training wheels are ready to come off, students have access to the massive resource of libraries developed for the Java language, such as for example the OpenGL libraries, and to the physical computing possible with the Arduino micro-processor.

Another key advantage is the active and helpful community centred around the site, the detailed reference materials, demos, and downloads. This community is particularly helpful to beginner programmers because many other users are novices who are likely to be asking beginner questions.

Basic programming concepts do not change very much between languages and so the course provides a foundation of ‘procedural literacy’ for keen students who want to launch into an exploration of other languages or of scripting in object-oriented languages.

The Return of Pacman by Robin Combrink
The Return of Pacman by Robin Combrink

That said, Processing has several disadvantages in comparison to Adobe’s Flash, another environment where non-technical beginners often first dip their toes in the water as scripters. The absence of a visual interface or timeline for Processing means it is more suitable for producing procedural images than for conventional drawing or animation workflows. Another is the disappointments and difficulties associated with publishing Processing sketches. The need for a Java plugin (less common than the Flash player), the slow loading times and relatively processor-intensive Java applets are all additional hurdles for beginners and their users.

Here the Processing.js project (a sister project to is a response to the widespread support for Javascript by most browsers. Processing.js conforms to web standards, and is immediately viewable in modern browsers without the need to install any plugins. The example above is a mini game created by my son Robin (twelve). He has recently taken an interest in programming (mostly by looking over my shoulder as I prepare for class) and wrote this little game. I published it for him as a Processing.js sketch, using the HTML5 canvas element.

Source code: here

Built with Processing


Leave a Reply

Your email address will not be published. Required fields are marked *