/*Jessica Nip
Section A
jknip@andrew.cmu.edu
Project-02 */
var eyeSize = 20;
var cheekSize = 20;
var faceWidth = 120;
var faceHeight = 150;
var et = 15;
var value = 150;
var faceR = 179;
var faceG = 229;
var faceB = 178;
var cheekR = 235;
var cheekG = 189;
var cheekB = 176;
function setup() {
createCanvas(640, 480);
}
function draw() {
background(value);
var b = color(179,229,178);
fill(256);
noStroke();
ellipse(width / 2, height / 2, faceWidth, faceHeight);
fill(faceR, faceG, faceB);
ellipse(width / 2+3, height / 2+3, faceWidth, faceHeight);
fill(b);
ellipse(360,119,et,et*1.1);
var eyeLX = width / 2 - faceWidth * 0.25;
var eyeRX = width / 2 + faceWidth * 0.25;
var c = color(0);
fill(c);
ellipse(eyeLX, height / 2.1, eyeSize, eyeSize*2);
ellipse(eyeRX, height / 2.1, eyeSize, eyeSize*2);
fill(cheekR,cheekG,cheekB);
ellipse(eyeLX, height / 1.85, cheekSize/2, cheekSize/3); //cheeks
ellipse(eyeRX, height / 1.85, cheekSize/2, cheekSize/3);
var green = color(1,146,79);
noFill();
stroke(b);
beginShape();
curveVertex(374,191);
curveVertex(358,119);
curveVertex(311,117);
curveVertex(322,200);
curveVertex(322,200);
endShape();
fill(green);
noStroke();
ellipse(315, height/1.85, eyeSize/5, eyeSize/5); //nostrils
ellipse(325, height/1.85, eyeSize/5, eyeSize/5);
}
function mouseMoved() {
value = value +5;
if (value>255) {
value = 0;
}
}
function mousePressed() {
faceWidth = random(80, 150);
faceHeight = random(80, 150);
et =random(5,40);
eyeSize = random(10, 25);
cheekSize = random(15,30);
faceR = random(180,250);
faceG = random(150,250);
faceB = random(130,200);
cheekR = random(120,150);
cheekG = random(100,120);
cheekB = random(100,130);
}
I wanted to create an interactive alien face that utilizes different pops of pastel for its face and cheek. I found that when setting different scales for the ellipses, they easily formed interesting facial compositions.