Section E
I tried to play with adding makeup to the face when it was clicked, in order to add more color on the face. I also tried to play with beauty standards, and had the lips and eyebrows get fuller, as this is what many celebrities look like nowadays.
var boxWidth = 6
function setup() {
createCanvas(640, 480);
background(220);
text("p5.js vers 0.9.0 test.", 10, 15);
}
function draw() {
background(247,233,106,[255]);
fill(75,36,36,[255]); //hair
if (mouseY < width/2) { //hair grows
ellipse(width/2,height/2+50,230,400);
} else {
ellipse(width/2,height/2+170,260,700);
}
fill(212,179,135,[255]);
ellipse(width/2,height/2,180,250); //face
if (mouseIsPressed) //lipstick
fill(219,58,107,[100]);
if (mouseIsPressed) {
ellipse((width/2),(height/2+50),70,30); //lips
} else {
ellipse((width/2),(height/2+50),40,15);
}
if (mouseIsPressed) //blush
fill(255,204,204,[255]);
circle((width/2+40),(height/2),30);
circle((width/2-40),(height/2),30);
fill(0)
strokeWeight(3);
line((width/2-40),(height/2+50),(width/2+40),(height/2+50)); //mouth
fill(255); //eye whites
ellipse((width/2-30),(height/2-40),30,15);
ellipse((width/2+30),(height/2-40),30,15);
fill(75,32,32,[255]);
if (mouseX > width/2) { //pupils dilate
boxWidth=12;
} else {
boxWidth=6;
}
ellipse((width/2-30),(height/2-40),boxWidth,boxWidth); //eye right
ellipse((width/2+30),(height/2-40),boxWidth, boxWidth); //eye left
arc((width/2-30),(height/2-60),30,mouseY,PI,radians(360)); //eyebrow right arches
arc((width/2+30),(height/2-60),30,mouseY,PI,radians(360)); //eyebrow left arches
fill(164,135,106,[255]); //nose
strokeWeight(1);
triangle((width/2-15),(height/2+10),(width/2+15),(height/2+10),(width/2),(height/2-30));
fill(223,193,163,[255]);
strokeWeight(1);
rect((width/2-9),(height/2-30),18,35);
fill(0);
ellipse((width/2-5),(height/2+5),8,5); //nostrails
ellipse((width/2+5),(height/2+5),8,5); //nostrails
}