Project 1: My Self Portrait

The most challenging part was figuring out the math for the arc shapes and matching them up to the rest of my face.

sketch
/*
    Joan Lee
    Section D
*/

function setup() {
    createCanvas(300, 400);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
    background(200);

    //hair behind face
    noStroke();
    fill(53, 25, 15);
    rect(65, 100, 170, 300);
    ellipse(70, 260, 70, 350);
    ellipse(230, 260, 70, 350);     //background hair
    ellipse(115, 120, 120, 130);
    ellipse(185, 120, 120, 130);
  
     //body
    fill(223, 205, 230);
    triangle(150, 200, 230, 400, 70, 400);

    //face
    fill(250, 230, 180);
    noStroke();
    quad(75, 100, 225, 100, 230, 230, 70, 230);     //head
    quad(70, 230, 230, 230, 165, 285, 135, 285);    //jaw

    //eyebrows
    stroke(73, 45, 35);
    strokeWeight(5);
    line(171, 150, 206, 152);
    line(94, 152, 129, 150);

    //eyes
    fill(245, 245, 245);
    stroke(0);
    strokeWeight(3);
    arc(110, 180, 35, 25, PI, TWO_PI);
    arc(185, 180, 35, 25, PI, TWO_PI);  //eyeballs and lash line
    fill(63, 35, 11);
    stroke(0);
    strokeWeight(2);
    circle(111, 177, 17);
    circle(184, 177, 17);   //pupils and irises
    fill(255, 225, 215);
    stroke(205, 179, 156);
    strokeWeight(1);
    ellipse(110, 183, 35, 7);
    ellipse(185, 183, 35, 7);   //undereye silkworms

    //nose
    triangle(148, 180, 165, 220, 132, 220);

    //mouth
    stroke(255, 210, 200);  //lips
    strokeWeight(5);
    fill(255);
    arc(148, 233, 70, 50, 0, PI, CHORD);

    //front hair
    stroke(53, 25, 15);
    strokeWeight(1);
    noFill();
    arc(70, 100, 70, 200, TWO_PI, PI - HALF_PI);
    arc(230, 100, 80, 240, PI - HALF_PI, PI);
    arc(240, 100, 150, 190, PI - HALF_PI, PI);
    arc(100, 100, 100, 80, TWO_PI, PI - HALF_PI);
    arc(200, 100, 100, 80, PI - HALF_PI, PI);   //lil baby hairs
    noStroke();
    fill(53, 25, 15);
    arc(60, 95, 110, 170, TWO_PI, PI - HALF_PI);
    arc(230, 100, 80, 170, PI - HALF_PI, PI);   //side bangs
}

Leave a Reply