Author: lee

lee chu – project 02 – variable face

lrchu

// lee chu
// section c
// lrchu@andrew.cmu.edu
// project - 02

var eyeSize = 20;
var eyeColor = 24;
var mouthWidth = 20;
var faceR = 60;
var faceH = 120;
var hairH = 20;
var R = 229;
var browL = 12;
var browT = 0;

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

function draw() {
    background(color(R, 208, 227));
    fill(color(231, 229, 229));

    // head
    strokeWeight(0.7);
    beginShape();
    curveVertex(width/2 - 1.05 * faceR, 1.05 * height/2);
    curveVertex(width/2 - 1.05 * faceR, 1.05 * height/2);
    curveVertex(width/2 - faceR, height/2);
    curveVertex(width/2 - 0.8 * faceR, height/2 - 0.3 * faceH);
    curveVertex(width/2 - 0.3 * faceR, height/2 - 0.5 * faceH);
    curveVertex(width/2 + 0.3 * faceR, height/2 - 0.5 * faceH);
    curveVertex(width/2 + 0.8 * faceR, height/2 - 0.3 * faceH);
    curveVertex(width/2 + faceR, height/2);
    curveVertex(width/2 + 1.05 * faceR, 1.05 * height/2);
    curveVertex(width/2 + 1.05 * faceR, 1.05 * height/2);
    endShape();

    // cheeks
    beginShape();
    curveVertex(width/2 + 1.05 * faceR, 1.05 * height/2);
    curveVertex(width/2 + 1.05 * faceR, 1.05 * height/2);
    curveVertex(width/2 + 1.1 * faceR, 1.14 * height/2);
    curveVertex(width/2 + faceR, 1.2 * height/2);
    curveVertex(width/2 + 0.7 * faceR, 1.25 * height/2);
    curveVertex(width/2 + 0.35 * faceR, 1.28 * height/2);
    curveVertex(width/2 - 0.35 * faceR, 1.28 * height/2);
    curveVertex(width/2 - 0.7 * faceR, 1.25 * height/2);
    curveVertex(width/2 - faceR, 1.2 * height/2);
    curveVertex(width/2 - 1.1 * faceR, 1.14 * height/2);
    curveVertex(width/2 - 1.05 * faceR, 1.05 * height/2);
    curveVertex(width/2 - 1.05 * faceR, 1.05 * height/2);
    endShape();

    // eyes
    var eyeRX = width/2 + faceR * 0.5;
    var eyeLX = width/2 - faceR * 0.5;
    var eyeRH = height/2 + 0.05 * faceH;
    var eyeLH = height/2;
    strokeWeight(0);
    fill('black');
    ellipse(eyeRX, eyeRH, eyeSize, 0.9 * eyeSize);
    ellipse(eyeLX, eyeLH, eyeSize, 0.9 * eyeSize);
    fill(color(184, 24, eyeColor));
    ellipse(eyeRX, eyeRH + 0.1 * eyeSize, 0.8 * eyeSize, 0.7 * eyeSize);
    ellipse(eyeLX, eyeLH + 0.1 * eyeSize, 0.8 * eyeSize, 0.7 * eyeSize);
    fill('white');
    ellipse(eyeRX + 0.25 * eyeSize, eyeRH - 0.2 * eyeSize, 0.3 * eyeSize, 0.25 * eyeSize);
    ellipse(eyeLX + 0.25 * eyeSize, eyeLH - 0.2 * eyeSize, 0.3 * eyeSize, 0.25 * eyeSize);

    // eyebrows
    strokeWeight(0.7);
    beginShape();
    curveVertex(eyeRX - 0.5 * browL, eyeRH - 0.75 * eyeSize - browT);
    curveVertex(eyeRX - 0.5 * browL, eyeRH - 0.75 * eyeSize - browT);
    curveVertex(eyeRX, eyeRH - 0.85 * eyeSize);
    curveVertex(eyeRX + 0.5 * browL, eyeRH - 0.75 * eyeSize + browT);
    curveVertex(eyeRX + 0.5 * browL, eyeRH - 0.75 * eyeSize + browT);
    endShape();
    beginShape();
    curveVertex(eyeLX - 0.5 * browL, eyeLH - 0.75 * eyeSize + browT);
    curveVertex(eyeLX - 0.5 * browL, eyeLH - 0.75 * eyeSize + browT);
    curveVertex(eyeLX, eyeLH - 0.85 * eyeSize);
    curveVertex(eyeLX + 0.5 * browL, eyeLH - 0.75 * eyeSize - browT);
    curveVertex(eyeLX + 0.5 * browL, eyeLH - 0.75 * eyeSize - browT);
    endShape();

    // mouth
    strokeWeight(0);
    fill('gray');
    beginShape();
    curveVertex(width/2 - 0.5 * mouthWidth, height/2 + 0.2 * faceH);
    curveVertex(width/2 - 0.5 * mouthWidth, height/2 + 0.2 * faceH);
    curveVertex(width/2 - 0.3 * mouthWidth, height/2 + 0.15 * faceH);
    curveVertex(width/2 + 0.3 * mouthWidth, height/2 + 0.15 * faceH);
    curveVertex(width/2 + 0.5 * mouthWidth, height/2 + 0.2 * faceH);
    curveVertex(width/2 + 0.4 * mouthWidth, height/2 + 0.22 * faceH);
    curveVertex(width/2 + 0.4 * mouthWidth, height/2 + 0.22 * faceH);
    endShape();

    // hair
    strokeWeight(0.5);
    noFill();
    beginShape();
    curveVertex(width/2, height/2 - 0.45 * faceH);
    curveVertex(width/2, height/2 - 0.45 * faceH);
    curveVertex(width/2 - 0.1 * faceH, height/2 - 0.5 * faceH - 0.85 * hairH);
    curveVertex(width/2 - 0.2 * faceH, height/2 - 0.5 * faceH - hairH);
    curveVertex(width/2 - 0.2 * faceH, height/2 - 0.5 * faceH - hairH);
    endShape();

}

