Stefanie Suk – Project-02 – Variable Faces

For this project, I tried to create as many aspects of variability as possible, including size, color, and position.  I also used variables that are necessary to create and change the face every time I click onto the screen. 

sketch

//Stefanie Suk
//15-104 D
//ssuk@andrew.cmu.edu
//Project 02

var faceW = 323;
var faceH = 257;
var noseW = 62;
var noseH = 39;
var nostrilW = 9;
var nostrilH = 16;
var backgroundR = 189;
var backgroundG = 140;
var backgroundB = 191;
var facecolorR = 250;
var facecolorG = 201;
var facecolorB = 222;
var ribboncolorR = 221;
var ribboncolorG = 66;
var ribboncolorB = 134;
var nosecolorR = 239;
var nosecolorG = 128;
var nosecolorB = 177;
var eyecolor = 46;
var eyesizeW = 22
var eyesizeH = 22
var mouthline = 292

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

function draw() {
    background(backgroundR, backgroundG, backgroundB);
    noStroke();
    fill(facecolorR, facecolorG, facecolorB);
    ellipse(319.5, 232.5, faceW, faceH);
    //face
    noStroke();
    fill(eyecolor)
    ellipse(259, 233, eyesizeW, eyesizeH);
    //lefteye
    noStroke();
    fill(eyecolor);
    ellipse(379, 233, eyesizeW, eyesizeH);
    //righteye
    noStroke();
    fill(facecolorR, facecolorG, facecolorB);
    triangle(175.5, 176.1, 191.5, 102.9, 263.7, 118.9);
    //leftear
    noStroke();
    fill(facecolorR, facecolorG, facecolorB);
    triangle(466.5, 191, 466.5, 118, 393, 118);
    //rightear
    noStroke();
    fill(nosecolorR, nosecolorG, nosecolorB);
    ellipse(320, 259.5, noseW, noseH);
    //nose
    noStroke();
    fill(0);
    ellipse(305.5, 259, nostrilW, nostrilH);
    //leftnostril
    noStroke();
    fill(0);
    ellipse(333.5, 259, nostrilW, nostrilH);
    //rightnostril
    noStroke();
    fill(ribboncolorR, ribboncolorG, ribboncolorB);
    triangle(275, 185, 275, 125, 320, 155);
    //ribbonleft
    noStroke();
    fill(ribboncolorR, ribboncolorG, ribboncolorB);
    triangle(320, 155, 365, 185, 365, 125);
    //ribbonright
    noStroke();
    fill(ribboncolorR, ribboncolorG, ribboncolorB);
    ellipse(320, 155.5, 19, 19);
    //ribboncenter
    stroke(0);
    strokeWeight(10);
    line(304, mouthline, 320, 309);
    stroke(0);
    line(336, mouthline, 320, 309);
    //mouth
}

function mousePressed() {
    mouthline = random(292, 323);
    eyesizeW = random(22, 60);
    eyesizeH = random(22, 44);
    backgroundR = random(131, 242);
    backgroundG = random(140, 174);
    backgroundB = random(133, 202);
    facecolorR = random(201, 250);
    facecolorG = random(201, 219);
    facecolorB = random(201, 250);
    nosecolorR = random(76, 239);
    nosecolorG = random(114, 143);
    nosecolorB = random(87, 253);
}

Leave a Reply