Recitation 5: Processing Basics

The picture I chose:

The reason why I choose this picture is I think it is very beautiful, I take it in Changzhou, and it reminds me of the good memory I have in Hangzhou. Besides, it is a photo, so I need to simplify it and make it become abstract if I want to draw it in processing. Thus, I can add my thoughts and creativity to that photo.

I want to use some rectangles to draw the changing sky and I want to use some triangles to draw the mountains and the election of the mountains in the lake. Also, I want to use a circle as the sun. I search for processing’s references online, learned how to draw the shape, and then use processing to draw.

My sketch in paper:

The difference between the sketch on paper and the final sketch is that I want to draw the wave of the lake at the beginning but I find it very difficult to draw so many waves in different shapes, so I give up and add a reflection of the mountains to enrich the content of the image. The difference between the photo I chose and the final sketch is that I reduced a lot of elements and I give up drawing the cloud and pagoda since it is too difficult and I can’t draw a very nice shape by using processing. But the subject and atmosphere of these two images are still the same. I think drawing in Processing is a good means of realizing your design. Because it is easy for me to select the color, and this app will make me consider how can I simplify my drawing, it will help me to make my design abstract, I think it is a kind of style.

My code:

void setup() {
size(600, 600);
}
void draw() {
// Your drawing code goes here
background(255);
fill(#9AB3BC);
noStroke();
rect(0, 300, 600, 300);

fill(#D3DEE3);
noStroke();
rect(0, 0, 600, 75);

fill(#CEC5D8);
noStroke();
rect(0, 225, 600, 75);

fill(#F5C3AB);
noStroke();
rect(0, 150, 600, 75);

fill(#D9E3CE);
noStroke();
rect(0, 75, 600, 75);

fill(#003062);
noStroke();
triangle(0, 300, 60, 250, 120, 300);

fill(#003062);
noStroke();
triangle(50, 300, 200, 170, 350, 300);

fill(#003062);
noStroke();
triangle(350, 300, 410, 250, 470, 300);

fill(#003062);
noStroke();
triangle(410, 300, 505, 225, 600, 300);

fill(#E31017);
noStroke();
ellipse(350, 210, 100, 100);

fill(#6269B7);
noStroke();
triangle(0, 300, 175, 350, 350, 300);

fill(#6269B7);
noStroke();
triangle(350, 300, 410, 325, 470, 300);

fill(#6269B7);
noStroke();
triangle(410, 300, 505, 325, 600, 300);

}

My final sketch: