Category: Project-01-Face

Min Ji Kim Kim – Project 01 – Face

sketch

/*
Min Ji Kim Kim
Section A
mkimkim@andrew.cmu.edu
Project-01
*/

function setup() {
    createCanvas(600,600);
    background(103,186,178);
}

function draw() {
    noStroke();
    //hair
    fill(60,36,36);
    rect(152,90,285,400,150,150,0,0);
    
    //shirt
    fill(255);
    rect(170,470,250,107,50,50,0,0);

    //neck
    fill(225,175,160);
    rect(266,400,65,105,30);

    //head
    fill(235,190,180);
    rect(170,130,250,315,200);

    //nose
    fill(190,130,120);
    ellipse(300,320,4,20);

    //mouth
    fill(250,137,143);
    arc(310,350,100,135,0,HALF_PI+QUARTER_PI,CHORD);

    //glasses
    fill(90,0,24);
    ellipse(250,260,75,70);
    ellipse(350,260,75,70);

    fill(235,190,180);
    ellipse(250,260,65,60);
    ellipse(350,260,65,60);

    //glasses bridge
    fill(90,0,24);
    rect(287,255,26,8);

    //eyes
    fill(0);
    ellipse(255,260,10,18);
    fill(0);
    ellipse(345,260,10,18);

    //eyebrows
    fill(60,36,36);
    triangle(210,215,225,205,287,215);
    triangle(312,215,375,205,390,215);

    //bangs
    fill(60,36,36);
    arc(320,151,170,70,0,PI+QUARTER_PI,OPEN);
    arc(154,119,180,220,0,HALF_PI,OPEN);
    }

This was my first time coding anything and although it was challenging at first, I had fun discovering how different shapes and colors came together to make this self portrait. I particularly learned about the importance of layering elements in the right order. 

Xiaoyu Kang – Project 01 – Face


I was trying to draw my face in a cartoon-like style, so I used a lot of vibrant and saturated colors. I also used a combination of circular shapes to represent my face and hair, and some other shapes to represent the other features on my face such as nose and lips.

 

 

sketch

//Xiaoyu Kang
//Section B
//xkang@andrew.cmu.edu
//Project-01

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

function draw() {
    fill(255,235,83);
    rect(0,0,600,600);
//background
    noStroke();
    fill(255,154,157);
    circle(300,290,530,530);
//hair
    noStroke();
    fill(74,38,0);
    ellipse(300,250,350,400);
    fill(74,38,0);
    rect(125,250,350,200);
//face
    noStroke();
    fill(255,206,157);
    ellipse(300,250,250,280);
//glasses
    noStroke();
    fill("grey");
    rect(200,210,70,50);
    fill("grey");
    rect(330,210,70,50);
    fill("grey");
    rect(280,230,40,5);
//face
    noStroke();
    fill(255,206,157);
    rect(205,215,60,40);
    fill(255,206,157);
    rect(335,215,60,40);
//eyes
    noStroke();
    fill("black");
    circle(240,235,20,20);
    fill("black");
    circle(360,235,20,20);
    fill("white");
    circle(245,235,5,5);
    fill("white");
    circle(365,235,5,5);
//ears
    noStroke();
    fill(255,206,157);
    ellipse(170,250,60,80);
    fill(255,206,157);
    ellipse(430,250,60,80);
//hair
    noStroke();
    fill(74,38,0);
    rect(210,190,60,10);
    fill(74,38,0);
    rect(330,190,60,10);
//nose
    noStroke();
    fill(255,175,107);
    triangle(285, 280, 315, 280, 300, 300);
//blush
    noStroke();
    fill(255,156,141);
    circle(230,310,55,55);
    fill(255,156,141);
    circle(370,310,55,55);
//lips
    noStroke();
    fill("brown");
    rect(270,330,60,15);
//neck
    noStroke();
    fill(255,206,157);
    rect(260,370,80,80);
//cloth
    noStroke();
    fill(134,51,43);
    rect(240,420,120,60);
    fill(134,51,43);
    ellipse(300,560,400,200);
    fill(134,51,43);
    rect(100,560,400,200);
    fill(74,0,0);
    rect(150,560,15,40);
    fill(74,0,0);
    rect(440,560,15,40);
//hair
    noStroke();
    fill(74,38,0);
    ellipse(220,130,80,100);
    fill(74,38,0);
    ellipse(170,180,61,80);
    fill(74,38,0);
    ellipse(260,100,60,80);
    fill(74,38,0);
    ellipse(380,130,80,100);
    fill(74,38,0);
    ellipse(430,180,61,80);
    fill(74,38,0);
    ellipse(340,100,60,80);
    fill(74,38,0);
    ellipse(130,370,80,160);
    fill(74,38,0);
    ellipse(470,370,80,160);
    fill(74,38,0);
    ellipse(125,280,30,70);
    fill(74,38,0);
    ellipse(475,280,30,70);
}

Ammar Hassonjee – Project 01 – Face

ammars-portrait

// Ammar Hassonjee
// Section C
// ahassonj@andrew.cmu.edu
// Project-01

function setup() {
    createCanvas(600, 600);
    background(200);
}

function draw() {
  //Drawing my shirt
    stroke('navy');
    fill('navy');
    if (mouseX < width / 2) {
        fill('black');
    }
    arc(300, 600, 500, 275, PI, 0);

    //Making the neck
    stroke('rgb(205, 161, 132)');
    fill('rgb(205, 161, 132)');
    quad(217, 470, 244, 400, 348, 400, 374, 470);
    ellipse(295, 470, 155, 60);

    //Forming the head
    stroke('rgb(215, 165, 132)');
    fill('rgb(215, 165, 132)');
    ellipse(300, 280, 250, 300);

    //Creating the Hair
    stroke('black');
    fill('black');
    beginShape()
    vertex(186, 215);
    vertex(198, 153);
    vertex(201, 161);
    vertex(242, 107);
    vertex(242, 127);
    vertex(313, 90);
    vertex(303, 111);
    vertex(377, 100);
    vertex(351, 117);
    vertex(427, 118);
    vertex(406, 140);
    vertex(452, 126);
    vertex(439, 157);
    vertex(461, 156);
    vertex(444, 185);
    vertex(454, 187);
    vertex(414, 215);
    endShape();

    //forming the ears
    stroke('rgb(215, 165, 132)');
    fill('rgb(215, 165, 132)');
    beginShape();
    vertex(180, 258);
    vertex(161, 260);
    vertex(151, 267);
    vertex(165, 326);
    vertex(180, 326);
    endShape();

    beginShape();
    vertex(419, 258);
    vertex(437, 260);
    vertex(447, 267);
    vertex(433, 326);
    vertex(326, 326);
    endShape();

    //creating the eyes
    noStroke();
    fill('white');
    ellipse(256, 266, 40, 30);
    ellipse(346, 266, 40, 30);

    noStroke();
    fill('rgb(132, 100, 80)');
    if (mouseIsPressed) {
      fill('rgb(220, 5, 5)');
    }
    ellipse(256, 266, 20, 20);
    ellipse(346, 266, 20, 20);

    noStroke();
    fill('white')
    ellipse(250, 263, 5, 5);
    ellipse(340, 263, 5, 5);

    //shaping the mouth
    stroke('rgb(229, 229, 229)');
    fill('rgb(229, 229, 229)');
    triangle(263, 377, 300, 388, 338, 377);

    // forming the nose
    stroke(132, 100, 80);
    strokeWeight(2);
    line(300, 281, 314, 338);
    line(314, 338, 318, 345);
    line(318, 345, 304, 350);

    //eyebrows
    noStroke();
    fill('black');
    triangle(226, 239, 277, 241, 278, 235);
    triangle(324, 242, 324, 236, 375, 238);
}

My process for completing this portrait began with experimenting with the different functions of ps.j5 and learning how the variables controlled shapes like ellipses and curves. I then began to digitally sketch the kind of drawing I wanted and then used the same coordinates in other softwares to code accurate shapes.

Bo Yang-Project-01-Face

In the beginning, I want to draw a little girl with fringe. However, I’m not a good painter. It is more like a cartoon here. And I love the two colors I made it.

Bo-sketch

/*
    Bo Yang
    byang2@andrew.cmu.edu
    Section A
    This program draws a self portrait.
*/

function setup() {
    createCanvas(300, 300);
}

