Project 2 – Portrait Variables

For my project, I chose to make very cartoonish but expression filled “blumans”. These little characters are portraits that change face shape, expression, and proportions based on the code below.

csavitzv_02
    //Cole Savitz-Vogel
    //Section A

    //Variability includes, Face Hight and Width, Eye Size, Eye Seperation, Eyebrow Position, Pupil Proportions, Mouth Size, Mouth Position, Smile Ratio, Skin Tone 

var eyeSize = 20;
var faceWidth = 100;
var faceHeight = 100;
var eyeWidth = .25
var mouthSize = 50;
var mouthDrop = 0;
var smile = 5;
var inBrow = 0;
var outBrow = 0;
var skinR = 200;
var skinG = 200;
var skinB = 250;

 
function setup() {
    createCanvas(640, 480);
}
 

function draw() {
    background(255);
    fill(skinR,skinG,skinB)
    strokeWeight(0);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);
    fill(0);
    var mouth = width / 2 + faceWidth;
    arc(width / 2, (height / 2)+mouthDrop, mouthSize, mouthSize, 0, PI, OPEN);
    fill(skinR,skinG,skinB)
    arc(width / 2, (height / 2) + mouthDrop - 1, mouthSize - 1, mouthSize - smile, 0, PI, OPEN);
    var eyeLX = width / 2 - faceWidth * eyeWidth;
    var eyeRX = width / 2 + faceWidth * eyeWidth;
    fill(250);
    ellipse(eyeLX, height / 2, eyeSize + 4);
    ellipse(eyeRX, height / 2, eyeSize + 4);
    fill(0);
    ellipse(eyeLX, height / 2, eyeSize - 2);
    ellipse(eyeRX, height / 2, eyeSize - 2);
    strokeWeight(10);
    line(eyeLX - inBrow, (height / 2) - 20, eyeLX + 20,(height / 2)- outBrow);
    line(eyeRX + inBrow, (height / 2) - 20, eyeRX - 20,(height / 2)- outBrow);
}
 
function mousePressed() {
    faceWidth = random(100, 150);
    faceHeight = random(100, 160);
    eyeSize = random(10, 30);
    eyeWidth = random(.2,.6);
    mouthSize = random(30,70);
    mouthDrop = random(0,40);
    smile = random(.1,50);
    inBrow = random(10,25);
    outBrow = random(10,25);
    skinR = random(100, 200);
    skinG = random(100, 200);
    skinB = random(200, 250);
    
}

Leave a Reply