function mousePressed() {
    R = random(180, 255);
    faceR = random(30, 85);
    faceH = random(80, 170);
    eyeSize = random(8, 30);
    eyeColor = random(0, 255);
    mouthWidth = random(10, 40);
    hairH = random(10, 90);
    browT = random(-3, 3);
    browL = random(5, 14);
}

I experimented with curveVertex() to create a blob-like face with variable pupils, mouth, eyebrows, and hair.

lee chu – looking outwards 01

The Pardall Tunnel, at UC Santa Barbara, had originally been an ordinary central passageway into Isla Vista, the main housing area for SB students. A tragedy in 2014 ended in the death of six SB students, and a year later as tribute to the lives lost, the tunnel lit up blue.

The tunnel now has LED strips lining its length, as well as motion sensors which trigger the lights as pedestrians and bikes make their way in and out of campus. Kim Yasuda, an art professor at SB, along with Marcos Novak of the Media Arts and Technology program were behind this project which now not only brings meaning, but also entertainment and excitement to a mundane trek to school. I had recently been to the Pardall Tunnel, and the lights seem to have only white LEDs and could benefit from a hardware upgrade.

source and extra info c:

lee chu – project 01 – face

lrchu-face

// Lee Chu
// section c
// face-01


function setup() {
    createCanvas(600, 600);
    background(127);

    // blue ribbons
    fill('cyan');
    strokeWeight(0);
    rect(10, 0, 80, 600);
    rect(110, 0, 80, 600);
    rect(210, 0, 80, 600);
    rect(310, 0, 80, 600);
    rect(410, 0, 80, 600);
    rect(510, 0, 80, 600);

    // orange ribbons
    fill('orange');
    rect(0, 10, 600, 80);
    rect(0, 110, 600, 80);
    rect(0, 210, 600, 80);
    rect(0, 310, 600, 80);
    rect(0, 410, 600, 80);
    rect(0, 510, 600, 80);

    // cyan fillers
    fill('cyan');
    rect(110, 10, 80, 80);
    rect(310, 10, 80, 80);
    rect(510, 10, 80, 80);
    rect(10, 110, 80, 80);
    rect(210, 110, 80, 80);
    rect(410, 110, 80, 80);
    rect(110, 210, 80, 80);
    rect(310, 210, 80, 80);
    rect(510, 210, 80, 80);
    rect(10, 310, 80, 80);
    rect(210, 310, 80, 80);
    rect(410, 310, 80, 80);
    rect(110, 410, 80, 80);
    rect(310, 410, 80, 80);
    rect(510, 410, 80, 80);
    rect(10, 510, 80, 80);
    rect(210, 510, 80, 80);
    rect(410, 510, 80, 80);

    // circles
    fill('white');
    ellipse(0, 0, 20, 20);
    ellipse(100, 0, 20, 20);
    ellipse(200, 0, 20, 20);
    ellipse(300, 0, 20, 20);
    ellipse(400, 0, 20, 20);
    ellipse(500, 0, 20, 20);
    ellipse(600, 0, 20, 20);
    ellipse(0, 100, 20, 20);
    ellipse(100, 100, 20, 20);
    ellipse(200, 100, 20, 20);
    ellipse(300, 100, 20, 20);
    ellipse(400, 100, 20, 20);
    ellipse(500, 100, 20, 20);
    ellipse(600, 100, 20, 20);
    ellipse(0, 200, 20, 20);
    ellipse(100, 200, 20, 20);
    ellipse(200, 200, 20, 20);
    ellipse(300, 200, 20, 20);
    ellipse(400, 200, 20, 20);
    ellipse(500, 200, 20, 20);
    ellipse(600, 200, 20, 20);
    ellipse(0, 300, 20, 20);
    ellipse(100, 300, 20, 20);
    ellipse(200, 300, 20, 20);
    ellipse(300, 300, 20, 20);
    ellipse(400, 300, 20, 20);
    ellipse(500, 300, 20, 20);
    ellipse(600, 300, 20, 20);
    ellipse(0, 400, 20, 20);
    ellipse(100, 400, 20, 20);
    ellipse(200, 400, 20, 20);
    ellipse(300, 400, 20, 20);
    ellipse(400, 400, 20, 20);
    ellipse(500, 400, 20, 20);
    ellipse(600, 400, 20, 20);
    ellipse(0, 500, 20, 20);
    ellipse(100, 500, 20, 20);
    ellipse(200, 500, 20, 20);
    ellipse(300, 500, 20, 20);
    ellipse(400, 500, 20, 20);
    ellipse(500, 500, 20, 20);
    ellipse(600, 500, 20, 20);
    ellipse(0, 600, 20, 20);
    ellipse(100, 600, 20, 20);
    ellipse(200, 600, 20, 20);
    ellipse(300, 600, 20, 20);
    ellipse(400, 600, 20, 20);
    ellipse(500, 600, 20, 20);
    ellipse(600, 600, 20, 20);

    //dish
    fill(color(255, 255, 213));
    strokeWeight(1);
    ellipse(300, 420, 225, 60);
    noFill();
    strokeWeight(.5);
    ellipse(300, 420, 160, 35);
}

function draw() {
    // face
    strokeWeight(1);
    fill('white');
    ellipse(300, 300, 200, 250);
    
    // eyes
    fill('black');
    ellipse(260, 300, 15, 15);
    ellipse(340, 300, 15, 15);

    // eyebrows
    beginShape();
    vertex(270, 270);
    vertex(275, 280);
    vertex(250, 270);
    endShape();
    beginShape();
    vertex(330, 270);
    vertex(325, 280);
    vertex(350, 270);
    endShape();

    // mouth
    noFill();
    strokeWeight(2.5);
    arc(290, 310, 20, 20, 0, PI);
    arc(310, 310, 20, 20, 0, PI);

    // blush
    fill(color(255, 218, 255));
    strokeWeight(0);
    ellipse(360, 325, 40, 20);
    ellipse(240, 325, 40, 20);
}

egg