To talk about images, we need a language to describe what we see or create. Graphic designers have developed a rich vocabulary with which they are able to analyse, discuss, develop and create images. Complex images are broken down into basic form, each expressing potential visual properties that can function on multiple semantic levels and with varying degrees of interpretation. For example, it is possible to observe and analyse objective properties of an image with regards to shape, size, colour, texture, position and orientation of its various components.

There are equally a set of ordering principles that can be applied in image making, that function not only as a means to structure a composition but can also be used to reinforce plausible semantics. We can observe concepts such as axis, symmetry, hierachy, repetition, ryhythm and transformations as well as Gestalt principles such as proximity, similarity, closure, area and continuity. Each of these guiding principles have a role to play in formalising relationships between shapes within a given space or surface. Understanding these finer details of image making in graphic design is an important part of the learning process for students.

Rudolf Arnheim. Art & Visual Perception. 1974

This website presents a collection of computer programs that serve to introduce visual concepts that can be observed in the practice of graphic design. These concepts took root at a time when graphic design was mainly a static media and had only just begun to encounter motion with the arrival of cinema and experimental film. Today, these concepts still hold their ground as guiding principles and yet the media has become a dynamic one in which both motion and interaction play an increasingly greater role for the graphic designer.

The aim here then is to attempt to introduce these principles using the medium of computation and to build on them through contemporary means of expression. It is hoped that an on-going collection of computational sketches can be developed which will take point, line and surface to include the basic unit of pixels and all that ensues from the dynamic possibilities of applying data and algorithms to image making.

This website is meant as a pedagogical tool for students. It is my wish that the contents will be of use in both learning about essential principles of visual language as well as computational language. All source code to programs are open source and can therefore be consulted, studied, modified and adapted as one wants. You are also welcome to propose sketches for the website. The only rules are to respect the format of 500px square and use only black and white. Please use the contact link below for this or any futher information.

The programs on this website are coded in P5js with source code for each. To extend the use of these I have also added source code for Processing. In addition to these two widely used frameworks, I'm extremely happy to announce that I am also integrating source code for OpenRNDR in close collaboration with RNDR Studio. OpenRNDR is an open source framework for creative coding, written in Kotlin for the Java VM that simplifies writing real-time interactive software. It began life as an in-house development tool at LUSTLab and was officially launched to the public in 2018.