ctv-Project-02-someFaces

ctv-project-02

//Ty Van de Zande
//Section B @ 10:30 AM
//ctv@andrew.cmu.edu
//Project-02



//document variables
var ht = 480;
var wd = 640;
var cenY = ht / 2;
var cenX = wd / 2;



//setting up the document
function setup() {
    createCanvas(wd, ht);
    frameRate(1);
}


function draw() {
background(230);    
    
var r = random(400);

//variables for heads
var headW = random(r);
var headH = random(r);

//variables for eyes
var eyePosX = random(headW);
var eyePosY = random(headH);
var eyeSize = random(50);

//variables for brows
var bPosX = random(r);
var bPosY = random(200);
var bTop = bPosY + random(r);
var bLength = random(r);
var bRot = random(r);

//mouth
var mX = random(r);
var mY = random(r);
var mTop = random(r);
var mBottom = random(r);
    
    ellipseMode(CENTER);
    rectMode(CENTER);
    fill(255);
    noStroke();
    
    //draws head
    ellipse(cenX, cenY, headW, headH);
    
    
    //daws eyes
    fill(100)
    noStroke();
    ellipse(cenX - eyePosX, cenY , eyeSize, eyeSize);
    ellipse(cenX + eyePosX, cenY , eyeSize, eyeSize);
    
    
    //draws mouth
    strokeWeight(5);
    stroke(120,0,0);
    beginShape();
    vertex(cenX-mX, cenY+mY);
    bezierVertex(cenX, cenY-mTop, cenX, cenY-mTop, cenX+mX, cenY+mY );
    bezierVertex(cenX+mX, cenY+mY, cenX, cenY-mBottom, cenX-mX, cenY+mY);
    endShape();
    
    
    //draws eyebrows
    
    p1 = {x: cenX-bLength, y: cenY - bPosY}, 
    p2 = {x: cenX-(bLength/2), y: cenY - bTop}, 
    p3 = {x: cenX, y:cenY - bPosY}
    
    p4 = {x: cenX+bLength, y: cenY - bPosY}, 
    p5 = {x: cenX+(bLength/2), y: cenY - bTop}, 
    p6 = {x: cenX, y:cenY - bPosY}
    
    noFill();
    strokeWeight(2);
    stroke(255, 150, 0);
    curve(p1.x, p1.y, p1.x, p1.y, p2.x, p2.y, p3.x, p3.y);
    curve(p4.x, p4.y, p4.x, p4.y, p5.x, p5.y, p6.x, p6.y);
    

}

For someFaces, I structured each component to act on the center point of the canvas. (Is there a better way to use the center point as a shape starting point?) A random number generator is included in the draw() function, and all of the components generate randos with that local rando as the ceiling. The eyes and head (or sometimes nose) always stays on the centerline of the y-axis. The frameRate() is set to 1 so the image refreshes to show a new face! the eyebrows are pretty crazy.