Ammar Hassonjee – Project 02 – Variable Face

Variable Face – Baby

/* Ammar Hassonjee
   Section C
   ahassonj@andrew.cmu.edu
   Project 02 - Generative Face
   */


//Declaring different variables of the face that will change when mouse is pressed

var earSize = 70;
var headWidth = 300;
var headHeight = 300;
var mouth1 = headHeight;
var mouth2 = 0
var mouth3 = 3.14;
var hairLength = 40;
var hairColor = 0;
var shirtColor = 250;
var eyeS = 50;
var tear = 'tan';

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

function draw() {
    background(200);
  // Creating the body
    noStroke();
    fill(shirtColor);
    arc(width / 2, height, 500, 450, PI, 0);

  // Strand of hair
    noStroke();
    fill(hairColor);
    triangle(width / 2 + 20, headHeight * .35, width / 2, hairLength, width / 2 - 20, headHeight * .35);

  // Drawing the head
    fill('tan');
    ellipse(width / 2, 255, headWidth, headHeight);

  // Drawing the ears
    ellipse(width - (headWidth + 1.1 * earSize), headHeight * .85, earSize, earSize * 1.4); // left

    ellipse(headWidth + 1.1 * earSize, headHeight * .85, earSize, earSize * 1.4); // right

    // Drawing a tear
    fill(tear);
    arc(width / 2 - headWidth / 6 - 10, headHeight * 2 / 3 + eyeS / 2, eyeS * .4, eyeS * .6, 1.04, 2.09);

  // Drawing the eyes
    fill('black');
    ellipse(width / 2 + headWidth / 6, headHeight * 2 / 3, eyeS, eyeS);
    fill(230);
    ellipse(width / 2 + headWidth / 6 - 10, headHeight * .63, eyeS * .2, eyeS * .2); // eye bubble

    fill('black');
    ellipse(width / 2 - headWidth / 6, headHeight * 2 / 3, eyeS, eyeS);
    fill(230);
    ellipse(width / 2 - headWidth / 6 - 10, headHeight * .63, eyeS * .2, eyeS * .2); // eye bubble

  // Drawing the nose
    fill(180, 160, 130);
    triangle(width / 2, 255, width / 2 + headWidth / 10, 275, width / 2 - headWidth / 10, 275);

  // Creating the mouth
    fill('grey');
    arc(width / 2, mouth1, 100, 50, mouth2, mouth3);


}

function mousePressed() {
    // when mouse is clicked, random values will generate, changing the facial features
    earSize = random(50, 100);
    hairLength = random(30, 200);
    hairColor = random(0, 100);
    headWidth = random(300, 350);
    headHeight = random(300, 350);
    shirtColor = random(210, 255);
    eyeS = random(30, 70);

    var x = round(random(0.5, 2.5));
    if (dist(mouseX, mouseY, width / 2, 275) < (headWidth / 10)) {
          mouth1 = headHeight * 1.1;
          mouth2 = 3.14;
          mouth3 = 0;
          tear = 'blue';
          
      }
    else {
          mouth1 = headHeight;
          mouth2 = 0;
          mouth3 = 3.14;
          tear = 'tan';
    }
}

My project was inspired by seeing how I apply the variables of face generation to the image of a baby. I also explored how making sure when the mouse was clicked in certain areas, it changed the variables of even more facial features.