Idea:
Bauhaus School of Arts-Biconjugate
https://www.guggenheim.org/artwork/164
Plan:
Using basic shapes in the Processing to create the image.
As you can see in the original image, the shapes are not simply rectangles, instead, many of them are parallelograms.
Act it out:
Then, I started to search on the website about basic shapes in Processing besides the ones that we have learned in lectures, triangles, rectangles, ellipses, etc. I found there was one function called “quad()”, which can be used to draw any quadrilateral, and I thought this would be the best fit for my project.
I wrote on one piece of paper and calculated every position of the points that I needed. And I used a combination of triangles and quadrilaterals to create the image.
However, I found out there was some misalignment in the shapes that the computer drew. I think the main problem may stem from the inaccuracy of my calculations or the different modes that the computer is using.
Therefore, later on, I chose to put an estimate in the coding part, then run the code and gradually adjust the index.
Finally, due to the time limitation, I was able to finish only part of them. Just as shown below.
Code:
size(900,500); smooth(); background(#f2e7d5); //triangle fill(#131419); rectMode(CENTER); rect(450,250,750,350); //grey quad fill(#4e504f); noStroke(); quad(75,125,200,75,200,370,75,425); quad(200,75,400,175,350,425,200,370); quad(400,175,700,75,550,370,350,425); triangle(550,370,700,75,700,425); quad(700,75,825,150,825,350,700,425); //need two sides + third quad fill(#aba8a1); quad(150,110,200,90,330,410,150,340); triangle(200,90,330,155,330,410); //fourth quad fill(#e4ddcd); quad(200,135,330,200,330,370,200,315); //fifth quad fill(#c8c4b9); quad(330,200,400,190,400,400,330,370);