function draw() {
    background(180,60,80);
    if (mouseX < (width / 2)) {
        background(60, 100, 150);
    }
  
    //body
    line(180, 180, 225, 300); 
    line(120,180,75,300);
  
    //face
    fill(255,200,200);
    ellipse(150, 150, 120, 100); {
      
    //left eye
    fill(0);
    noFill();
    strokeWeight(7.0);
    strokeCap(ROUND);
    beginShape();
    curveVertex(100, 250);
    curveVertex(135, 150);
    curveVertex(115, 150);
    curveVertex(143, 250);
    endShape();
      
    //right eye
    strokeJoin(MITER);
    beginShape();
    vertex(180, 135);
    vertex(170, 143);
    vertex(180, 150);
    endShape();
      
    //nose
    point(150, 160);
      
    //mouth
    fill(255, 0, 0);
    arc(150, 175, 15, 25, 0, PI, CHORD);
      
    //hair
    noFill()
    arc(150, 150, 160, 180, 84, 76, OPEN);
    line(185, 190, 215, 201);
    line(95, 210, 109, 192);
      
    //earring
    fill(255, 204, 0);
    triangle(80, 155, 99, 155, 91, 176);
    triangle(205, 155, 224, 155, 215, 176);
      
    //headwear
    ellipseMode(RADIUS); 
    fill(180, 200, 50); 
    ellipse(200, 90, 28, 28); 

    ellipseMode(CENTER); 
    fill(255, 204, 0); 
    ellipse(200, 90, 25, 25); 
  }
}

Raymond Pai: Project-01-Face

A self-portrait made using mostly 2D primitives. I played with the shapes on Illustrator before approaching it on p5.js. I was surprised by what felt like limitations of the medium, which I eventually liked more than my initial drawing.

Brainstorming on Illustrator

Round boi

RaymondPai-Project-01

function setup() {
    createCanvas(600, 650);
}

function draw() {
    background(260, 200, 0);
//EARS
    strokeWeight(10)
    fill(250, 200, 140);
    arc(100, 370, 180, 180,
        1, PI + HALF_PI, OPEN);
    strokeWeight(10)
    fill(250, 200, 140);
    arc(500, 370, 180, 180,
        4, PI , OPEN);
//HAIR1
    strokeWeight(0);
    fill(0);
    ellipse(200, 270, 300, 300);
// HEAD
    strokeWeight(10);
    fill(250, 200, 140);
    ellipse(300, 350, 485, 500);
//EYES
    strokeWeight(0);
    fill(255);
    ellipse(200, 300, 120, 160)

    strokeWeight(0)
    fill(255);
    ellipse(400, 300, 120, 160)
//PUPILS
    strokeWeight(0);
    fill(0);
    ellipse(220, 300, 70, 90)

    strokeWeight(0)
    fill(0);
    ellipse(380, 300, 70, 90)
//MOUTH
    strokeWeight(16)
    fill(250, 200, 140);
    arc(300, 350, 400, 400,
    1, PI, OPEN);
    ///return long lines ^ (for readability)
//NOSE
    strokeWeight(10);
    fill(255, 190, 130);
    ellipse(300, 420, 100, 70)
//EYEBROWS
    strokeWeight(25)
    line(140, 230, 250, 210);

    strokeWeight(25)
    line(400, 180, 500, 200);
//ACCESSORIES
    strokeWeight(0);
    fill(100, 100, 100);
    rect(40, 420, 20, 50);

    strokeWeight(0);
    fill(100, 100, 100);
    rect(540, 420, 20, 50);
//HAIR
    strokeWeight(10)
    fill(0);
    arc(300, 330, 520, 520,
    4, PI + PI, OPEN);
}

Katrina Hu – Project 01 – Face

I enjoyed playing with various shapes and colors throughout this project. At times, the process was slightly tedious, but overall it was a fun and informative learning experience.

Project-01-Face

function setup() {
    createCanvas(600, 600);
    background(255, 229, 244);
}

function draw() {
    //hair
        fill(0, 0, 0);
        ellipse(300, 300, 250); //top of hair
        rect(175, 300, 250, 200, 0, 0, 30, 30); //bottom of hair
    //neck
        fill(255, 229, 196);
        rect(280, 390, 40, 50);
    //face
        fill(255, 229, 196);
        ellipse(300, 300, 200); //face shape
    //facial features
        //eyes
            fill(255, 255, 255);
            ellipse(255, 290, 30); //white of left eye
            ellipse(345, 290, 30); //white of right eye
            fill(0, 0, 0);
            ellipse(255, 290, 17); //left pupil
            ellipse(345, 290, 17); //right pupil
        //mouth
            fill(0, 0, 0);
            arc(300, 350, 50, 50, 0, PI, CHORD);
    //body
        fill(200, 229, 247);
        rect(210, 430, 175, 200, 60, 60, 0, 0);


}

Claire Lee – Project 01 – Face

