dnam-Project02-Variable-Face

dnam-Project-02-Variable-Face

// Doo Won Nam
// 15-104 :: 1 Section B
// dnam@andrew.cmu.edu
// Project-02-Variable-Face

var faceWidth = 258
var faceHeight = 216
var eyebrowWidth = 78
var eyebrowHeight = 13
var maskHeight = 63
var mouthHeight = 24
var eyeWidth = 43
var eyeHeight = 30
var noseWeight = 18
var noseHeight = 74
var toothWidth = 19
var toothHeight = 14
var x = 640;
var dir = 1;
var speed = 10;

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

function draw() {
  background(200, 147, 188);
  noStroke();
//hat
  fill(142, 79, 46);
  rect(144, 111, 362, 43);
  ellipse(325, 95, 340, 80);
//face
  fill(209, 158, 131);
  rect(190, 155, faceWidth, faceHeight);
  fill(248, 173, 133);
  rect(200, 155, faceWidth - 20, faceHeight - 10);
//eyebrows left then right
  fill("black");
  rect(209, 153, eyebrowWidth, eyebrowHeight);
  rect(335, 153, eyebrowWidth, eyebrowHeight);
//mask
  fill(95, 83, 76);
  rect(190, 166, faceWidth, maskHeight);
//mouth
  fill(185, 79, 79);
  rect(270, 318, 130, mouthHeight);
  ellipse(335, 317, 130, 24);
//teeth
  fill("white");
  rect(300, 305, toothWidth, toothHeight);

  rect(330, 305, toothWidth, toothHeight);
//left eye
  fill("white");
  ellipse(248, 190, eyeWidth, eyeHeight);
  fill("black");
  ellipse(245, 190, eyeWidth - 24, eyeHeight - 12);
  fill("white");
  ellipse(240, 185, eyeWidth - 30, eyeHeight - 20);
//right eye
  fill("white");
  ellipse(366, 197, eyeWidth * 1.5, eyeHeight * 1.5);
  fill(0);
  ellipse(363, 197, eyeWidth * 1.5 - 32, eyeHeight * 1.5 - 20);
  fill("white");
  ellipse(358, 192, eyeWidth * 1.5 - 45, eyeHeight * 1.5 - 30);
//nose
  fill(209, 158, 131);
  rect(285, 212, noseWeight, noseHeight);
  ellipse(284, 276, noseWeight + 2, noseHeight - 54);

}
//random change in width/height everytime mouse is pressed
function mousePressed() {
      eyebrowWidth = random(50, 78);
      eyebrowHeight = random(1, 30);
      maskHeight = random(20, 80);
      mouthHeight = random(24, 50);
      eyeWidth = random(23, 63);
      eyeHeight = random(20, 40);
      noseWeight = random(9, 21);
      noseHeight = random(50, 90);
      toothWidth = random(15, 24);
      toothHeight = random(10, 20);
}

Basing the face on classic cartoon image of a thief (with the line mask) and toast, I wanted to use the mousePress function to make it almost seem like the thief is surprised after being caught by the police. Using variables to make the placements and size of the facial parts easier, I was able to produce an efficient code for a interactive face.