Helen Reynolds – Project 2 – Variable Faces

hreynold-variablefaces

/* 
Helen Reynolds
Section E
hreynold@andrew.cmu.edu
Project-02
*/

//shape variables
var noseWidth = 47;
var faceWidth = 304;
var faceHeight = 265;
var eyeSize = 30;
var mouthHeight = 34;
//color variables
var backgroundR = 245;
var colorR = 32;


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

function draw() {
    background(backgroundR, 229, 218);

    //face
    rectMode (CENTER);
    noStroke();
    push();
    translate(width / 2, height / 2);
    rotate(110);
    fill(218, 164, 129);
    rect(0, 0, faceWidth,  faceHeight, 132);
    pop();

    //mouth
    fill(colorR, 30, 30);
    ellipse(width / 2, height / 2 + 70, 58, mouthHeight);

    //cheeks
    fill(253, 219, 200);
    ellipse(width / 2 - 25, height / 2 + 50, 56, 56);
    ellipse(width / 2 + 25, height / 2 + 50, 56, 56);

    //ears 
    fill(218, 164, 129);
    triangle(170, 97, 251, 144, 186, 212);
    triangle(474, 97, 393, 144, 455, 212);

    //bridge of nose
    rectMode (CENTER);
    noStroke();
    fill(206, 152, 123);
    rect(width / 2, height / 2, noseWidth, 76, 18);

    //nose
    rectMode (CENTER);
    noStroke();
    fill(167, 83, 78);
    rect(width / 2, height / 2 + 27, noseWidth, 24, 9);

    //eyes
    fill(colorR, 50, 30);    
    var eyeLX = width / 2 - faceWidth * 0.2;
    var eyeRX = width / 2 + faceWidth * 0.2;
    ellipse(eyeLX, height / 2, eyeSize, eyeSize);
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);

    //eyes sparkle
    fill(255);
    ellipse(eyeLX + 2, height / 2 - 2, eyeSize / 3, eyeSize / 3);
    ellipse(eyeRX + 2, height / 2 - 2, eyeSize / 3, eyeSize / 3);
}

function mousePressed() {
    faceWidth = random(290, 340);
    faceHeight = random(250, 270);
    eyeSize = random(20, 40);
    colorR = random(30, 170);
    noseWidth = random(35, 60);
    mouthHeight = random(35, 65);
    backgroundR = random(200, 255);

}

To create this kitten, I sought inspiration from Hello Kitty and real cats. Starting off, I worked primarily in Illustrator. While I could’ve taken a more imaginative route with this, I chose to make the variations in my project pretty subtle so that the cat was always relatively believable.

Kitten process

Leave a Reply