/*
SooA Kim
Section D
sookim@andrew.cmu.edu
Project-02-Variable-Face
*/
var eye = 40;
var eyeH = 300;
var faceW = 240;
var mouthH = 10;
var color1 = 255;
var tri1 = 150;
var tri2 = 148;
var tri3 = 184;
var mouthOpen = 1;
function setup() {
createCanvas(480, 640);
background (25, 170, 180);
}
function draw() {
//blackcoat
strokeWeight(3);
fill("black");
beginShape();
curveVertex(25, 640);
curveVertex(25, 640);
curveVertex(30, 500);
curveVertex(100, 220);
curveVertex(240, 120);
curveVertex(380, 220);
curveVertex(450, 500);
curveVertex(455, 640);
curveVertex(455, 640);
endShape();
//face
noStroke();
fill(color1);
ellipse(240, 330, faceW, 340);
//eyes
fill(0);
ellipse (180, eyeH, eye, eye/2);
ellipse (300, eyeH, eye, eye/2);
//shadow?
ellipse (180, 330, 35, 8);
ellipse (300, 330, 35, 8);
//mouth
ellipse (240, 450, mouthH * 5, mouthH);
//top triangles
fill(tri1, tri2, tri3);
triangle (160, 270, 175, 230, 190, 270);
triangle (290, 270, 300, 230, 320, 270);
//bottom triangles
triangle(160, 350, 175, 420, 190, 350);
triangle(290, 350, 300, 420, 320, 350);
ellipse(240, 475, 30, 10);
//mouth2 open
if (mouthOpen >= 1) {
fill(0); //black
}
else {
fill(255);
ellipse(240, 560, 250, 100);
fill("red");
ellipse(240, 560, 250, 55);
stroke(1);
line(130, 510, 130, 547);
line(150, 510, 150, 540);
line(180, 510, 180, 537);
line(210, 510, 210, 533);
line(240, 510, 240, 533);
line(270, 510, 270, 533);
line(300, 510, 300, 535);
line(330, 525, 330, 540);
line(350, 525, 350, 547);
line(130, 573, 130, 620);
line(150, 580, 150, 620);
line(180, 585, 180, 620);
line(210, 587, 210, 620);
line(240, 587, 240, 620);
line(270, 586, 270, 620);
line(300, 585, 300, 620);
line(330, 580, 330, 620);
line(350, 573, 350, 620);
}
}
function mousePressed(){
eye = random(5, 40);
faceW = random (180, 300);
mouthH = random(5, 25);
eyeH = random(305, 320);
tri1 = random(150, 255);
tri2 = random(0, 255);
tri3 = random(0, 255);
mouthOpen = random(0, 4);
color1 = random(0, 255);
}
I had fun sketching this Ghibli character called Kaonashi or “no face”. It was a good exercise for me to learn how mouthPressed function and random() work by changing the size and color using different variables.
Reference photos: