Kristine Kim-Project 02-Variable-Face

sketch

//Kristine Kim
//Section D
//younsook@andrew.cmu.edu
//Project-02-variable-Face

var headW = 350;
var headH = 300;
var head_colorR = 250;
var head_colorG = 250;
var head_colorB = 150;
var eyesize = 100;
var pupilsize = 60;
var blushW = 60;
var blushH = 30;
var blush_colorR = 250;
var blush_colorG = 180;
var blush_colorB = 242;
var buttons = 50;
var buttons_colorR = 231;
var buttons_colorG = 129;
var buttons_colorB = 247;
var eyebrowLU = 30;
var eyebrowLD = 100;
var eyebrowRU = 450;
var eyebrowRD = 100;
var backgroundR = 242;
var backgroundG = 161;
var backgroundB = 90;


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

function draw() {
    background(backgroundR,backgroundG,backgroundB);
//body
    fill ('#74eda7');
    noStroke();
    triangle(width/2, height/4.5, 480,640,0,640);
// head
    fill (head_colorR, head_colorG, head_colorB);
    noStroke();
    rectMode(CENTER);
    rect(width/2, height/2.5, headW, headH);
    //rect(width/7.5, height/6, headW, headH);
//eyes    
    var eyeL = width/2 - headW*0.25;
    var eyeR = width/2 + headW*0.25;
    fill('white');
    stroke(255, 204, 0);
    strokeWeight(6);
    ellipse(eyeL,height/2.75, eyesize, eyesize);
    ellipse(eyeR,height/2.75, eyesize, eyesize);
// pupil
    var pupilL = width/2 - headW*0.25;
    var pupilR = width/2 + headW*0.25;
    fill ('#3d4540');
    noStroke();
    ellipse(pupilL, height/2.75,pupilsize, pupilsize);
    ellipse(pupilR, height/2.75,pupilsize, pupilsize);
// left eyebrow 
    stroke('black');
    strokeWeight('20');
    noSmooth();
    line(eyebrowLU,70,190,160);
    line(190,160,30,eyebrowLD);
// right eyebrows
    line(300, 160, 450,eyebrowRD);
    line(eyebrowRU,70,300,160);
//mouth
    fill('#eb876c');
    noStroke();
    quad (width/2-50, height/2, width/2+50,height/2, width/2 +100, height/2+ 100, width/2 -100, height/2+100);
//teeth
    fill('white');
    stroke('#dbdbdb');
    strokeWeight('5');
    rect(width/2-25,height/1.85,50,50);
    rect(width/2+25,height/1.85,50,50);
//blush
    var blushLeft = width/2.25- headW*0.25;
    var blushRight = width/1.8 + headW*0.25;
    stroke('#f25a5a');
    strokeWeight('5');
    fill(blush_colorR,blush_colorG,blush_colorB);
    ellipse(blushLeft, height/2, blushW, blushH);
    ellipse(blushRight, height/2, blushW, blushH);
//buttons
    stroke('#d1d1d1');
    strokeWeight('3');
    fill(buttons_colorR, buttons_colorG,buttons_colorB);
    ellipse (width/2, height/1.4, buttons, buttons);
    ellipse (width/2, height/1.2, buttons, buttons);
    ellipse (width/2, height/1.05, buttons, buttons);

}
//mousepressed
function mousePressed(){
    headW = random(275,430);
    headH = random(250,350);
    head_colorR = random(0,400);
    head_colorG = random(0,300);
    head_colorB = random(0,400);
    blush_colorR = random(0,400);
    blush_colorG = random(0,500);
    blush_colorB = random(0,400);
    eyesize = random(85,230);
    pupilsize = random(20,85);
    blushH = random(30,70);
    blushW = random(60,100);
    buttons_colorR = random(0,300);
    buttons_colorG = random(0,400);
    buttons_colorB = random(0,200);
    buttons = random(40,70);
    backgroundR = random(0,200);
    backgroundG= random(0,200);
    backgroundB = random(0,200);

   
}

 

I started this project first by sketching an imagery character. Last project, I used Adobe illustrator to help me point out coordinates but this time, I wanted to challenge myself but starting on a blank canvas. It was more challenging and time consuming than last time but definitely helped me understand the concept of coding and building my own code.