Images

My approach to this project was to capture my features into a mini cartoon character. Although I tried my best to translate my face features into this portrait, my picture turned out looking pretty different from my appearance in reality, especially my hair. Despite this outcome, this was a good learning experience on how to draw geometric shapes on p5.js.

face

//Sarah Kang
//Section C
//sarahk1@andrew.cmu.edu
//assignment-01
var line;
function setup() {
	createCanvas(600, 600);
}
function draw() {
	background(255, 204, 100);
	

	strokeWeight(2.5);
	stroke(0, 0, 255);
	for(var offset =0; offset<600; offset +=20){
		line(offset, 0, offset, height);
	}
	//bangs
	noStroke();
	fill(0);
	rect(185, 315, 230, 180);
	//face + neck
	noStroke();
	fill(238, 212, 194);
	ellipse(300, 300, 196, 264);
	ellipse(300, 450, 40, 150);
	//ears
	ellipse(392, 355, 30, 30);
	ellipse(208, 355, 30, 30);
	
	//shirt
	fill(245, 102, 91);
	ellipse(300, 600, 170, 260);
	//hair in back
	fill(0);
	arc(300, 240, 230, 185, PI, 0, OPEN);
	rect(185, 240, 230, 75);
	//eyes
	ellipse(255, 350, 15, 7);
	ellipse(345, 350, 15, 7);
	//eyebrows
	stroke(0);
	noFill();
	arc(255, 340, 30, 10, PI, 0, OPEN);
	arc(345, 340, 30, 10, PI, 0, OPEN);
	//mouth
	stroke(245, 102, 91);
	noFill();
	arc(300, 400, 20, 7, 0, PI, OPEN);
	//earrings
	stroke(360);
	ellipse(392, 375, 14, 20);
	ellipse(208, 375, 14, 20);
}