Project-02: Variable Faces

Since I did not use the environmental variables to write my function, it took me a while at first to rewrite parts of my code. Then I re-define some variables by using the var …=random(num1, num2) to approach to the final generative faces. It is frustrating during the process when debugging it, but I feel super proud of myself when I finally get my code working. 
siyunw-Generative faces
var eyeSize = 10;
var faceWidth = 100;
var faceHeight = 150;
var hairWidth =350;
var hairHeight =350;
var neckWidth = width / 2;
var neckHeight= 4*neckWidth / 3;
var mouthSize= 40;
var mouthHeight = 30;
var backgroundR=250;
var backgroundG=150;
var backgroundB=100;

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

function draw() {
    background(backgroundR,backgroundG,backgroundB);

    fill(255,204,153);
    circle((width-hairWidth) / 2,height / 2,50);  
    circle(width-(width-hairWidth) / 2,height / 2,50);//ears

    fill(255,153,51);
    ellipse(width / 2, height / 2, hairWidth, hairHeight);
    rect((width-hairWidth) / 2,(height / 2),hairWidth,4*(hairHeight / 2) / 3);//face
    
    var eyeLX = width / 2 - faceWidth * 0.15;
    var eyeRX = width / 2 + faceWidth * 0.15;
    fill(0);
    ellipse(eyeLX, height / 2, eyeSize, eyeSize);
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);//eyes


    fill(0);
    ellipse(width/2,3*height / 4,mouthSize,mouthHeight);
    //mouse

}

function mousePressed() {
    // when the user clicks, these variables are reassigned
    // to random values within specified ranges. For example,
    // 'faceWidth' gets a random value between 75 and 150.
    backgroundR=random(200,300);
    backgroundG=random(100,200);
    backgroundB=random(50,150);
    faceWidth = random(75, 150);
    faceHeight = random(100, 200);
    eyeSize = random(10, 30);
    hairWidth = random(300,400)
    hairHeight = random(300,400);
    neckWidth = random(150,250);
    mouthSize = random(35,80);
    mouthHeight = random(25,70);
}

Leave a Reply