![[OLD FALL 2017] 15-104 • Introduction to Computing for Creative Practice](../../../../wp-content/uploads/2020/08/stop-banner.png)
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.
//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);
}
