Miranda-Project-02-Variable-Face

sketch

/* Miranda Luong
Section E
mluong@andrew.cmu.edu
Project-02-Variable-Face
*/

var eyePupil = 25;
var faceWidth = 200;
var faceHeight = 200;
var eyeX = 5
var eyeY = 5
var bodyColor = 80;
var mouthHeight = 10;
 
function setup() {
    createCanvas(300, 300);

}

function draw() {
    background(156, 190, 215);
    //hair
    fill(bodyColor, 150, 231)
    rect(width/3, height/3 + 100, 100, 100);
    //head
    strokeWeight(5);
    fill(252,221,201);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);
    var eyeLX = width / 2 - faceWidth * 0.25;
    var eyeRX = width / 2 + faceWidth * 0.25;
    //eyes
    strokeWeight(1.5);
    fill(255);
    ellipse(eyeLX, height / 2, faceWidth/2,faceWidth/2);
    ellipse(eyeRX, height / 2, faceWidth/2,faceWidth/2);
    //eyeIris
    strokeWeight(0);
    fill(223,108,107);
    ellipse(eyeLX+eyeX,height/2+eyeY,eyePupil,eyePupil);
    ellipse(eyeRX+eyeX,height/2+eyeY,eyePupil,eyePupil);
    //eyePupil
    fill(0);
    ellipse(eyeLX+eyeX,height/2+eyeY,eyePupil/2,eyePupil/2);
    ellipse(eyeRX+eyeX,height/2+eyeY,eyePupil/2,eyePupil/2);
    //eyeReflection
    fill(255);
    ellipse(eyeLX+eyeX+1,height/2+eyeY,eyePupil/5,eyePupil/5);
    ellipse(eyeRX+eyeX+1,height/2+eyeY,eyePupil/5,eyePupil/5);
    //mouth
    strokeWeight(1.5);
    fill(255)
    ellipse(width/2+faceWidth/4 - 20, height/2+faceHeight/4 + 5, 30, mouthHeight);

}
 
function mousePressed() {
    // when the user clicks, these variables are reassigned
    // to random values within specified ranges. For example,
    // 'faceWidth' gets a random value between 75 and 110.
    faceWidth = random(75, 110);
    faceHeight = random(100, 200);
    eyeX = random(-9,9);
    eyeY = random(-9,9);
    bodyColor = random(150, 250);
    mouthHeight = random(10,30)




}

It was fun to make animated faces. I found it to be a lighthearted exercise that helped in practicing coding using variables.

Leave a Reply