Enwandu-Project-02-Variable-Face

Variable Face

/*  Emmanuel Nwandu
    enwandu@andrew.cmu.edu
    Section D
    Project-02-Variable-Face
*/
var faceWidth = 420;
var faceHeight = 420;
var eyeSize = 82;
var eyePatchH = 176;
var eyePatchW = 111;
var mouthStroke = 7;
var earWidth = 173;
var earHeight = 195;
var blushWidth = 45;
var blushHeight = 27;
var blushRed = 253;
var blushGreen = 216;
var blushBlue = 201;

function setup() {
    createCanvas(480, 640);
    background(256);
    text("p5.js vers 0.5.12 test.", 10, 15);
}

function draw() {
    background(256);

    //ears
    fill(0);
    ellipse(97, 170, earWidth, earHeight);
    ellipse(388, 170, earWidth, earHeight);

    //inner ears
    fill(blushRed, blushGreen, blushBlue);
    ellipse(97, 170, earWidth - 78, earHeight - 91);
    ellipse(388, 170, earWidth - 78, earHeight - 91);

    //head
    noStroke();
    fill(256);
    ellipse(width/2, height/2, faceWidth, faceHeight);

    //eyepatches
    noStroke();
    fill(0);
    ellipse(130, 337, eyePatchW, eyePatchH);
    ellipse(353, 337, eyePatchW, eyePatchH);


    //eyes including pupil and highlights
    noStroke();
    fill(256)
    ellipse(136, 355, eyePatchW - 29, eyePatchW - 29);
    ellipse(359, 355, eyePatchW - 29, eyePatchW - 29);
    fill(0);
    ellipse(136, 355, 62, 62);
    ellipse(359, 355, 62, 62)

    fill(256)
    //Defines edge conditions
    //Allows the highlights to follow the mouse within the boundary
    var leftEdgeR = 120;
    var rightEdgeR = 147;
    var leftEdgeL = 343;
    var rightEdgeL = 370;

    var xcR = constrain(mouseX, leftEdgeR, rightEdgeR);
    var xcL = constrain(mouseX, leftEdgeL, rightEdgeL);

    ellipse(xcR, 337, 33, 33);
    ellipse(130, 356, 12, 12);
    ellipse(xcL, 337, 33, 33);
    ellipse(353, 356, 12, 12);

    //nose
    fill(0);
    ellipse(243, 413, 50, 20);
    ellipse(243, 419, 27, 20);

    //blush
    fill(blushRed, blushGreen, blushGreen);
    ellipse(132, 452, blushWidth, blushHeight);
    ellipse(356, 452, blushWidth, blushHeight);

    //mouth
    noFill();
    stroke(0);
    strokeWeight(mouthStroke);
    arc(243, 425, 75, 60, HALF_PI, PI);

}
//When the mouse is pressed variables are randomized
function mousePressed() {
    mouthStroke = random(1, 10);
    faceWidth = random(360, 420);
    faceHeight = random(360, 420);
    earWidth = random(100, 180);
    earHeight = random(120, 200);
    eyePatchW = random(65, 150);
    eyePatchH = random(150, 200);
    blushWidth = random(40, 85);
    blushHeight = random(20, 35);
    blushRed = random(150, 260);
    blushGreen = random(200, 220);
    blushBlue = random(175, 210);

}

Inspired by my love of pandas, I coded the image with the intent of playing with figure ground relationships, negative and positive space, and how it can inform the clarity of the image.

I started by coding the base image that is seen first, and through trial and error began coding the randomized variations.

Author: Emmanuel

MARVEL!!!! View all posts by Emmanuel