kyungak-Project-02-Variable-Face

sketch

//Kyunga Ko
//15104B
//kyungak@andrew.cmu.edu
//Assignment-02-Variable-Faces

var facewidth = 260;
var faceheight = 240;
var outerLx = 275;
var outerY = 200;
var eyesize = 40;
var outerRx = 370;
var pupilsize = 7
var nosewidth = 80;
var noseheight = 40;
var nostrilwidth = 5;
var nostrilheight = 10;
var mouthtip = 340;
var mouthheight = 290;
var mouthleft = 310;
var mouthright = 330;
var pupilcolor = 0;

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

function draw() {
    background(198,192,214);
//ears
    fill(228,162,194);

//face
    fill(245,216,230);
    strokeWeight(3);
    stroke(228,162,194);
    ellipse(320,240,facewidth,faceheight);

//eyes
    fill(255);
    stroke(0);
    ellipse(outerLx,outerY,eyesize,eyesize); //left outerpart of eye
    ellipse(outerRx,outerY,eyesize,eyesize); //right outerrpart of eye

    fill(pupilcolor);
    ellipse(outerLx,outerY,pupilsize,pupilsize); //left pupil
    ellipse(outerRx,outerY,pupilsize,pupilsize); //right pupil

//nose
    fill(234,217,225);
    ellipse(320,250,nosewidth,noseheight); //outerpart of nose

    fill(151,139,145);
    ellipse(300,250,nostrilwidth,nostrilheight); //left nostril
    ellipse(340,250,nostrilwidth,nostrilheight); //right nostril

//mouth
    fill(151,139,145); 
    triangle(mouthleft,mouthheight,width/2,mouthtip,mouthright,mouthheight); 
}

function mousePressed() {
    //when the user clicks, the variables are randomly reassigned
    //within the given ranges
    facewidth = random(250,350);
    faceheight = random(230,350);
    outerLx = random(250,275);
    outerY = random(170,200);
    pupilsize = random(5,25);
    nosewidth = random(50,150);
    noseheight = random(30,70);
    nostrilwidth = random(3,10);
    nostrilheight = random(5,15);
    mouthtip = random(300,347);
    mouthleft = random(250,315);
    mouthright = random(325,390);
    mouthheight = random(300,320);
    pupilcolor = random(0,255);
}

As someone who is just learning about this program, learning and experimenting with the “mousePressed” function was interesting. Although I encountered a few problems here and there, I was able to overcome them and learn from the mistakes. I have also attached my notebook sketch of how the face originally looked. Although the result doesn’t synchronize with the sketch, I believe I will be able to make more intricate designs as I learn to utilize more features on javascript.

Leave a Reply