JackieChou-project 01-face – [OLD FALL 2017] 15-104 • Introduction to Computing for Creative Practice

sketch 2

//Jackie Chou
//Section E
//jwchou@andrew.cmu.edu
//Project-01
function setup() {
    createCanvas(600, 585);
    background(251,220,13);
    text("p5.js vers 0.5.12 test.", 10, 15);
}

function draw() {
	

	//neck
	noStroke();
	fill(211,166,161);
	rect(255,400,90,100);

	//head
	fill(224,195,200);
	ellipse(300,300,200,240);

	//hat
	fill(60);
	arc(300,240,170,150,PI,0);
	fill(0);
	ellipse(300,160,20,20);

	//face shape
	fill(251,220,13);
	quad(200,300,250,430,200,400,200,300);
	quad(400,300,350,430,400,400,400,300);

	//ears
	fill(224,195,200);
	ellipse(210,290,50,60);
	ellipse(390,290,50,60);

	//mask
	fill(20);
	rect(210,255,179,65);

	//masksides
	arc(210,287,33,64,HALF_PI,PI+HALF_PI);
	arc(389,287,33,64,PI+HALF_PI,HALF_PI);

	//maskholes
	fill(211,166,161);
	ellipse(263,283,45,35);
	ellipse(343,283,45,35);

	//maskholes
	fill(224,195,200);
	ellipse(258,283,45,35);
	ellipse(338,283,45,35);

	//eyes
	fill(245);
	ellipse(259,281,30,15);
	ellipse(341,281,30,15);
	fill(3);
	ellipse(252,281,10,10);
	ellipse(334,281,10,10);

	//mouth2
	stroke(173,140,137);
	strokeWeight(5);
	line(270,370,330,370);

	//nose
	noStroke();
	fill(211,166,161);
	arc(300,337,30,10,0,PI);


	//nose
    noFill();
	strokeWeight(3);
	stroke(136,104,101);
	noStroke();
	beginShape();
	curveVertex(300,290);
	curveVertex(297,290);
	curveVertex(315,320);
	curveVertex(292,322);
	curveVertex(293,310);
	endShape();
	noStroke();

	//shirt
	fill(50);
	ellipse(300,584,370,270);
	noFill();
	beginShape();
	vertex(70,600);
	vertex(150,515);
	vertex(255,475);
	vertex(345,475);
	vertex(450,515);
	vertex(530,600);
	endShape(CLOSE);

	//shirt-stripes
	fill(210);
	rect(170,500,260,10);
	rect(145,530,300,10);
	rect(135,560,330,10);



}

Robber, 2017
Digital self portrait.
Javascript.

For this project, I went through multiple iterations and phases. The toughest part was learning first how to utilize the different commands to create the shapes I wanted to use. Also, I didn’t learn how to organize my code until late in the process, which made managing my code harder. However, I picked everything up fairly quickly.

I also experimented and iterated how I wanted to represent my nose and my mouth.

I first went from a generic self portrait: