Würfel-Unordnung (Cubic Disarray) Sketch Using Processing (IDD631)

This week, we reviewed what we had learned the past week and twist more algorithm to create unrepeatable color and noise on the canvas. Then we observed more abstract artworks and identified patterns and ways we could create them in Processing 3. Finally, we picked Georg Nees’s artwork called: Würfel-Unordnung or known as Cubic Disarray as our in-class workshop.

Georg Nees, Würfel-Unordnung

The hardest part was to push/popMatrix and map a location and direction to rotate. It’s really confusing because it’s a specific JAVA function that we had to dig deep into the Processing references. Eventually, we came up with a beautiful result of Cubic Disarray as image below:

Recreated by Processing, nice but it can be more

As usual, it’s not good enough. So, I continued working on the code, also changed and added more parameters. As the result. I increased a margin space of the artwork by indicating frame parameters and put it in the top-center of the canvas. Then, I played with color by filling green in each square and increase a green value as the squares started to rotate.

Here is my code:

void setup() {
size(400, 650);
int numAcross = 12;
int numDown = 24;
// Limit the frame to display rectangles
float frameWidth = 300;
float frameHeight = 600;
// set the initial color value
int colorShadeR = 255;
int colorShadeG = 255;
int colorShadeB = 255;
float sideWidth = frameWidth/numAcross;
for (int j=0; j<numDown; j++)
// decrease Red and Blue to display more Green color
for(int i=0; i<numAcross; i++)
float x = i*sideWidth+((width-frameWidth)/2); //draw at the center
float y = j*sideWidth;
float deg = map(y,0,frameHeight,0,45);
float direction = random(-1,1); // random direction of a square
direction = -1;
}else direction = 1;
//random position
float vertPos = map(y,0,frameHeight,0,sideWidth);
Like what you read? Give Pawan a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.