Self Portrait

```
/* Samantha Ho
Section E
sch1@andrew.cmu.edu
Assignment-01*/
function setup() {
createCanvas(800, 600);
background(220, 255, 254);
/*hair shadow*/
fill(81, 54, 54);
noStroke();
ellipse(380, 260, 190, 200);
fill(81, 54, 54);
noStroke();
ellipse(366, 244, 190, 200);
fill(81, 54, 54);
noStroke();
ellipse(398, 370, 190, 400);
/*chest*/
fill(245, 184, 161);
noStroke();
beginShape();
vertex(200, 400);
vertex(540, 400);
vertex(430, 600);
vertex(300, 600);
endShape(CLOSE);
fill(245, 184, 161);
noStroke();
beginShape();
vertex(345, 300);
vertex(408, 300);
vertex(430, 600);
vertex(300, 600);
endShape(CLOSE);
/*right shirt*/
fill(220, 0, 0);
noStroke();
beginShape();
vertex(420, 360);
vertex(540, 400);
vertex(430, 600);
vertex(300, 600);
endShape(CLOSE);
/*left shirt*/
fill(250, 0, 0);
noStroke();
beginShape();
vertex(330, 360);
vertex(200, 400);
vertex(280, 600);
vertex(400, 600);
endShape(CLOSE);
/*chin shadow*/
fill(208, 131, 99);
noStroke();
ellipse(370, 300, 100, 160);
/*head shadow*/
fill(208, 131, 99);
noStroke();
ellipse(366, 260, 180, 200);
/*head*/
fill(247, 194, 171);
noStroke();
ellipse(366, 260, 160, 200);
/*hair*/
fill(81, 54, 54);
noStroke();
arc(366, 200, 160, 80, PI, PI + PI, OPEN);
arc(386, 200, 140, 230, 0, QUARTER_PI);
/*lips*/
fill(234, 163, 169);
ellipse(364, 330, 10, 10);
ellipse(370, 330, 10, 10);
/*right hand top*/
fill(247, 194, 171);
noStroke();
beginShape();
vertex(450, 244);
vertex(460, 240);
vertex(480, 280);
vertex(460, 280);
endShape(CLOSE);
/*left hand top*/
fill(247, 194, 171);
noStroke();
beginShape();
vertex(280, 244);
vertex(270, 240);
vertex(250, 280);
vertex(270, 280);
endShape(CLOSE);
/*right hand bottom*/
fill(247, 194, 171);
noStroke();
beginShape();
vertex(430, 344);
vertex(466, 380);
vertex(480, 280);
vertex(460, 280);
endShape(CLOSE);
/*left hand bottom*/
fill(247, 194, 171);
noStroke();
beginShape();
vertex(316, 350);
vertex(270, 350);
vertex(250, 280);
vertex(270, 280);
endShape(CLOSE);
/*right arm*/
fill(250, 0, 0);
noStroke();
beginShape();
vertex(430, 356);
vertex(480, 340);
vertex(540, 580);
vertex(460, 580);
endShape(CLOSE);
/*left arm*/
fill(220, 0, 0);
noStroke();
beginShape();
vertex(320, 350);
vertex(260, 340);
vertex(220, 580);
vertex(300, 580);
endShape(CLOSE);
/*right sunglasses*/
fill(210, 252, 255);
noStroke();
beginShape();
vertex(384, 290);
vertex(380, 260);
vertex(450, 250);
vertex(440, 286);
endShape(CLOSE);
/* left sunglasses*/
colorMode(RGB, 210, 252, 255, 4);
noStroke();
beginShape();
vertex(354, 290);
vertex(356, 260);
vertex(280, 250);
vertex(292, 286);
endShape(CLOSE);
/*glasses bridge*/
fill(210, 252, 255);
noStroke(0);
rect(344, 266, 50, 2);
}
function draw() {
}
```

I had alot of fun with this assignment and enjoyed how satisfying it was to see each shape come together. I ended up using alot of quadrilaterals to make certain shapes and found it rather challenging to orient myself. Addditionally, I tried to add a css animation in the background for no reason other than me thinking it would look cool; However, after a significant amount of troubleshooting I had to relent. I couldn’t quite get the css to move behind the javascript so I’m excited to revisit this problem in the future.