This project was definitely a learning experience for me. I realized that it’s a lot more difficult for me to translate the image I want to create to the canvas when I’m using code as a medium instead of a program like Photoshop or Illustrator. It took a lot of little adjustments, but I’m happy with how it came out and I think I learned a lot.

project01_face

function setup() {
    createCanvas(600, 600);
    background(255, 208, 223);

    noStroke();
    fill(50,30,30);
    rect(150,300,300,250,0,0,50,50); 
    //hair base

    noStroke();
    fill(50,30,30);
    ellipse(300,300,300,300);
    //top of hair

    stroke(150);
    strokeWeight(2);
    fill(200);
    ellipse(300,600,300,350);
    //body

    stroke(246, 193, 161);
    strokeWeight(2);
    fill(255,229,196);
    rect(260,380,80,100,0,0,40,40);
    //neck

    stroke(246, 193, 161);
    strokeWeight(2);
    fill(255,229,196);
    ellipse(430,330,38,38);
    //right ear

    stroke(246, 193, 161);
    strokeWeight(2);
    fill(255,229,196);
    ellipse(170,330,38,38);
    //left ear

    stroke(246, 193, 161);
    strokeWeight(2);
    fill(255,229,196); 
    ellipse(300,300,250,250);
    //base for face
  
    noStroke();
    fill(0);
    ellipse(360,320,20,20);
    //left eye

    noStroke();
    fill(0);
    ellipse(240,320,20,20);
    //right eye

    noStroke();
    fill(238,125,77);
    triangle(300,330,280,350,320,350);
    //nose
    
    noStroke();
    fill(215, 59, 62);
    ellipse(300,380,75,50);
    //mouth (part one) 
    //I tried to draw an arc but that didn't work

    noStroke();
    fill(255,229,196);
    rect(250,355,90,25);
    //mouth (part two), improvised

    stroke(0);
    strokeWeight(2);
    noFill();
    ellipse(230,320,95,90);
    //glasses (right)

    stroke(0);
    strokeWeight(2);
    noFill();
    ellipse(370,320,95,90);
    //glasses (left)

    line(280,318,320,318); 
    //glasses(middle)

    line(174,298,184,308);
    //glasses(frame left)

    line(416,308,426,298);
    //glasses(frame right)

    noStroke();
    fill(50,30,30);
    rotate(PI/5); 
    //question: why does ellipse move locations when being rotated?
    ellipse(420,-20,200,90); 
    //right side bangs

    noStroke();
    fill(50,30,30);
    rotate(46);
    ellipse(-105,-302,130,50);
    //left side bangs

}

Ankitha Vasudev – Project 01 – Self Portrait

(Press on portrait to change background)

sketch

// Ankitha Vasudev
// Section B 
// ankithav@andrew.cmu.edu
// Project-01-Face
 
function setup() {
    createCanvas(600, 600);
}

function draw() {
    noStroke();

    //background squares 
	background(255, 218, 255);
    fill(255, 180, 255);
    rect(10, 10, 580, 580);
    fill(213, 231, 255);
    rect(20, 20, 560, 560);
    rect(30, 30, 500, 500);

    //background color change 
  if (mouseIsPressed) {
    if (mouseButton === LEFT) {
      fill(172, 220, 255);
      rect(0, 0, 600, 600);
      fill(255, 220, 255);
      rect(10, 10, 580, 580);
      fill(182, 234, 255);
      rect(20, 20, 560, 560);
    }
}

    //hair
    fill(1);
    rect(210, 180, 212, 240, 200, 200, 15, 20);
    fill(60, 0, 0);
    rect(220, 190, 190, 215, 150, 150, 15, 20);

    //shoulders
    fill(255, 180, 255);
    rect(180, 428, 260, 185, 20);
    triangle(160, 600, 180, 450, 180, 600);
    triangle(440, 600, 440, 450, 460, 600);
    fill(189, 190, 255);
    arc(310, 428, 60, 60, 0, PI, OPEN);
    stroke(189, 190, 255);
    strokeWeight(3);
    line(220, 470, 200, 600);
    line(400, 470, 415, 600);

    //neck
    noStroke();
    fill(123, 77, 0);
    rect(290, 370, 40, 75, 100);

    //ears
    ellipse(231, 305, 18, 30);
    fill(96, 68, 0);
    ellipse(232, 305, 14, 18);
    fill(237, 239, 122);
    ellipse(231, 320, 7, 7);

    //face
    fill(123, 77, 0);
    rect(233, 205, 150, 200, 100);

    //eyes
    fill(255);
    arc(270, 290, 30, 30, PI, 0, OPEN);
    arc(343, 290, 30, 30, PI, 0, OPEN);
    fill(0);
    ellipse(270, 284, 15, 15);
    ellipse(343, 284, 15, 15);

    //left eyebrow 
    beginShape();
    vertex(252, 268);
    vertex(264, 265);
    vertex(290, 267);
    vertex(292, 263);
    vertex(262, 262);
    endShape(CLOSE);

    //right eyebrow 
    beginShape();
    vertex(323, 263);
    vertex(351, 262);
    vertex(363, 268);
    vertex(352, 265);
    vertex(325, 267);
    endShape(CLOSE);

    //glasses
    stroke(115, 0, 113);
    strokeWeight(3);
    noFill();
    rect(250, 270, 40, 30, 5, 5, 90, 90);
    rect(323, 270, 40, 30, 5, 5, 90, 90);
    line(290, 280, 323, 280);
    line(234, 272, 251, 272);
    line(361, 272, 382, 272);

    //nose
    stroke(0);
    strokeWeight(2);
    line(310, 310, 300, 335);
    line(300, 339, 310, 338);

    //mouth
    fill(60, 0, 0);
    quad(290, 365, 325, 365, 315, 372, 292, 374);
}

I tried to experiment with multiple shapes and commands using a very animated style of drawing. I wanted to include features that were specific to me; these include my purple-frame glasses and my brown and black hair. Lastly, I used a palette comprising of my favorite colors (pastel shades of blue and pink) for the background and used the mouseIsPressed command to alter the background color. 

Jai Sawkar – Project 01 – Self Portrait

Click to Change My Wardrobe

Portrait_Jai

//Jai Sawkar
//Section C
//jsawkar@andrew.cmu.edu
//Project-01


var b = 0;

function setup() {
    createCanvas(400, 450);
}

function draw() {

    rectMode(CENTER)
    ellipseMode(CENTER)
    angleMode(DEGREES)
    noStroke();
    background("#ccb0a7");

//Body
  
    fill(b);
    rect(201.7, 431.9, 268.2, 35.7);
    ellipse(123.7, 346.8, 113.2, 199.4);
    ellipse(281.1, 344.3, 113.2, 199.4);
    rect(202.4, 384.3, 270.2, 60.3);
    rect(202.5, 431.9, 270.1, 50.7);
    ellipse(205.4, 272.1, 220.2, 87.2);
    rect(201.6, 338.7, 74.9, 76.4);

//face
  
    fill(167, 136, 105);
    ellipse(202.3, 239.9, 76.3, 22.3);
    quad(164.6, 237.7, 240.8, 239.6, 231.9, 201.8, 172.1, 198.6);
    ellipse(162.1, 114.9, 34.1, 117.1);
    ellipse(248.5, 116.2, 34.5, 113.2);

//shadow
  
    fill(99, 95, 85);
    ellipse(216.4, 226.9, 40.2, 9.2);
    quad(172.4, 200.8, 196.2, 226.9, 236.5, 226.9, 233.2, 206.6);

//Face Infront of Shadow
  
    fill(167, 136, 105);
    ellipse(205.9, 133.1, 117.3, 165.3);

//hair
  
    fill(41, 35, 17);
    quad(143.9, 118.2, 147.0, 115.5, 147.9, 107.8, 143.7, 109.9);
    ellipse(146.1, 89.7, 6.9, 52.4);
    ellipse(179.8, 65.9, 69.3, 27.3);
    quad(266.3, 121.1, 263.6, 119.2, 261.8, 111.7, 265.7, 111.8);
    ellipse(190.1, 76.4, 89.4, 25.5);
    ellipse(199.6, 64.4, 80.4, 27.3);
    ellipse(223.7, 68, 69.3, 27.3);
    ellipse(231.8, 66.1, 69.3, 27.3);
    ellipse(262.9, 87.0, 6.9, 52.3);
    ellipse(264.4, 87.9, 6.9, 52.3);

}

function mousePressed() {
  
    b = random(0, 255)
  
}

I aimed to create a slightly abstract self-portrait that added a little flair. I began by using a series of shapes to create the body, and then mostly ellipses to create the rest of the face, and finally, used a variable to change my shirt color on each click.

Jasmine Lee – Project 01 – Face

selfportrait

//Jasmine Lee
//Section C
//jasmine4@andrew.cmu.edu
//Project-01-Face

