Yoo Jin Shin-Project-01-Face

Portrait

// Yoo Jin Shin
// Section B
// yoojins@andrew.cmu.edu
// Project-01

function setup() {
    createCanvas(600, 600);
    background("#fff0f2");
    //text("p5.min.js vers 0.5.12 test.", 10, 15);
}

function draw() {
    // hair
    noStroke();
    fill("#362f2d");
    ellipse(300, 300, 400, 540);
    rect(100, 300, 400, 300 )

    // face
    noStroke();
    fill("#ffe1c0");
    ellipse(300, 250, 320, 350);

    // mouth
    stroke('#222222');
    strokeWeight(4);
    arc(300, 300, 130, 140, TWO_PI, PI);

    // ears
    noStroke();
    ellipse(150, 250, 80, 100);

    // earrings
    noStroke();
    fill("#ff9900");
    ellipse(144, 300, 20, 30);
    fill("#cc6600");
    ellipse(144, 300, 20, 20);
    rect(120, 210, 12, 12, 3);
    rect(115, 224, 10, 10, 3);

    // eyes
    noStroke();
    fill('#222222');
    ellipse(230, 240, 70, 77);
    ellipse(370, 240, 70, 77);
    fill(255);
    ellipse(220, 220, 20, 20);
    ellipse(380, 220, 20, 20);

    // eyelashes
    stroke('#222222');
    strokeWeight(2.5);
    line(200, 200, 210, 210);
    line(193, 210, 203, 220);

    // bangs
    noStroke();
    fill("#362f2d");    
    triangle(130, 200, 170, 200, 260, 50);
    triangle(115, 200, 150, 200, 260, 50);

    // shirt
    noStroke();
    fill("#000066");
    arc(300, 600, 370, 280, PI, TWO_PI);

    // neck
    fill("#ffe1c0");
    rect(260, 400, 80, 63);
    triangle(260, 463, 300, 500, 340, 463);

}

It seems like a long journey to get to the point in which coding this portrait with Javascript will be faster than creating it with Photoshop.

Leave a Reply