Project-02-Variable-Face

sketch

var eyeSize = 50;
var faceWidth = 300;
var faceHeight = 300;
var mouthSize=20;
var State= 0;

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

function draw() {
    background(180);
    fill (255,160,122);
    ellipse(width/2, height/2, faceWidth,  faceHeight);// face
    var eyeLX = width / 2 - faceWidth * 0.25;// x position of left eye
    var eyeRX = width / 2 + faceWidth * 0.25;// x position of right eye
    fill(255,255,255);
    ellipse(eyeLX, height / 2, eyeSize, eyeSize);//left eye
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);//right eye
    fill(0,0,0);
    ellipse(eyeLX, height / 2, eyeSize/3, eyeSize/3);//left pupil
    ellipse(eyeRX, height / 2, eyeSize/3, eyeSize/3);//right pupil
    fill(255,0,0);
    var mouthX =width/2;
    var mouthY =height/2+0.25*faceHeight;
    ellipse(mouthX, mouthY, mouthSize, mouthSize);//mouth
    fill(139,69,19);
}

function mousePressed() {
State= int(random(1,4))
   if (State == 1) {
faceWidth= 200;
faceHeight= 400;
eyeSize= 70;
mouthSize=40;
mouthY=height/2+0.5*faceHeight;// surprise face
} else if (State == 2) {
faceWidth= 325;
faceHeight= 275;
eyeSize=30
mouthSize=10;//relaxed face 
} else {
faceWidth= 300;
faceHeight= 300;
eyeSize=50;
mouthSize=20// normal face
}
}

When I was designing the project, I was thinking about different states of facial expression and trying to show them in the product.

Leave a Reply