Concept

In this assignment, I initially created a work where random faces of different sizes and colors are displayed, as shown below.

However, after watching Casey Reas’ talk in Eyeo 2012, I challenged myself to mimic his style of digital artwork by using more simple objects to give somewhat abstract feeling to my audience.

So, I made a rotating square with circles of random coordinates. I wanted to create four different squares to rotate synchronously to make the four squares to form one large rotating square.

Demo

 

Code Highlight

let angle = 0;
let speed = 0.01;
let centerX = 200; 
let centerY = 200;  
...
//move the center of grid to (0,0) and top-left to (-200,-200) with top-right of (200,200)
  translate(centerX, centerY);
  rotate(angle); // Rotate the entire canvas
  angle += speed;

I am most proud of moving the center of grid to (0,0) to make it easier to code as I always found it hard to understand x- and y- coordinates system of p5.js. In addition, I made the objects rotate continuously for better visual aesthetics.

Reflection and Possible Improvements

I wanted to create an art as a result of some random values or outcomes of the code. Even though the circles have random coordinates, I initially wanted to create an entire artwork to be of a random result: to display a different outcome after each run. However, I could not be creative enough to make such imagination come true.

Moreover, my work would be more visually aesthetic if there are more shapes or colors; maybe, I could have made the shapes and colors to be randomly generated.