Project 02: Variable Faces

This is my project 02 “Variable Faces”. The most challenging part of this project is organizing the logic of my code. Once the logic is sorted out it was actually not too complicated. I struggled a bit with certain shapes.

sketch
/* Jenny Wang
   Section B */

var eyes = 3;
var features = 3;
var mouth = 3;
var hair = 3;

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

function draw() {
    background(250,160,150);
    noStroke()
    fill(230,89,132);
    ellipse()
    noStroke();
    fill(226,190,134);
    ellipse(234,258,199,250);//face
    strokeWeight(2); //nose
    stroke(177,123,60);
    line(231,272,220,300);
    strokeWeight(2);
    stroke(177,123,60);
    line(220,300,236,302);


    if(eyes<=1){ //round eyes
        noStroke();
        fill(255,255,255);
        circle(182,252,46);
        noStroke();
        fill(162,196,231);
        circle(182,252,29);
        noStroke();
        fill(43,91,137);
        circle(182,252,17);
        //left eye
        noStroke();
        fill(255,255,255);
        circle(292,252,46);
        noStroke();
        fill(162,196,231);
        circle(292,252,29);
        noStroke();
        fill(43,91,137);
        circle(292,252,17);
        //right eye
    }
    else if(eyes<=2){ //squint eyes
        strokeWeight(3);
        stroke(65,50,20)
        line(170,253,197,265);
        line(170,280,197,265);//left eye
        line(270,265,297,254);
        line(297,280,270,265);//right eye
    }
    else if (eyes<=3){ //half eyes
        noStroke();
        fill(255,255,255);
        arc(182,252,46,46,2.6,0.5,open)
        noStroke();
        fill(164,209,125);
        circle(182,252,29);
        noStroke();
        fill(177,123,57);
        circle(182,252,17);
        //left eye
        noStroke();
        fill(255,255,255);
        arc(292,252,46,46,2.6,0.5,open)
        noStroke();
        fill(164,209,125);
        circle(292,252,29);
        noStroke();
        fill(177,123,57);
        circle(292,252,17);
    }

    if(features<=1){ //mole
        strokeWeight(3);
        fill(177,123,57)
        point(186,321);
    }
    else if(features<=2){ //freckles
        strokeWeight(3);
        fill(177,123,57);
        point(162,301);
        strokeWeight(3);
        fill(177,123,57);
        point(177,309);
        strokeWeight(3);
        fill(177,123,57);
        point(194,303);
        strokeWeight(3);
        fill(177,123,57);
        point(265,306);
        strokeWeight(3);
        fill(177,123,57);
        point(283,299);
        strokeWeight(3);
        fill(177,123,57);
        point(298,308);
    }
    else if(features<=3){ //blush
        noStroke();
        fill(239,171,199);
        ellipse(164,306,28,16);
        noStroke();
        fill(239,171,199);
        ellipse(305,306,28,16);
    }

    if(mouth<=1){ //happy laugh
        noStroke();
        fill(246,166,193);
        arc(237,324,80,70,0,0.6 + 2.6, OPEN);
    }
    else if(mouth<=2){//sad mouth
        strokeWeight(4);
        stroke(246,160,193);
        line(214,350,235,343);
        strokeWeight(4);
        stroke(246,160,193);
        line(256,350,235,343);
    }
    else if(mouth<=3){ //mouth with teeth
        noStroke();
        fill(237,10,124);
        arc(237,324,80,70,0,0.6 + 2.6, OPEN);
        noStroke();
        fill(255,255,255);
        rect(227,323,21,11);
    }

    if(hair<=1){ //red hair
        noStroke();
        fill(199,102,29);
        arc(233,179,160,93,2.6,0.5, OPEN);
        noStroke();
        fill(199,102,29);
        circle(347,197,95);
        noStroke();
        fill(199,102,29);
        circle(116,197,95);
    }
    else if(hair<=2) { //blonde hair
        noStroke();
        fill(231,209,100);
        circle(234,124,98);
        noStroke();
        fill(231,209,100);
        circle(305,148,84);
        noStroke();
        fill(231,209,100);
        circle(342,203,58);
        noStroke();
        fill(231,209,100);
        circle(347,244,45);
        noStroke();
        fill(231,209,100);
        circle(160,148,84);
        noStroke();
        fill(231,209,100);
        circle(127,203,58);
        noStroke();
        fill(231,209,100);
        circle(121,244,45);
    }
    else if(hair<=3){ //brown hair
        noStroke();
        fill(177,123,57);
        arc(233,180,232,126,2.6,0.5, OPEN);
        noStroke();
        fill(177,123,57);
        rect(118,180,38,205)
        noStroke();
        fill(177,123,57);
        rect(311,180,38,205);
    }
    
    noStroke(); //neck
    fill(226,190,134);
    rect(210,378,48,63);
    noStroke(); //body
    fill(226,190,134);
    rect(120,415,231,225,65,65,0,0);
    noStroke(); //dress
    fill(184,191,225);
    quad(155,527,202,415,265,415,320,527);
    noStroke(); 
    fill(226,190,134);
    triangle(202,415,265,415,233,475);
    noStroke(); 
    fill(184,191,225);
    rect(155,527,164,113);
}

function mousePressed() {
    eyes = random (0,3);
    features = random (0,3);
    mouth = random (0,3);
    hair = random (0,3);
}
    

Leave a Reply