katieche – project 02 variable face

katieche-02

// Katie Chen
// 9:30 AM Class
// katieche@andrew.cmu.edu
// Assignment-02

var eyeSize = 20;
var earWidth = 50;
var earHeight = 55;
var headHeight = 200;
var headWidth = 220;
var ewSize = 30;
var cSize = 25;
var ccSize = 25;
var x = 6;
var y = 4;
var v = 6;
var z = 5;

 
function setup() {
    createCanvas(480, 640);
}
 
function draw() {
    background(207, 228, 247);

    // head
    strokeWeight(0);
    stroke(250);
    strokeCap(ROUND);
    fill (250);
    beginShape();
    	// top right
		curveVertex(headWidth/2, headHeight);
		// top left
		curveVertex(headWidth*2, headHeight);
		// bottom right
		curveVertex(headWidth*2, headHeight*2);
		// bottom left 
		curveVertex(headWidth/2, headHeight*2);
	endShape(CLOSE);

	// ears
    fill (250);
    var earL = width / 2 - headWidth * 0.25;
    var earR = width / 2 + headWidth * 0.25;
    ellipse(earL, headHeight, earWidth, earHeight);
    ellipse(earR, headHeight, earWidth, earHeight);

    // cheeks
    fill (255, 221, 211);
    noStroke();
    var cL = width / 2 - headWidth * 0.25 - 10;
    var cR = width / 2 + headWidth * 0.25 + 10;
    var dist = 25
    ellipse(cL, height / 2 + dist, cSize, cSize);
    ellipse(cR, height / 2 + dist, ccSize, ccSize);
    
    // eyes
    fill (250);
    strokeWeight(1);
    stroke (0);
    var ewL = width / 2 - headWidth * 0.25;
    var ewR = width / 2 + headWidth * 0.25;
    ellipse(ewL, height / 2, ewSize, ewSize);
    ellipse(ewR, height / 2, ewSize, ewSize);
    fill (0);
    var eL = width / 2 - headWidth * 0.25;
    var eR = width / 2 + headWidth * 0.25;
    ellipse(eL, height / 2, eyeSize, eyeSize);
    ellipse(eR, height / 2, eyeSize, eyeSize);

    // left eyebrow
    stroke (0);
    strokeWeight(y);
	strokeCap(ROUND);
    line(eL - 7, 290+x, eL +7, 290+y);

	// right eyebrow
    strokeWeight(y);
	strokeCap(ROUND);
    line (eR - 7, 290+v, eR +7, 290+z);


}
 
function mousePressed() {
    headWidth = random(150, 250);
    headHeight = random(200, 300);
    eyeSize = random(10, 30);
    cSize = random(20, 40);
    ewSize = random(20, 40);
    earWidth = random(15, 75);
    earHeight = random(55, 120);
    dist = random(20, 30);
    ccSize = random(20, 40);
    x = random(0, 10);
    y = random(0, 10);
    v = random(0, 10);
    z = random(0, 10);
}

I started the project with the template and shapes that I felt more comfortable playing around with (ellipses, lines, rectangles, etc.), before trying new shapes. For me, the body was the hardest to construct since I tried curveVertex(); for the first time, and even now, it doesn’t necessarily look the way I intended it to (it kind of just looks like a marshmallow now which I guess I’m also okay with). A lot of my project did come from happy accidents (i.e I was trying to make cheeks but ended up making ears, etc.) which I thought was fun, but it’d also be neat to eventually be confident enough in coding that I can actually make what I intend to make.

In terms of planning, I didn’t do anything much last project so I decided I’d try to make something in illustrator first (as seen below) this time and then recreate it with code. Unfortunately after a string of accidental shapes and still not being able to understand how to make curves, I ended up just kind of making everything on a whim for my final!

Leave a Reply