keuchuka-project2-variablefaces

project2

// Fon Euchukanonchai
// section A
// keuchuka@andrew.cmu.edu
// Project 2

//face coordinates
var faceX = 158;
var faceY = 103;
var faceW = 200;
var faceH = 320;
var faceRotate = -5;

var colorR = 249;
var colorG = 201;
var colorB = 216;


//facial features coordinates
var featureA = 130;
var featureB = 180;
var featureC = 150;
var featureD = 160;
var featureE = 220;
var featureE = 190;


function setup() {
    createCanvas(480, 640);
    background(255);
    noStroke(0);

   }
 
 function draw() {

    //face
    push();
    fill(colorR, colorG, colorB);
    noStroke();
    angleMode(DEGREES);
    rotate(faceRotate);
    rect(faceX, faceY, faceW, faceH, 20);
    pop();

    //top left eyes

    rotate(faceRotate-5);
    noFill();
    strokeWeight(2);
    stroke(0);
    beginShape();
    curveVertex(featureA, featureB);
    curveVertex(featureA, featureB);
    curveVertex(featureC, featureD); 
    curveVertex(featureE, featureE);
    curveVertex(featureE, featureE);
    endShape();

    //top right eyes
    noFill();
    strokeWeight(2);
    stroke(0);
    beginShape();
    curveVertex(featureA*2, featureB);
    curveVertex(featureA*2, featureB);
    curveVertex(featureC+230, featureD); 
    curveVertex(featureE*2, featureE);
    curveVertex(featureE*2, featureE);
    endShape();

    //bottom left eyes
    noFill();
    strokeWeight(3);
    stroke(0);
    beginShape();
    curveVertex(featureA+20, featureB+40);
    curveVertex(featureA+20, featureB+40);
    curveVertex(featureC+20, featureD+70); 
    curveVertex(featureE, featureE+40);
    curveVertex(featureE, featureE+40);
    endShape();

    //bottom right eyes
    noFill();
    strokeWeight(3);
    stroke(0);
    beginShape();
    curveVertex(featureA*2, featureB+50);
    curveVertex(featureA*2, featureB+50);
    curveVertex(featureC+200, featureD+90); 
    curveVertex(featureE+180, featureE+50);
    curveVertex(featureE+180, featureE+50);
    endShape();

    //nose
    noFill();
    strokeWeight(2);
    stroke(0);
    beginShape();
    curveVertex(featureA*2, featureA*2);
    curveVertex(featureA*2, featureA*2);
    quadraticVertex(featureA+110, featureC*2, featureA*2, featureD*2);
    quadraticVertex(featureA*2, featureB*2, featureA*2, featureD*2);
    curveVertex(featureA*2, featureE*2);
    curveVertex(featureA*2, featureE*2);
    endShape();

    //mouth
    noFill();
    strokeWeight(1);
    stroke(0);
    beginShape();
    curveVertex(featureB, featureC*3);
    curveVertex(featureB, featureC*3);
    quadraticVertex(featureA*2, featureC*3, featureA*2, featureD*3);
    quadraticVertex(featureD*2, featureD*3, featureC*2, featureD*3);
    curveVertex(featureB*2, featureD*3);
    curveVertex(featureB*2, featureD*3);
    endShape();

    //moustache
    fill(0);
    arc(featureA*2-10, featureC*3-10, 30, 15, -180, 0)
    rotate(20);
    arc(featureA*3+30, featureC*2+25, 30, 15, -180, 0)

    //mole
    fill(0);
    stroke(0);
    strokeWeight(1);
    ellipse(featureC, featureD-140, 20, 20);

}

//when mouse clicks, face and facial features dance

function mousePressed() {

    background(255);
    faceX = random(70, 200);
    faceY = random(50, 150);
    faceW = random(150, 300);
    faceH = random(250, 350);
    faceRotate = random(-15, 15);

    colorR = random(150, 300);
    colorG = random(150, 300);
    colorB = random(150, 300);

    featureA = random(120, 140);
    featureB = random(170, 190);
    featureC = random(140, 160);
    featureD = random(150, 170);
    featureE = random(210, 230);
    featureE = random (180, 200);

}

I wanted to create a line portrait that had simple parts, all of its parts moving, and constantly generating something new from random values. The result is an interesting one as the features constantly change but the attitude remains the same.