ghou-project-02-VariableFace

I really liked the googly-eyes, I feel like it added a little more dynamic to this drawing. There definitely could be more characteristics varied but I think the image should stay somewhat recognizable.

sketch

//Grace Wanying Hou
//15-104 Section D
//ghou@andrew.cmu.edu
//Assignment 02

var faceWidth = 200;
var faceHeight = 250;
var earsize = 100;
var eyesize = 20
var mouthsize = 50;

var faceround = 10;
var earround = 20;

//each of these features have 3 types that will get chosen when clicked 
var facet = 1;
var eart = 1;
var types =[1,2,3];
//colours
var facer = 255;
var faceg = 220;
var faceb = 200;
var eyer = 255;
var eyeg = 255;
var eyeb = 255;

// setting the canvas and changing rectangle mode to center
function setup() {
    createCanvas(480,640);
    rectMode(CENTER);
}


function draw() {
    //background will always be in a darker shade than the face
    background(facer-150, faceg-150, faceb-150);
    fill (facer, faceg, faceb);
    
    stroke(facer+25,faceg+25,faceb+25);
    strokeWeight(20);
    
    
    //types of ears
    if(eart == 1){
        ellipse(width/2 - faceWidth/2, height/2 - faceHeight/4, earsize*4/5, earsize);
        ellipse(width/2 + faceWidth/2, height/2 - faceHeight/4, earsize*4/5, earsize);
    }
    if(eart == 2){
        rect(width/2 - faceWidth/2, height/2 - faceHeight/4, earsize/2, earsize, earround);
        rect(width/2 + faceWidth/2, height/2 - faceHeight/4, earsize/2, earsize, earround);
    }
    if(eart == 3){
        triangle(width/2 - faceWidth/4, height/2 - faceHeight/5, width/2, height/2 - faceHeight/3, width/2 - faceWidth/3, height/2 - faceHeight/2 - earsize/2);
        triangle(width/2 + faceWidth/4, height/2 - faceHeight/5, width/2, height/2 - faceHeight/3, width/2 + faceWidth/3, height/2 - faceHeight/2 - earsize/2);
    }
    
    
    //tyes of faces
    strokeWeight(6);
    if(facet == 1){
        ellipse(width/2, height/2, faceWidth, faceHeight);
    }
    if(facet == 2){
        rect(width/2, height/2, faceWidth, faceHeight, faceround);
    }
    if(facet == 3){
        triangle(width/2 - faceWidth/2, height/2 - faceHeight/2,
		 width/2 + faceWidth/2, height/2 - faceHeight/2,
		 width/2, height/2 + faceHeight/2);
    }
    
    
    //eyes
    noStroke();
    
    //the white? part of the eye???
    fill(facer + 100, faceb + 100, faceg + 100)
    ellipse(width/2 - width/16, height/2 - height/40, eyesize*2, eyesize*2);
    ellipse(width/2 + width/16, height/2 - height/40, eyesize*2, eyesize*2);
    
    //eyeballs??
    fill(0);
    noStroke();
    var eyeballrX = constrain(mouseX, width/2 - width/16 - eyesize/3, width/2 - width/16 + eyesize/3);
    var eyeballlX = constrain(mouseX, width/2 + width/16 - eyesize/3, width/2 + width/16 + eyesize/3);
    var eyebally = constrain(mouseY, height/2 - height/40 - eyesize/3, height/2 - height/40 + eyesize/3);
    
    ellipse(eyeballrX, eyebally, eyesize, eyesize);
    ellipse(eyeballlX, eyebally, eyesize, eyesize);
    
    //mouth
    fill(facer-100, faceg-150, faceb-150);
    stroke(facer-25,faceg-25,faceb-25);
    ellipse(width/2, height/2 + faceHeight/4, faceWidth/500*mouthsize);
    
    }
 
function mousePressed() {
    faceWidth = random(150,300);
    faceHeight = random(100,350);
    facet = random(types);
    
    earsize = random(80,150);
    mouthsize = random(0,100);
    
    faceround = random(10,20);
    earround = random(5,20);

    eart = random(types);
    facer = random (100,255);
    faceg = random (100,255);
    faceb = random (100,255);
}