function setup () {
	createCanvas(600, 600);
    background (180, 150, 210);
    angleMode(DEGREES);


    //reflection
    strokeWeight(0);
    fill(190, 250, 255);
    quad(420, 90, 410, 280, 330, 275, 345, 85);
    quad(420+95, 90+6, 410+95, 280+6, 330+95, 
    	 275+6, 345+95, 85+6);
    quad(420-12, 90+210, 410-12, 280+210, 330-12, 
    	 275+210, 345-12, 85+210);
    quad(420-12+95, 90+210+6, 410-12+95, 280+210+6, 
    	 330-12+95, 275+210+6, 345-12+95, 85+210+6);


    //hair-leftback
    strokeWeight(0);
    fill(50, 40, 35);
    triangle(170, 275, 178, 480, 120, 470);

    //hair-rightback
    strokeWeight(0);
    fill(50, 40, 35);
    triangle(330, 275, 368, 470, 290, 480);

    //body
    strokeWeight(0);
    fill(255, 198, 0);
    rect(143, 400, 200, 300, 50);

    //arm-lines
    strokeWeight(1.5);
    stroke(222, 190, 136);
    line(175, 475, 155, 600);
    line(310, 475, 330, 600);

    //neck
    strokeWeight(0);
    fill(253, 231, 187)
    ellipse(247, 425, 80, 55);

    //neck-shadow
    strokeWeight(0);
    fill(222, 190, 136)
    ellipse(247, 425, 80, 45);

    //head
    strokeWeight(0);
 	fill(253, 231, 187);
    rect(160, 240, 172, 190, 77);

    //lefteye
    strokeWeight(0);
    fill(255, 255, 255);
    ellipse(200, 350, 41, 30);

    //righteye
    strokeWeight(0);
    fill(255, 255, 255);
    ellipse(290, 350, 41, 30);

    //leftpupil
    strokeWeight(0);
    fill(0,0,0);
    ellipse(200, 350, 25, 28);

    //rightpupil
    strokeWeight(0);
    fill(0,0,0);
    ellipse(290, 350, 25, 28);

     //leftpupilshine
    strokeWeight(0);
    fill(255, 255, 255);
    ellipse(205, 339, 5, 5);

    //rightpupilshine
    strokeWeight(0);
    fill(255, 255, 255);
    ellipse(295, 339, 5, 5);

    //leftblush
    strokeWeight(0);
    fill(250, 180, 160);
    ellipse(185, 380, 30, 30);

    //rightblush
    strokeWeight(0);
    fill(250, 180, 160);
    ellipse(305, 380, 30, 30);

    //noseshadow
    strokeWeight(0);
    fill(222, 190, 136);
    triangle(235, 370, 245, 375, 255, 370);

    //lips
    strokeWeight(0);
    fill(255, 170, 150);
    ellipse(245, 394, 30, 10);

    //mouth-line
    strokeWeight(1);
    stroke(150, 140, 100);
    noFill();
    arc(245, 389, 40, 12, 14, 167);

    //hair
    strokeWeight(4);
    stroke(50, 40, 35);
    fill(50, 40, 35);
    arc(247, 305, 180, 175, 180, 360);

    //hair-left
    strokeWeight(4);
    stroke(50, 40, 35);
    noFill();
    arc(44, 335, 300, 330, 340, 30);
    strokeWeight(25);
    stroke(50, 40, 35);
    noFill();
    line(167, 300, 167, 490);

    //hair-right
    strokeWeight(20);
    stroke(50, 40, 35);
    noFill();
    line(329, 300, 326, 490);

    //hair-bangs
    strokeWeight(0);
    fill(50, 40, 35);
    arc(157, 285, 150, 100, 360, 90);
    arc(335, 285, 230, 100, 90, 180);

    //hair-barrette
    strokeWeight(0);
    fill(105, 255, 255);
    rect(155, 333, 25, 5);

    //eyebrows
    strokeWeight(3.5);
    stroke(0);
    noFill();
    arc(200, 360, 70, 70, 220, 295);
    arc(290, 360, 70, 70, 240, 315);
}

Doing this portrait was an interesting process. Since it was drawn using the computer, the process was a bit tedious because of the lack of direct translation from hand to “paper.” It was also a little tricky figuring out the coordinates for some of the shapes I wanted to draw, as well as the angles of the curves. I decided to try out a more cartoon-like style that is suitable with flat shapes and colors.