hschung-Project-02

sketch

//Heidi Chung
//Section A
//hschung@andrew.cmu.edu
//Project-02: Variable Faces; Face Variables
var eyeWidth = 22;
var eyeHeight = 22;
var mouthSize = 40;

var cheekR = 234;
var cheekG = 175;
var cheekB = 152;
var cheekWidth = 60;
var cheekHeight = 60;

var hairR = 76;
var hairG = 54;
var hairB = 36;

var eyebrowWidth = 40;
var eyebrowHeight = 10;
//var leftBrowX = 253;
var BrowY = 210;
//var rightBrowX = 347;
var BrowY = 210;

function setup() {
	 createCanvas(640,480);
	 background(145, 193, 191);

	 noStroke();
	}

function draw() {
	 fill(hairR-30, hairG-30, hairB-50); //background hair //fill(31, 34, 13);
	 quad(200, 195,  400, 185,  425, 375,  180, 375);

	 fill(234, 178, 117); //neck
	 rect(263, 380, 78, 78);

	 fill(235, 207, 155); //face
	 ellipse(300, 260, 210, 260);

	 fill(200, 125, 95); //mouth
	 ellipse(600/2, 600/2 +10, 60, mouthSize);

	 fill(235, 207, 155);//eclipse over mouth
	 rect(600/2 -40, 600/2 -75, 70, 85);


	 fill(cheekR, cheekG, cheekB); //left blush //fill(234, 175, 152);
	 ellipse(235, 265, cheekWidth, cheekHeight); //ellipse(235, 265, 60, 60);

	 fill(cheekR, cheekG, cheekB); //right blush
	 ellipse(365, 265, cheekWidth, cheekHeight);

	  fill(61, 44, 23); //left eye
	 ellipse(250, 240, eyeWidth, eyeHeight);

	 fill(61, 44, 23); //right eye
	 ellipse(350, 240, eyeWidth, eyeHeight);

	 fill(hairR-20, hairG-10, hairB-20); //left eyebrow // ellipse(253, 210, 40, 10)
	 ellipse(253, BrowY, eyebrowWidth, eyebrowHeight); //ellipse(253, 210, width, height)

	  fill(hairR-20, hairG-10, hairB-20); //right eyebrow
	 ellipse(347, BrowY, eyebrowWidth, eyebrowHeight); //ellipse(347, 210, width, height)


	 fill(234, 178, 117); //nose
	 triangle(300, 267, 320, 290, 280, 290);

	 fill(hairR, hairG, hairB); //more hair// fill(76, 54, 36);
	 quad(222, 159,  345, 129,  420, 220,  391, 230);

	 fill(hairR, hairG, hairB); //more hair
	 quad(371, 398,  391, 228,  421, 219,  433, 340);

	 fill(hairR, hairG, hairB); //more hair
	 quad(215, 156,  183, 234,  206, 245,  247, 163);

	 fill(hairR, hairG, hairB); //more hair
	 quad(183, 234,  174, 345,  237, 400,  207, 244);

	 fill(hairR, hairG, hairB); // top part of hair
	 quad(216, 157,  275, 123,  377, 132,  420, 219);

	 fill(hairR, hairG, hairB);
	 triangle(183, 235,  207, 149,  275, 122);
	}
function mousePressed() {
	eyeWidth = random(20, 35);
	eyeHeight = random(15, 35);
	mouthSize = random(10, 85);
	cheekR = random(234, 274);
	cheekG = random(175, 195);
	cheekB = random(152, 172);
	hairR = random(50, 100);
	hairG = random(54, 80);
	hairB = random(36, 70);
	eyebrowWidth = random(35, 50);
	eyebrowHeight = random(10, 20);
	cheekWidth = random(50, 75);
	cheekHeight = random(50, 75);
	BrowY = random(210, 223);
	//leftBrowX = random (253, 263);
	//rightBrowX = random (347, 357);
	

}

I used my previous face from the self-portrait as a base. I did a sketch in Illustrator for that face to give me direction as I drew it in code.

It took me a couple times to get used to manipulating the different values as variables, but once I got the hang of a few variables, it was easier for me to think of other values to turn into variables. Rather than make completely different faces, I made my program create mildly different versions of my self portrait. If I changed the hair too, it’d be drastically different, but I like it this way.

Leave a Reply