Srishty’s Project 2: Variable Face

sketch
//Srishty Bhavsar
//Section C
//15-104


// GLOBAL VARIABLES 

var headsize = 100;
var eye = 1;
var mouth = 1;
var earring = 1;
var shirtcol = 1;
var hair = 1;

function setup() {
    createCanvas(500, 300);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
    createCanvas(500,300);
    if (mouseY < (width/2)) { // If mouse is in top half of canvas, color is yellow. If in lower half, color is blue
        background(252,239,145);
    } else { 
        background(204, 204, 255);
    }  
    strokeWeight(0);
    triangle(240,180,260,180,250,195); //mouth
    fill(164,116,73); // TAN
    rect(240,208,20,40); //neck

//HEAD CHANGE, HAIR CHANGE, EAR CHANGE 
    if (headsize <= 88 ) { 
        fill(0);
        ellipse(250,280,180,400); // hair     
        fill(164,116,73); // TAN
        rect(240,208,20,40); //neck
        ellipse(200,160,15,25); //ear
        ellipse(300,160,15,25); //ear 2 

        //EARRING CHANGE WITHIN IF      
        if ( earring == 1) {
            fill(255); // white
            ellipse(300,170,3,10); //earrings
            ellipse(200,170,3,10); //earrings
        } else if (earring == 2) {
            fill(255); //pink
            ellipse(300,170,5,5) //earrings
            ellipse(200,170,5,5); //earrings 
        } else {
            fill(207,255,229); //mint
            rect(297, 170, 3, 8); // rect earrings
            rect(200, 170, 3, 8); // rect earrings
        }

        fill(189,154,122); //  skin color
        ellipse(250,150,100,120); // head + ears
        fill(0);
        arc(280, 105, 55, 70, 1, PI + QUARTER_PI, CHORD); //front bang
        rect(270,93,10,23); //bangs
        rect(260,93,10,23); //bangs
        rect(280,101,10,23); //bangs
        rect(289,110,9,23); //bangs
        triangle(200,140,210,103,260,82); // strand
        ellipse(225,133,17,10); // one eye
        fill(189,154,122); // SKIN
        ellipse(225,135,17,10); // skin carve
 
    } else if (headsize >= 88 & headsize <= 100) {
        fill(132, 34, 34); // AUBURN HAIR
        ellipse(250,150,130,150); // TIED UP
        fill(164,116,73); // TAN
        rect(240,208,20,40); //neck
        ellipse(290,160,15,25); //ear adjusted slim
        ellipse(210,160,15,25); //ear 2 adjusted slim

        //EARRING CHANGE WITHIN IF
        if ( earring >= 10 & earring <= 20) {
            fill(255); // white
            ellipse(290,170,3,10); //earrings
            ellipse(210,170,3,10); //earrings
        } else if (earring >= 20 & earring <= 30) {
            fill('pink'); // pink
            ellipse(290,170,5,5); // circle earrings
            ellipse(210,170,5,5); // circle earrings 
        } else {
            fill(207,255,229); //mint 
            rect(290, 170, 3, 8); // rect earrings
            rect(210, 170, 3, 8); // rect earrings
        }

        fill(189,154,122); // skin color
        ellipse(250,150,75,120); // slim head + ears 
        fill(132, 34, 34);
        arc(280, 105, 55, 70, 1, PI + QUARTER_PI, CHORD); //front bang
        rect(270,93,10,23); //bangs
        rect(260,93,10,23); //bangs
        rect(280,101,10,23); //bangs
        rect(289,110,9,23); //bangs
        fill(132, 34, 34); // AUBURN EYEBROWS
        ellipse(225,133,17,10); // one eyebrow
        fill(189,154,122); // SKIN
        ellipse(225,135,17,10); // skin carve

    } else {
        fill(108,25,96); // MAGENTA HAIR
        ellipse(250,280,200,400); // hair
        fill(164,116,73); // TAN
        rect(240,208,20,40); //neck
        ellipse(310,160,15,25); //ear adjusted wide
        ellipse(190,160,15,25); //ear 2 adjusted wide
        fill(63, 20, 20);
        ellipse(310,170,3,10); //earrings
        ellipse(190,170,3,10); //earrings 
        fill(189,154,122);
        ellipse(250,150,120,120); // widest head + wider hair + ears
        fill(108,25,96); // MAGENTA eyebrow
        ellipse(225,133,19,10); // one eyebrow
        ellipse(275,133,19,10); //second eyebrow
        fill(189,154,122); // SKIN
        ellipse(225,135,19,10); // skin carve
        ellipse(275,135,19,10); //skin carve 
        fill(108,25,96);
        triangle(180,140,210,103,255,80); // hair strand
    }   

    if (eye >= 10 & eye <= 20){
        fill(72,60,50); // BROWN 
        ellipse(225,145,10,10); // one eye
        ellipse(275,145,10,10); //second eye 
    } else if (eye >= 20 & eye <= 30) { 
        fill(72,60,50); // BROWN 
        ellipse(225,145,10,10); // one eye
        ellipse(275,145,10,10); //second eye
        fill(189,154,122); // SKIN
        ellipse(225,147,10,10); // one eye SKIN COLOR
        ellipse(275,147,10,10); //second eye SKIN COLOR
    } else if (eye >= 30 & eye <= 40) {
        fill(72,60,50); // BROWN
        ellipse(225,145,10,10); // one eye
        ellipse(275,146,10,10); //second eye
        fill(189,154,122); // SKIN
        ellipse(275,148,10,10); //second eye  
    } else {
        fill(72,60,50); // BROWN 
        ellipse(225,145,10,10); // one eye
        ellipse(275,145,10,10); //second eye

    }

    strokeWeight(0);
    fill(0); 
    stroke(72,60,50); // BLUSH PINK
    fill(242,212,215);
    ellipse(220,170,10,5); //blush1
    ellipse(280,170,10,5); //blush2
    strokeWeight(.5);
    stroke(101,67,33); // DARK BROWN
    line(255,140,255,160); // nose long
    line(245,160,255,160); // nose short
    strokeWeight(0);

// SHIRT COLOR CHANGE 

    if (shirtcol >= 10 & shirtcol <= 20) {
        fill(79, 121, 66); //DARK GREEN
        ellipse(250,330,140,200); //arms
        fill(134,169,111);
        ellipse(250,360,115,280); // body
    } else if (shirtcol >= 20 & shirtcol <= 30) {
        fill(172, 112, 136); //DARK GREEN
        ellipse(250,330,140,200); //arms
        fill(222, 182, 171);
        ellipse(250,360,115,280); // body
    } else if (shirtcol >= 30 & shirtcol <= 40) {
        fill(241, 166, 97); //DARK GREEN
        ellipse(250,330,140,200); //arms
        fill(255, 216, 169);
        ellipse(250,360,115,280); // body    
    } else if (shirtcol >= 40 & shirtcol <= 50) {
        fill(134, 88, 88); //DARK GREEN
        ellipse(250,330,140,200); //arms
        fill(142, 127, 127);
        ellipse(250,360,115,280); // body 
    } else if (shirtcol >= 50 & shirtcol <= 60) {
        fill(110, 133, 183); //DARK GREEN
        ellipse(250,330,140,200); //arms
        fill(196, 215, 224);
        ellipse(250,360,115,280); // body     
    } else { 
        fill(79, 121, 66); //DARK GREEN
        ellipse(250,330,140,200); //arms
        fill(134,169,111);
        ellipse(250,360,115,280); // body
    }

// MOUTH CHANGE

    if (mouth >= 10 & mouth <= 20) {
        fill(255,182,193); // pink
        triangle(240,180,260,180,250,195); // MOUTH HAPPY
    } else if (mouth >= 20 & mouth <= 30) {
        fill(203, 76, 78); // light red
        ellipse(250,180,10,20); // MOUTH SHOCKED
    } else if (mouth >= 30 & mouth <= 40) {
        strokeWeight(1);
        stroke(0); //BLAXK
        line(240,180,260,180) //PLAIN MOUTH
    } else {
        strokeWeight(1);
        stroke(0);
        line(240,180,260,180);
    }

}

function mousePressed() {
    //when the user clicks, the variables of the following features are reassigned to random values within their respective ranges
    
    headsize = random(75,120); // head witdth
    eye = random(10,40); // 4 eye types
    mouth = random(10,40); // 4 mouth types
    earring = random (10,30); // 3 earring types
    shirtcol = random(10,60); // 6 color shirts
} 

Leave a Reply