Here is my changing face! I think I struggled the most with deciding what nostril shape I wanted, as well as whether I wanted the eyebrows to be downturned (making them angry) or flat. I decided on flat, so that the face could smile.
sketch
// Amanda Wen Section C
var eyeSizeW = 50
var eyeSizeH = 70
var pupilSizeW = 20
var pupilSizeH = 30
var faceWidth = 180
var faceHeight = 150
var noseWidth = 5
var noseHeight = 3
var eyebrowWidth = 30
var eyebrowHeight = 10
var skinR = 60
var skinG = 137
var skinB = 97
var eyeR = 144
var eyeG = 185
var eyeB = 147
var pupilR = 34
var pupilG = 83
var pupilB = 75
var eyebrowR = 22
var eyebrowG = 59
var eyebrowB = 34
var noseR = 22
var noseG = 59
var noseB = 34
var mouthR = 186
var mouthG = 202
var mouthB = 181
function setup() {
createCanvas(640, 480);
background(255);
text("p5.js vers 0.9.0 test.", 10, 15);
}
function draw() {
background(58, 81, 78); // background color
noStroke();
// face
fill(skinR, skinG, skinB); // face color
ellipse(width / 2, height / 2, faceWidth, faceHeight); // face shape
// eyeballs
var eyeLX = width / 2 - faceWidth * 0.25;
var eyeRX = width / 2 + faceWidth * 0.25;
fill(eyeR, eyeG, eyeB); // eye color
ellipse(eyeLX, height / 2, eyeSizeW, eyeSizeH); // left eyeball
ellipse(eyeRX, height / 2, eyeSizeW, eyeSizeH); // right eyeball
// pupils
var pupilLX = width / 2 - faceWidth * 0.25;
var pupilRX = width / 2 + faceWidth * 0.25;
fill(pupilR, pupilG, pupilB); // pupil color
ellipse(pupilLX, height / 2, pupilSizeW, pupilSizeH); // left pupil
ellipse(pupilRX, height / 2, pupilSizeW, pupilSizeH); // right pupil
// eyebrows
var eyebrowLX = width / 2 - faceWidth * 0.35;
var eyebrowRX = width / 2 + faceWidth * 0.2;
fill(eyebrowR, eyebrowG, eyebrowB); // eyebrow color
rect(eyebrowLX, height / 2.5, eyebrowWidth, eyebrowHeight); // left eyebrow
rect(eyebrowRX, height / 2.5, eyebrowWidth, eyebrowHeight); // right eyebrow
// nostrils
var noseLX = width / 2 - faceWidth * 0.05;
var noseRX = width / 2 + faceWidth* 0.03;
fill(noseR, noseG, noseB); // nose color
rect(noseLX, height / 1.8, noseWidth, noseHeight) // left nostril
rect(noseRX, height / 1.8, noseWidth, noseHeight) // left nostril
// mouth
var mouth = width / 2 + faceWidth * 0.01;
fill(mouthR, mouthG, mouthB); // mouth color
arc(mouth, height * 0.6, 40, 20, radians(0), radians(180)); // mouth shape
}
function mousePressed() {
// face shape random
faceWidth = random(180, 150)
faceHeight = random(180, 150)
// eye shape random
eyeSizeW = random(50, 70);
eyeSizeH = random(50, 70);
// pupil shaperandom
pupilSizeH = random(20, 30);
pupilSizeW = random(20, 30);
// skin color random
skinR = random(180, 200);
skinG = random(180, 200);
skinB = random(180, 200);
// eye color random
eyeR = random(100, 160);
eyeG = random(100, 160);
eyeB = random(100, 160);
// pupil color random
pupilR = random(108, 90);
pupilG = random(108, 90);
pupilB = random(108, 90);
// eyebrow color random
eyebrowR = random(110, 103);
eyebrowG = random(110, 103);
eyebrowB = random(110, 103);
// nose color random
noseR = random(130, 200);
noseG = random(130, 200);
noseB = random(130, 200);
// mouth color
mouthR = random(120, 100);
mouthG = random(120, 100);
mouthB = random(120, 100);
}