Joseph Zhang – Project – 01

Project 01 – Self Portrait

//https://p5js.org/reference/

// setup() runs once
// every program should have program setup
function setup(){
	createCanvas(600,600);
	background('#D1C3BA');
	noStroke();

	//black hair
	fill('#191919');
		ellipse(300,274,218.6,288);
		translate(291.6,161.5);
		rotate(-6.1);
		ellipse(0,0,138.9,74.1);
		rotate(6.1);
		translate(-291.6,-161.5);

	//ears + neck
	fill('#C69B7B');
		ellipse(195,312,34,58);
		ellipse(404,312,34,58);
		rect(243,397,114,142);

	//face + facial features
	fill('#E0BA99');
		ellipse(300,307,208,274);
		rect(196,312,208,91);
		triangle(196, 404, 300, 467, 404, 404);
		rect(300,371.5,80,27);
	
	//nose + mouth
	fill('#C69B7B');
		triangle(284, 350, 300, 322.6, 316, 350);
		rect(284,344,32,12);
		ellipse(300,385,80,46);

	//upper mouth
	fill('#E0BA99');
		rect(260,358,80,27);

	//eyes and body
	fill('#191919');
		ellipse(247,299,22,22);
		ellipse(353,299,22,22);
		ellipse(300,644,360,274);

	// ears
	fill('#DDDDDD');
	ellipse(186,332,8,8);
	ellipse(414,332,8,8);
}

Besides understanding the functions available with using p5.js, one of the biggest takeaways I received was understanding the importance of sequencing code properly. Certain lines of code would mess the entire visual composition of the portrait if not put in the right place. I realized that much of the learning process came from working, crashing, revising, and rebuilding.

Leave a Reply