Processing
For one of my assignments in my Research in Cartography class, I was asked to replicate an image using a programming language called Processing. The first image shown below is the original image, and the second is the replica I created with processing. I have also created a remixed version of this image.
This is my code for my image below:
//Assignment 2 Processing: Replicate the Image //Annie Fang size(490, 670); //222 219 204 background(222, 219, 204); //circle black fill fill(0, 0, 0); ellipse(183, 332, 216, 216); //large quad, no stroke, 50 percent transparency fill noStroke(); fill(0, 0, 0, 50); quad(218, 98, 160, 156, 340, 334, 456, 334); //x is an integer equal to 237 int x = 237; //y is an integer equal to 212 int y = 212; //medium shadow quad, 75 fill fill(0, 0, 0, 75); quad(171, 146, 171, 166, 237, 232, x, y); //light shadow quad, background opaque fill fill(222, 219, 204); quad(171, 146, x, y, 257, 212, 191, 146); //black square fill(0, 0, 0); rect(x, y, 20, 20); //add stroke stroke(0); //horizontal line strokeWeight(2); line(84, 233, 349, 233); //vertical line middle white no stroke noStroke(); fill(222, 219, 204); quad(339, 221, 339, 409, 341, 409, 341, 221); //add stroke stroke(0); //vertical line left strokeWeight(1); line(339, 221, 339, 409); //vertical line right strokeWeight(1); line(341, 221, 341, 409); //diangonal line line(82, 233, 322, 469); //small horizontal line bottom line(192, 469, 322, 469); //small horizontal line top line(192, 468, 321, 468); //small horizontal rectangle fill(0, 0, 0); rect(202, 471, 38, 5); //top small rectangle fill(0, 0, 0, 100); noStroke(); rect(217, 445, 8, 23); //small bottom rectangle rect(217, 477, 8, 13); //save image save("assignment2part1.png");
For the second part of the assignment, I created a remix of the original image to further develop my programming skills.
The code for my remixed image can be found below:
//Assignment 2 Processing: Remix the Image //Annie Fang size(490, 670); //222 219 204 background(250, 250, 250); //large quad noStroke(); fill(0, 0, 0); quad(218, 98, 160, 156, 340, 334, 456, 334); //triangle beginShape(TRIANGLES); fill(255, 255, 255, 100); vertex(341, 219); vertex(341, 334); vertex(456, 334); endShape(); //thin triangle beginShape(TRIANGLES); fill(255, 255, 255); vertex(82, 233); vertex(198, 469); vertex(322, 469); endShape(); //x is an integer equal to 237 int x = 237; //y is an integer equal to 212 int y = 212; //square fill(255, 0, 0, 100); rect(x, y, 20, 20); fill(255, 98, 0, 100); rect(232, 207, 20, 20); fill(255, 188, 0, 100); rect(227, 202, 20, 20); fill(255, 247, 0, 100); rect(222, 197, 20, 20); fill(178, 255, 0, 100); rect(217, 192, 20, 20); fill(0, 255, 27, 100); rect(212, 187, 20, 20); fill(0, 255, 142, 100); rect(207, 182, 20, 20); fill(0, 255, 189, 100); rect(202, 177, 20, 20); fill(0, 255, 255, 100); rect(197, 172, 20, 20); fill(0, 202, 255, 100); rect(192, 167, 20, 20); fill(0, 138, 255, 100); rect(187, 162, 20, 20); fill(0, 0, 255, 100); rect(182, 157, 20, 20); fill(109, 0, 255, 100); rect(177, 152, 20, 20); fill(195, 0, 255, 100); rect(171, 146, 20, 20); //medium shadow quad, 75 fill fill(0, 0, 0, 100); quad(171, 146, 171, 166, 237, 232, x, y); //light shadow quad, background fill fill(229, 229, 229, 100); quad(171, 146, x, y, 257, 212, 191, 146); //add stroke stroke(0); //horizontal line strokeWeight(1); line(84, 233, 300, 233); //vertical line middle white no stroke noStroke(); fill(222, 219, 204); quad(339, 221, 339, 409, 341, 409, 341, 221); //add stroke stroke(0); //vertical line left strokeWeight(1); line(339, 221, 339, 409); //vertical line right strokeWeight(1); line(341, 221, 341, 409); //diangonal line line(82, 233, 322, 469); line(82, 233, 318, 469); line(82, 233, 310, 469); line(82, 233, 294, 469); line(82, 233, 262, 469); line(82, 233, 198, 469); //colored thin triangles beginShape(TRIANGLES); fill(179, 41, 255, 150); vertex(82, 233); vertex(198, 469); vertex(262, 469); endShape(); beginShape(TRIANGLES); fill(41, 160, 255, 150); vertex(82, 233); vertex(262, 469); vertex(294, 469); endShape(); beginShape(TRIANGLES); fill(30, 245, 214, 150); vertex(82, 233); vertex(294, 469); vertex(310, 469); endShape(); beginShape(TRIANGLES); fill(30, 245, 214, 50); vertex(82, 233); vertex(310, 469); vertex(318, 469); endShape(); //small horizontal line bottom line(198, 469, 322, 469); //small horizontal rectangle fill(0, 0, 0); rect(202, 471, 38, 5); //top small rectangle fill(0, 0, 0, 100); noStroke(); rect(217, 445, 8, 23); //small bottom rectangle rect(217, 477, 8, 13); //circle light blue fill fill(2, 211, 216, 50); noStroke(); ellipse(183, 332, 185, 185); fill(2, 211, 216, 50); noStroke(); ellipse(183, 332, 175, 175); fill(2, 211, 216, 50); noStroke(); ellipse(183, 332, 165, 165); fill(2, 211, 216, 50); noStroke(); ellipse(183, 332, 155, 155); fill(2, 211, 216, 50); noStroke(); ellipse(183, 332, 145, 145); fill(2, 211, 216, 50); noStroke(); ellipse(183, 332, 135, 135); fill(2, 211, 216, 50); noStroke(); ellipse(183, 332, 125, 125); fill(2, 211, 216, 100); noStroke(); ellipse(183, 332, 115, 115); fill(2, 211, 216, 100); noStroke(); ellipse(183, 332, 105, 105); fill(2, 211, 216, 100); noStroke(); ellipse(183, 332, 95, 95); fill(2, 211, 216, 100); noStroke(); ellipse(183, 332, 85, 85); fill(2, 211, 216, 100); noStroke(); ellipse(183, 332, 75, 75); fill(2, 211, 216); noStroke(); ellipse(183, 332, 55, 55); //save image save("assignment2part2.png");