Shirley Chen-Project-02-Variable-Face

sketch

// Shirley Chen
// Section B
// junfanc@andrew.cmu.edu
// Project-02

var headWidth = 230;
var headHeight = 230;
var eyeSize = 50;
var diff = 1;
var refSize = 0.2;
var angle = 0;
var blushWidth = 40;
var blushHeight = 20;
var color = 139;
var color2 = 98;

function setup() {
    createCanvas(640, 480);
    angleMode = "degree"
}


function draw() {
	background(239, 163, 163);
	fill(255);
	noStroke();
//head
	ellipse(300, 280, headWidth, headHeight);

//ear1
	stroke(183, 105, 105);
	translate(40, 5);
	rotate(angle);
	beginShape();
	curveVertex(220, 200);
	curveVertex(220, 200);
	curveVertex(170, 100);
	curveVertex(200, 100);
	curveVertex(250, 200);
	curveVertex(250, 200);
	endShape();

// //ear2
	beginShape();
	curveVertex(300, 200);
	curveVertex(300, 200);
	curveVertex(340, 100);
	curveVertex(370, 100);
	curveVertex(340, 200);
	curveVertex(340, 200);
	endShape();
	noStroke();
	fill(244, 212, 212);
	beginShape();
	curveVertex(310, 200);
	curveVertex(310, 200);
	curveVertex(330, 150);
	curveVertex(340, 150);
	curveVertex(330, 200);
	curveVertex(330, 200);
	endShape();
	beginShape();
	curveVertex(230, 200);
	curveVertex(230, 200);
	curveVertex(215, 170);
	curveVertex(225, 170);
	curveVertex(240, 200);
	curveVertex(240, 200);
	endShape();

//bowknot
	fill(247, 211, color);
	beginShape();
	curveVertex(240, 210);
	curveVertex(240, 210);
	curveVertex(260, 150);
	curveVertex(280, 150);
	curveVertex(300, 200);
	curveVertex(300, 200);
	endShape();
	beginShape();
	curveVertex(170, 240);
	curveVertex(170, 240);
	curveVertex(170, 180);
	curveVertex(190, 180);
	curveVertex(240, 210);
	curveVertex(240, 210);
	endShape();
	fill(244, 160, 98);
	ellipse(235, 205, 20, 20);

//eyes
	fill(0);
	ellipse(250, 280, eyeSize * diff, eyeSize * diff);
	ellipse(350, 280, eyeSize * diff, eyeSize * diff);
	fill(255);
	ellipse(250 + diff, 280, eyeSize * refSize, eyeSize * refSize);
	ellipse(350 + diff, 280, eyeSize * refSize, eyeSize * refSize);
	ellipse(260 + diff, 280, eyeSize * refSize, eyeSize * refSize + 5);
	ellipse(360 + diff, 280, eyeSize * refSize, eyeSize * refSize + 5);

//nose
	fill(225, 105, 105);
	triangle(290, 300, 310, 300, 300, 310);

//mouth
	fill(242, 85, 85);
	ellipse(300, 330, 30, 30);
	stroke(196, 138, 138);
	strokeWeight(4);
	fill(255);
	beginShape();
	curveVertex(260, 320);
	curveVertex(260, 320);
	curveVertex(270, 330);
	curveVertex(290, 330);
	curveVertex(300, 310);
	curveVertex(300, 310);
	endShape()
	beginShape();
	curveVertex(300, 310);
	curveVertex(300, 310);
	curveVertex(310, 330);
	curveVertex(330, 330);
	curveVertex(340, 320);
	curveVertex(340, 320);
	endShape()

//blush
	fill(244, 212, 212);
	noStroke();
	ellipse(230, 330, blushWidth, blushHeight);
	ellipse(370, 330, blushWidth, blushHeight);
}

//mouse pressed
function mousePressed() {
    headWidth = random(220, 250);
    headHeight = random(220, 250);
    eyeSize = random(35, 40);
    diff = random(1, 2);
    refSize = random(0.2, 0.4);
    angle = random(0, 0.2);
    blushWidth = random(30, 40);
    blushHeight = random(20, 40);
    color = random(139, 255);
}

For this project, I drew a rabbit face with variation of ears, eyes, blush, and the bow knot. For the ears, I rotate them at various angles, and I also keep the eyes and bow knot moving with the ears so the proportion looks correct. The eye size changes randomly with the reflection in the eyes. The bow knot’s color also change randomly. The blush size also changes, too. I enjoyed this project, it was fun! 🙂