Ian Kaneko-Project 02-Variable Face

For this project I did a simple cartoon face that I could exaggerate features on. I experimented a bit with curveVertex’s for the mouth and I think it turned out pretty good. The hardest part about this was deciding what needed to randomized and what I could lock in place.

ikaneko Variable Faces

// Ian Kaneko
// Section D
// ikaneko@andrew.cmu.edu
// Project-02 Variable Face


var headWidth = 250;
var headHeight = 250;
var noseWidth = 80;
var noseHeight = 80;
var noseY = 160 + noseHeight / 2;
var mouthTopLeftX = 175;
var mouthTopLeftY = 260;
var mouthTopRightX = 225;
var mouthTopRightY = 260;
var mouthBottomLeftX = 160;
var mouthBottomLeftY = 300;
var mouthBottomRightX = 240;
var mouthBottomRightY = 300;
var outsideBrowY = 120;
var insideBrowY = 120;


function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(140, 100, 80);
  noStroke();
  
  // Head
  
  fill(200, 230, 250);
  ellipse(200, 200, headWidth, headHeight);
  
  // Mouth
  fill(230, 200, 230);
    
    point(mouthTopLeftX, mouthTopLeftY);
    point(mouthBottomLeftX, mouthBottomLeftY);
    point(mouthTopRightX, mouthTopRightY);
    point(mouthBottomRightX, mouthBottomRightY);
  
  beginShape();
    curveVertex(mouthBottomLeftX, mouthBottomLeftY);
    curveVertex(mouthBottomLeftX, mouthBottomLeftY);
    curveVertex(mouthTopLeftX, mouthTopLeftY);
    curveVertex(mouthTopRightX, mouthTopRightY);
    curveVertex(mouthBottomRightX, mouthBottomRightY);
    curveVertex(mouthBottomRightX, mouthBottomRightY);
  endShape();
  
  // Nose
  
  fill(150, 200, 230);
  ellipse(200, 160 + noseHeight / 2, noseWidth, noseHeight);
  
  // Eyes
  
  fill(130, 100, 150);
  circle(150, 150, 30);
  circle(250, 150, 30);
  
  strokeWeight(7);
  stroke(150, 200, 230);
  line(120, outsideBrowY, 175, insideBrowY);
  line(280, outsideBrowY, 225, insideBrowY);
  
  // Randomize
  
}
function mousePressed() {
  headWidth = random(245, 290);
  headHeight = random(245, 290);
  mouthBottomLeftX = random(150, 180);
  mouthBottomLeftY = random(290, 310);
  mouthBottomRightX = random(230, 250);
  mouthBottomRightY = random(290, 310);
  noseWidth = random(30, 70);
  noseHeight = random(70, 180);
  outsideBrowY = random(100, 140);
  insideBrowY = random(100, 140);
}

Leave a Reply