Ellan Suder – Project 02 – Variable Face

variable face

/*
Ellan Suder
15104 1 D
esuder@andrew.cmu.edu
Project-02
*/

var left = 165;
var right = left + 200;
var upDown;
var randomColor;
var randomAlpha = 100;
var randomSize = 50;


function setup() {
    createCanvas(600, 450);
    background(200,300,40);
    
    randomColor = color(0,0,0);

    noStroke();
    fill(0,140,230);
    ellipse(200,450,300,300);
    fill(255); //face
    ellipse(200,200,300,390);
    ellipse(350, 150, 80, 80);
    fill(0,20,30) //dot eyes
    ellipse(150,150,40,40);
    ellipse(350,150,40,40);
  
    fill(0,20,30); //hat
    noStroke();
    beginShape();
    curveVertex(70, 90);
    curveVertex(70, 90);
    curveVertex(58, -20);
    curveVertex(321, -20);
    curveVertex(332, 90);
    curveVertex(332, 90);
    endShape();
  
    strokeWeight(6); // lines
    stroke(0,20,30)
    noFill();
    arc(150, 150, 80, 80, 3* QUARTER_PI, TWO_PI); //left eye
    arc(350, 150, 80, 80, PI, TWO_PI + HALF_PI); //right eye
    arc(250, 220, 80, 30, 3 * HALF_PI, QUARTER_PI); //nose
    arc(250, 280, 60, 60, 0 , PI); //mouth
    strokeWeight(7);
    stroke(0,140,230);
    rect(80, 100, 140, 120, 20); // left glasses lens
    rect(300, 100, 140, 120, 20); // right glasses lens
    
    textSize(10);
    noStroke();
    fill(0);
    text("click to randomize!", 460, 90);
}
 
function mousePressed() {
    noStroke(); //two circles change color every mousepress
    randomColor = color(random(230),random(230),random(230));
    fill(randomColor);
    ellipse(150,220,40,40);
    ellipse(350,220,40,40);

    var a = 110; //clover
    var b = 45;
    var r = 10;
    var w = 50;
    ellipse(a,b,r+10,w+10);
    bezier(a,b, //top
         a-r+w,b-r+w,
         a+r+w,b-r-w,
         a,b);
    bezier(a,b, //top (left)
         a-r-w,b-r-w,
         a+r-w,b-r+w,
         a,b);
    bezier(a,b, //right (top)
         a+r-w,b+r-w,
         a+r+w,b-r-w,
         a,b);
    bezier(a,b, //right (bottom)
         a+r+w,b+r+w,
         a+r-w,b-r+w,
         a,b);
    bezier(a,b, //left
         a-r+w,b-r+w,
         a-r-w,b+r+w,
         a,b);
    bezier(a,b, //left (top)
         a-r-w,b-r-w,
         a-r+w,b+r-w,
         a,b);
    bezier(a,b, //bottom (left)
         a+r-w,b+r-w,
         a-r-w,b+r+w,
         a,b);
    bezier(a,b, //bottom
         a+r+w,b+r+w,
         a-r+w,b+r-w,
         a,b);
  
    fill(255) //redraw sclera
    ellipse(150,150,75,75);
    ellipse(350,150,75,75);
    left = random(137, 158);
    right = left + 200
    randomSize = random(10,45);
    randomAlpha = random(60,100);
    randomColor.setAlpha(randomAlpha);
    fill(randomColor);
    upDown = random(137,163);
    ellipse(left, upDown, randomSize, randomSize); //eyes
    ellipse(right, upDown, randomSize, randomSize);
    
    fill(255) //redraw nose area
    rect(250,200,45,40);
    stroke(0);
    noFill();
    arc(250, 220, randomSize + 20, 30, 3 * HALF_PI, QUARTER_PI); //nose  
  
    noStroke();
    fill(255)
    ellipse(250,300,85,85);
    fill(0);
    var oscsize; //mouth
    ellipse(250,300,80,60 - sin(millis()/100) * 20);
  
    let letters = ['A', 'B', 'C', 'D', 'E', 'F', 
'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 
'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
    let letter = random(letters); // select random letter
    fill(200,300,40) //redraw background 
    rect(450,30,100,100)
    fill(0);
    textSize(62);
    text(letter, 470, 90);
}

Leave a Reply