Mimi Jiao _ Face Variable Project – Section E

I wanted to play around with very primitive shapes and unrealistic colors to create a robot-like face celebrating its birthday.
sketch

/* 
Mimi Jiao
Section E
wjiao@andrew.cmu.edu
Project-02
Variable Face
*/

//background color
var BGcolor = 200;
var faceWidth = 100;
var faceHeight = 150;
//x-coordinate position of face
var faceX = 100;
//y-coordinate position of face
var faceY = 100;
var faceColor = 200;
//corner roundness for face
var faceTopLeftCorner = 15;
var faceTopRightCorner = 10;
var faceBottomRightCorner = 14;
var faceBottomLeftCorner = 25;
var eyeColor = 140;
var leftEyeLocationX = .20;
var leftEyeLocationY = .3;
var rightEyeLocationX = .61;
var rightEyeLocationY = .50;
var noseColor = 21;
var nosePosition = 20;
var noseHeight = 15;
var noseWidth = 8;
var hatColor = 200;
var hatHeight = 80;
var hatTip = 20;
var mouthColor = 23;
var mouthShape = 15;
var mouthX = 4;
var mouthY = 1.35;
var mouthHeight = 10;
var mouthWidth = 20;
var faceLength = 70;


function setup() {
    createCanvas(480, 640);
    background(255,255,0);
}
 
function draw() {
    background(255,150,BGcolor);

    //face 
    fill(faceColor,180,255);
    noStroke();
    rect(faceX, faceY, faceWidth, faceHeight,
        faceTopLeftCorner,faceTopRightCorner,
        faceBottomRightCorner,faceBottomLeftCorner);

    //eyes
    fill(eyeColor,255,eyeColor);
    ellipse(faceX + faceWidth*leftEyeLocationX, 
        faceY + faceHeight*leftEyeLocationY,
        20, 20);
    ellipse(faceX + faceWidth*rightEyeLocationX,
        faceY + faceWidth*rightEyeLocationY,
        20,20);

    //nose
    fill(255,noseColor,0);
    rect(faceX + faceWidth*leftEyeLocationX + 5,
        faceY + faceHeight*leftEyeLocationY + nosePosition,
        noseWidth,noseHeight, 5, 5, 5, 5);

    //hat
    fill(hatColor,230,hatColor);
    triangle(faceX+faceWidth/2,faceY,faceX+faceWidth,
        faceY+faceHeight/4,
        faceX+ faceWidth, faceY - hatHeight);
    ellipse(faceX + faceWidth, faceY - hatHeight, hatTip,hatTip);

    //mouth
    fill(255,mouthColor,mouthColor);
    rect(faceX + faceWidth/mouthX,
        faceY + faceHeight/mouthY, mouthWidth, mouthHeight,
        mouthShape,mouthShape,mouthShape,mouthShape);

    //body
    fill(hatColor,230,hatColor);
    rect(faceX + faceWidth/2, faceY + faceHeight, 
        faceWidth*1.5,faceHeight*1.75, 20, 20, 20, 20);

    //arms
    fill(hatColor,230,hatColor);
    rect(faceX - faceWidth/3, 
        faceY + faceHeight/.8, 
        faceLength, 30,10,10,10,10);
    rect(faceX + faceWidth/.75, faceY/.8,
     30, faceLength,10,10,10,10);

    //legs
    fill(hatColor,230,hatColor);
    rect(faceX + faceWidth/1.5, 1.7*(faceY + faceHeight),
        30, faceLength*1.3, 10,10,10,10);
    rect(faceX + faceWidth/.8, 1.7*(faceY + faceHeight),
        30, faceLength*1.3, 10,10,10,10);

}
 
function mousePressed() {
    BGcolor = random(0,90);
    faceWidth = random(73,109);
    faceHeight = random(90,132);
    faceX = random(70,150);
    faceY = random(160,200);
    faceColor = random(0,150);
    faceTopLeftCorner = random(5,25);
    faceTopRightCorner = random(10,40);
    faceBottomRightCorner = random(14,30);
    faceBottomLeftCorner = random(25,50);
    eyeColor = random(0,120);
    leftEyeLocationX = random(.22,.35);
    leftEyeLocationY = random(.29,.39);
    rightEyeLocationX = random(.61,.69);
    rightEyeLocationY = random(.40,.50);
    noseColor = random(21,201);
    nosePosition = random(10,30);
    noseHeight = random(5,10);
    noseWidth = random(4,14);
    hatColor = random(0,255);
    hatHeight = random(60,130);
    hatTip = random(10,50);
    mouthColor = random(0,255);
    mouthShape = random(0,15);
    mouthX = random(3.4,6);
    mouthY = random(1.2,1.4);
    mouthHeight = random(5,10);
    mouthWidth = random(5,20);
    faceLength = random(50,90);
}
    




Leave a Reply