Homework 02 – Art


My art piece is a collection of white lines and squares on a black background. The lines and squares move around erratically. It was inspired by the movement of molecules in real life: quick, erratic, random.

Code highlight

I’d like to highlight my draw function.

function draw() {
  background(0, 0, 0, 130);
  // Update movers and draw them.
  for (let mover of movers) {
    // Add a line to the end of the mover.
    // If the mover has more lines than allowed, remove the first line.
    if (mover.length > MOVER_LINE_COUNT) {

    // Draw all lines.
    for (let l of mover) {
      line(l[0], l[1], l[2], l[3]);
  // Update squares and draw them.
  for (let square of squares) {
    rect(square[0], square[1], square[2], square[2]);

Although the overall logic of my code is the most complex thing I’ve written so far in this course, the draw function, where everything actually happens, is very simple and straightforward. This is because I used functions (e.g. addLine, removeLine, moveSquare) to isolate unrelated, functional pieces of code.

The sketch

I’m fairly happy with the final sketch. I went for minimalism and an old school digital style, so I only used black and white colors. Potential additions can be more shapes, for example circles or triangles. Another interesting addition could be to implement a simple physics system, with collision detection. This way, one could make the shapes bounce off each other.

Leave a Reply