Project-02-Face

sketch

//Jihoon Park
//Section A
//jihoonp@andrew.cmu.edu
//Project-02

var hairSpike = 100;
var skinColorR = 194;
var skinColorG = 141;
var cheekBone = 480;
var chinLength = 420;
var noseLength = 150;
var eyeX = 20;
var eyeY = 20;
var smileFactor = 350;


function setup() {
	createCanvas(640, 480);	
}

function draw() {
	background(165, 170, 247);
	//creates blue background
//HAIR
    noStroke();
    fill("yellow");
    beginShape();
    curveVertex(200, 200);
    curveVertex(200, 200);
    curveVertex(hairSpike, 50);
    curveVertex(200, 70);
    curveVertex(hairSpike+170, 10);
    curveVertex(305, 40);
    curveVertex(hairSpike+240, 5);
    curveVertex(350, 70);
    curveVertex(hairSpike+430, 30);
    curveVertex(500, 80);
    curveVertex(hairSpike+530, 140);
    curveVertex(200, 200);
    curveVertex(200, 200);
    endShape(CLOSE);
    //defines protruding points of hair

//bust
	noStroke();
	fill(200, 110, 40);
	beginShape();
	curveVertex(80, 480);
	curveVertex(80, 480);
	curveVertex(110, 410);
	curveVertex(300, 380);
	curveVertex(410, 410);
	curveVertex(550, 480);
	endShape(CLOSE);
	//draws bust

//FACE
	noStroke();
	fill(skinColorR, skinColorG, 159); 
	//defines skin color with a set blue value
	
	beginShape();
	curveVertex(240, 150);
	curveVertex(240, 150);
	curveVertex(300, 50);
	curveVertex(360, 100);
	curveVertex(cheekBone, 200);
	curveVertex(400, 300);
	curveVertex(300, chinLength); //defines lower end point of chin
	curveVertex(240, 380);
	curveVertex(noseLength, 200); //defines nose length
	curveVertex(240, 150);
	curveVertex(240, 150);
	endShape();
	//draws facial contour

	stroke(skinColorR/2, skinColorG/2, 159);
	strokeWeight(4);
	beginShape();
	curveVertex(240, 380);
	curveVertex(240, 380);
	curveVertex(noseLength, 200);
	curveVertex(300, 90);
	curveVertex(300, 90);
	endShape();
	//draws line around the nose

//EYES
	noStroke();
	fill(255);
	ellipse(300-(eyeX/2), 90, eyeX, eyeY);
	ellipse(300+(eyeX/2), 90, eyeX, eyeY);
	fill(0)
	ellipse(300-(eyeX/2), 90, 10, 10);
	ellipse(300+(eyeX/2), 90, 10, 10);
	//defines the size of eyes

//MOUTH
    stroke(255, 180, 0);
    fill(255, 100, 0);
    triangle(230, 300, smileFactor, 350, 310, smileFactor);
    //defines two poins of triangular mouth	
}

function mousePressed() {
	hairSpike = random(50, 150);
	skinColorR = random(0, 255);
	skinColorG = random(0, 255);
	cheekBone = random(400, 500);
	chinLength = random(400, 460);
	noseLength = random(70, 200);
	eyeX = random(10, 60);
	eyeY = random(10, 40);
	smileFactor = random(270, 380);
}

For this project, I tried to practice as much freedom I can with making the portrait. Compared to the first project, I now had a grasp of what JavaScript could manage to do, and expressed it with the random features of the “Ever-changing man”