Xiaoyu Kang – Project 02 – Variable Face

sketch

/*
Xiaoyu Kang
Section B
xkang@andrew.cmu.edu
Assignment-02-B
*/
var circles = 200;
var faceW = 280;
var faceH = 300;
var hairL = 200; 
var eyes = 30;
var backC = 100;

function setup() {
    createCanvas(640, 640);
    background(242,180,180);
}
function draw() {
	var hairW = faceW + 90;
    noStroke();
//background circles
    fill(158,37,circles);
    ellipse(30,80,backC,backC);
    ellipse(100,320,backC,backC);
    ellipse(300,60,backC,backC);
    ellipse(530,30,backC,backC);
    ellipse(540,580,backC,backC);
    ellipse(600,280,backC,backC);
    ellipse(50,520,backC,backC);
//hair
    fill(221,184,85);
    ellipse(320,310,hairW,faceH + 90);
    rect(320 - hairW * 0.5,310,hairW,hairL);
//face
    fill(242,232,221);
    ellipse(320,320,faceW,faceH);
//hair
    fill(221,184,85);
    arc(320, 200, 280, 80, 180, PI + QUARTER_PI, CHORD);
//neck 
    fill(242,232,221);
    rect(280,440,80,80);
//cloth
    fill(229,128,circles);
    rect(270,490,100,20);
    ellipse(320,640,400,280);
//ear
    fill(242,232,221);
    ellipse(320 - faceW * 0.5,320,50,90);
    ellipse(320 + faceW * 0.5,320,50,90);
//eyes
    fill("grey");
    ellipse(320 - 60,300,eyes,eyes);
    ellipse(320 + 60,300,eyes,eyes);
    fill("white");
    ellipse(320 - 70,290,10,10);
    ellipse(320 + 50,290,10,10);
//eyebrowsL
    fill(214,179,85);
    strokeWeight(10);
    beginShape();
    vertex(230,270);
    vertex(240,275);
    vertex(270,270);
    vertex(280,260);
    endShape(CLOSE);
    fill(214,179,85);
    strokeWeight(10);
    beginShape();
    vertex(410,270);
    vertex(400,275);
    vertex(370,270);
    vertex(360,260);
    endShape(CLOSE);
//nose
    fill(195,154,133);
    strokeWeight(10);
    beginShape();
    vertex(295,340);
    vertex(310,350);
    vertex(330,350);
    vertex(345,340);
    endShape(CLOSE);
//lips
    fill(216,135,128);
    strokeWeight(10);
    beginShape();
    vertex(270,380);
    vertex(290,400);
    vertex(350,400);
    vertex(370,380);
    endShape(CLOSE);
}
function mousePressed() {
	circles = random(100,250);
    faceW = random(260,300);
    faceH = random(280,320);
    hairL = random(180,380);
    eyes = random(20,35);
}

I mainly focused on writing a code that will allow shape changes and color changes. The size of the person’s face are made changeable by clicking the mouse. And since the size of the hair is based on the size of the face, the hair changes as the face changes. The size of the person’s eyes also varies. I also made the color of both the clothings and the circles in the background changeable. The color varies in a range of different kind of red and purple.