Jessica Timczyk – Project 02

pigface

// Jessica Timczyk
// Section D
// jtimczyk@andrew.cmu.edu
// Project 02 - Variable Face

var eyeSize = 40;
var faceWidth = 200;
var faceHeight = 300;
var faceColorR = 241;
var faceColorG = 146;
var faceColorB = 188;
var eyeColorR = 126;
var eyeColorG = 242;
var eyeColorB = 230;
var eyeLX = 640 / 2 - faceWidth * 0.25;
var eyeRX = 640 / 2 + faceWidth * 0.25;
var mouthHeight = 480 / 2 + 40
var noseHeight = 25

function setup() {
    createCanvas(640, 480);
}
 
function draw() {
    background(226, 179, 239);

    // face color
    stroke(0);
    strokeWeight(2);
    fill(faceColorR, faceColorG, faceColorB);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);

    //eye variables
    var eyeLX = 640 / 2 - faceWidth * 0.25;
    var eyeRX = 640 / 2 + faceWidth * 0.25;

    // eyeball shapes
    fill(255);
    ellipse(eyeLX, height / 2, eyeSize, eyeSize * 3/4);
    ellipse(eyeRX, height / 2, eyeSize, eyeSize * 3/4);

    // irises shape
    strokeWeight(.75);
    // the iris color will change but the variables are rearranged so that 
    // they are not the same color as the face
    fill(eyeColorR, eyeColorG, eyeColorB);
    ellipse(eyeLX, height / 2, eyeSize * 2/3, eyeSize * 2/3);
    ellipse(eyeRX, height / 2, eyeSize * 2/3, eyeSize * 2/3);

    // Pupil
    fill(0);
    ellipse(eyeLX, height / 2, eyeSize * 1/3, eyeSize * 1/3);
    ellipse(eyeRX, height / 2, eyeSize * 1/3, eyeSize * 1/3);


    //eyebrow variables
    var eyebrowLX = eyeLX - 30;
    var eyebrowRX = eyeRX - 30;

    // left eyebrow shape
    noStroke();
    fill(123, 72, 72);
    beginShape();
    curveVertex(eyebrowLX, height / 2 - 20);
    curveVertex(eyebrowLX, height / 2 - 20);
    curveVertex(eyebrowLX + 30, height / 2 - 40);
    curveVertex(eyebrowLX + 50, height / 2 - 35);
    curveVertex(eyebrowLX + 50, height / 2 - 30);
    curveVertex(eyebrowLX + 30, height / 2 - 33);
    curveVertex(eyebrowLX + 30, height / 2 - 33);
    endShape();

    // right eyebrow shape
    fill(123, 72, 72);
    beginShape();
    curveVertex(eyebrowRX + 60, height / 2 - 20);
    curveVertex(eyebrowRX + 60, height / 2 - 20);
    curveVertex(eyebrowRX + 30, height / 2 - 40);
    curveVertex(eyebrowRX + 10, height / 2 - 35);
    curveVertex(eyebrowRX + 10, height / 2 - 30);
    curveVertex(eyebrowRX + 30, height / 2 - 33);
    curveVertex(eyebrowRX + 30, height / 2 - 33);
    endShape();

    // mouth shape
    fill(0);
    stroke(235, 65, 97);
    strokeWeight(4);
    arc(width / 2, faceHeight, 80, 80, 0, PI, CHORD);

    // restraining mouth height to stay below 2/3 of the way down 
    // the page as to not overlap with the eyes as they move
    if (faceHeight <= height * 2/3) {
        faceHeight = mouthHeight;
    }

    // Pig nose
    stroke(0);
    fill(227, 138, 190);
    ellipse(width / 2, faceHeight - noseHeight, 70, 60);

    // nostrils
    fill(0);
    ellipse(width / 2 - 10, faceHeight - noseHeight, 8, 15);
    ellipse(width / 2 + 10, faceHeight - noseHeight, 8, 15);

    // ears
    strokeWeight(3);
    fill(faceColorR, faceColorG, faceColorB);
    ellipse(eyeLX, faceHeight * 1/3, 90, 85);
    ellipse(eyeRX, faceHeight * 1/3, 90, 85);

    // cheaks
    // use eyeRX as x value so that the cheeks move with the eyes
    arc(eyeRX + 35, faceHeight + 10, 80, 80, PI, PI + HALF_PI, OPEN);
    arc(eyeLX - 35, faceHeight + 10, 80, 80, PI + HALF_PI, TWO_PI, OPEN);


}
 

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(150, 500);
    faceHeight = random(100, 400);
    eyeSize = random(30, 85);
    faceColorR = random(235, 244);
    faceColorG = random(54, 194);
    faceColorB = random(161, 224);
    eyebrowLX = random(eyeLX - 50, eyeLX - 10);
    eyebrowRX = random(eyeRX - 50, eyeLX - 10);
    mouthHeight = random(270, 330);
    noseHeight = random(40, 15);
    eyeColorR = random(126, 242);
    eyeColorG = random(126, 242);
    eyecolorB= random(126, 242);
}






It took me a little while to understand how to use the random command with variables to get the results I wanted. Each time I would add a new feature, I would draw it on the original face, and then add in the random movement and random function at the end. Most of my time was then spent manipulating the bounds so that the different features of my pig faces would not overlap.

Leave a Reply