Face Generator

var eyeSize = 15;

    var faceWidth = 200;

    var faceHeight = 300;

    var jawWidth = 150;

    var jawHeight = .25;

    var center;

    var eyeHeight = 0;

    var foreheadWidth = faceWidth;

    var noseHeight = 50;

    var mouthHeight = 100;

​

function setup() {

    createCanvas(300, 300);

    noStroke();

    center = {x: width/2, y: height/2};

}

function draw() {

    //clear the background

    background(155, 16, 16);

​

    //FACE SHAPE

    noFill();

    stroke(255, 0, 36);

    strokeWeight(1);

    p1 = {x: center.x - faceWidth/2, y: center.y};

    p2 = {x: center.x, y: center.y + faceHeight/2};

  p3 = {x: center.x + faceWidth/2, y: center.y};

  p4 = {x: center.x, y: center.y - faceHeight/2};

  lJaw = {x: center.x - jawWidth/2, y: center.y + (faceHeight*jawHeight) + 20};

  rJaw = {x: center.x + jawWidth/2, y: center.y + (faceHeight*jawHeight) + 20};

  rForehead = {x: center.x + foreheadWidth/2, y: center.y - faceHeight/4};

  lForehead = {x: center.x - foreheadWidth/2, y: center.y - faceHeight/4}

  //moving counter clockwise around the face

  //cheek to jaw

  curve(lForehead.x, lForehead.y, p1.x, p1.y, lJaw.x, lJaw.y, p2.x, p2.y);

  //jaw to chin

  curve(p1.x, p1.y, lJaw.x, lJaw.y, p2.x, p2.y, rJaw.x, rJaw.y);

  //chin to jaw

  curve(lJaw.x, lJaw.y, p2.x, p2.y, rJaw.x, rJaw.y, p3.x, p3.y);

  //jaw to cheek

  curve(p2.x, p2.y, rJaw.x, rJaw.y, p3.x, p3.y, rForehead.x, rForehead.y);

  //cheek to forehead

  curve(rJaw.x, rJaw.y, p3.x, p3.y, rForehead.x, rForehead.y, p4.x, p4.y);

  //forehead to top of head

  curve(p3.x, p3.y, rForehead.x, rForehead.y, p4.x, p4.y, lForehead.x - 50, lForehead.y);

  //top of head to forehead

  curve(rForehead.x + 50, rForehead.y, p4.x, p4.y, lForehead.x, lForehead.y, p1.x, p1.y);

  //forehead to cheek

  curve(p4.x, p4.y, lForehead.x, lForehead.y, p1.x, p1.y, lJaw.x, lJaw.y);

​

  //EYES

    //calculate the eyes position

    //0.25 is the eye distance and can be a variable too

    var eyeLX = width / 2 - faceWidth * 0.25;

    var eyeRX = width / 2 + faceWidth * 0.25;

    //draw the eye

    stroke(255, 151, 4);

    ellipse(eyeLX, center.y + eyeHeight, eyeSize, eyeSize);

    ellipse(eyeRX, center.y + eyeHeight, eyeSize, eyeSize);

    fill(255, 151, 4);

    ellipse(eyeLX, center.y + eyeHeight, eyeSize/3, eyeSize/3);

    ellipse(eyeRX, center.y + eyeHeight, eyeSize/3, eyeSize/3);

    noFill();

  stroke(255, 0, 36);

  strokeWeight(2);

    lEyeLid1 = {x: eyeLX - (eyeSize/2) - 5, y: center.y + eyeHeight};

    lEyeLid2 = {x: eyeLX, y:center.y + eyeHeight - eyeSize/2};

    lEyeLid3 = {x: eyeLX + (eyeSize/2) + 5, y: center.y + eyeHeight};

    curve(lEyeLid1.x, lEyeLid1.y, lEyeLid1.x, lEyeLid1.y, lEyeLid2.x, lEyeLid2.y, lEyeLid3.x, lEyeLid3.y);

    curve(lEyeLid1.x, lEyeLid1.y, lEyeLid2.x, lEyeLid2.y, lEyeLid3.x, lEyeLid3.y, lEyeLid3.x, lEyeLid3.y);

    rEyeLid1 = {x: eyeRX - (eyeSize/2) - 5, y: center.y + eyeHeight};

    rEyeLid2 = {x: eyeRX, y:center.y + eyeHeight - eyeSize/2};

    rEyeLid3 = {x: eyeRX + (eyeSize/2) + 5, y: center.y + eyeHeight};

    curve(rEyeLid1.x, rEyeLid1.y, rEyeLid1.x, rEyeLid1.y, rEyeLid2.x, rEyeLid2.y, rEyeLid3.x, rEyeLid3.y);

    curve(rEyeLid1.x, rEyeLid1.y, rEyeLid2.x, rEyeLid2.y, rEyeLid3.x, rEyeLid3.y, rEyeLid3.x, rEyeLid3.y);

​

    //NOSE

    line(center.x, center.y + noseHeight, center.x, center.y + noseHeight + 5 );

​

    //MOUTH

​

    line(center.x + 10, center.y + mouthHeight, center.x - 10, center.y + 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 150.

    faceWidth = random(75, 150);

    faceHeight = random(100, 200);

    eyeSize = random(5, 20);

    jawWidth = random(60, 120);

    jawHeight = random(.15, .30);

    eyeHeight = random(-25, 25);

    foreheadWidth = faceWidth - random(10, 20);

    noseHeight = (eyeHeight + (faceHeight/2)/2) - eyeHeight;

    mouthHeight = faceHeight/2 - faceHeight/8;

}