Month: August 2019

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.

Claire Yoon- Project 01- Self Portrait


Claire-face

I really enjoyed creating a self portrait despite it being my first time properly coding something. It was a challenge to create the shapes at first but after a while I gained more familiarity with coding shapes.

//Claire Yoon Section E
//claireyo@andrew.cmu.edu
//Assignment-01*/

function setup() {
    createCanvas(600, 600);
    background( 255, 249, 235)
    noStroke();

    //back hair
    fill(21, 21, 53);
    ellipse(300, 300, 250, 250);

    fill(21, 21, 53);
    ellipse(300, 400, 280, 300);

    //clothes

    fill(174,223,229);
    ellipse(300, 547, 280, 150);

    fill(174,223,229);
    rect(160, 543, 280, 250);

    //ears
    fill(245, 219, 214);
    ellipse(200, 355, 30, 40);

    fill(245, 219, 214);
    ellipse(395, 355, 30, 40);

    //neck
    fill(245, 219, 214);
    rect(270, 440, 60, 50);

    fill(245, 219, 214);
    ellipse(300, 490, 61, 47);

    //skin
    fill(252, 227, 222);
    rect(200, 270, 200, 80);

    fill(252, 227, 222);
    ellipse(300, 350, 200, 200);

    //hair
    translate (265,250);
    fill(21, 21, 53);
    rotate (2.65);
    ellipse (0, 0, 200, 110);
    rotate (-2.65);
  	translate (-265,-250);

    translate (373,280);
    fill(21, 21, 53);
    rotate (-2.1);
    ellipse (0, 0, 170, 70);
    rotate (2.1);
    translate (-373,-280);

    //eyebrows
    fill(34, 34, 86);
    ellipse(260, 320, 30, 5);

    fill(34, 34, 86);
    ellipse(335, 320, 30, 5);

    //eyes
    //white part
    fill(255,255,245);
    ellipse(260, 337, 17, 17);

    //iris
    fill(255,255,245);
    ellipse(335, 337, 17, 17);

    fill(0);
    ellipse(260, 340, 15, 15);

    fill(0);
    ellipse(335, 340, 15, 15);

    //nose
    fill(251,214,205);
    ellipse(300, 375, 20, 20);

    fill(251,214,205);
    ellipse(300, 375, 20, 20);

    //skin
    fill(252, 227, 222);
    ellipse(300, 370, 24, 20);

    //lips
    fill(248,136,119);
    ellipse(300, 406, 33, 20);

    fill(252, 227, 222);
    rect(283, 394, 60, 10);

    noLoop();
    }

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

Jamie Park – Project – 01

sketch

//Jamie Park           jiminp@andrew.cmu.edu
//15-104        Section E         Project #1

function setup(){
    createCanvas(400,500);
    background(50,53,74);
    noStroke();

    fill(217,240,255);
    rect(100,360,200,170,50);

    fill(238,204,186);
    rect(177,300,50,100,50);
    fill(255,229,202);
    ellipse(200,230,200,230);
    fill(255,229,202);
    ellipse(105,265,25,40);
    ellipse(297,265,25,40);

    fill(57,24,9);
    arc(200, 230, 210, 232, PI, TWO_PI);
    ellipse(200,107,70,60);
    triangle(134,245,143,235,178,245);
    triangle(225,245,260,235,269,245);

    fill(247,215,216);
    ellipse(258,285,33,30);
    ellipse(143,285,33,30);

    fill(242,111,63);
    arc(200, 290, 70, 70, TWO_PI, PI);

    fill(250);
    ellipse(160,260,25,25);
    ellipse(240,260,25,25);
    fill(0);
    ellipse(160,260,15,15);
    ellipse(240,260,15,15);

    fill(36,201,152);
    rect(102,280,7,9,10);
    rect(292,280,7,9,10)
}

This was my first time creating a visual via coding, and it was so much harder than I anticipated. Although it would be lying to say that I was not frustrated with the process, I still had a lot of fun. I also got to appreciate the programmers of Photoshop and Illustrator.

Lauren Park-Project-01: Face

sketch

function setup() {
    createCanvas(400, 410);
    background(color(113,185,199));
  
  
    noStroke();
    fill(115, 222, 210);
    rect(0, 250, 400, 400);
  
    fill(207, 146, 39);
    ellipse(110, 380, 70, 30);//feet
    ellipse(270, 380, 70, 30);
  
  
    fill(255, 223, 62); //wings
    ellipse(50, 240, 60, 100);
  
  
    fill(255, 223, 62);
    ellipse(340, 240, 60, 100);

    fill(255, 235, 62);
    ellipse(195, 200, 300, 310);
  
    fill(250, 195, 31);
    ellipse(145, 162, 60, 50);
  
    fill(250, 195, 31);
    ellipse(240, 162, 60, 50);  
  
    ellipseMode(CORNER);
    fill(255);
    ellipse(115, 132, 60, 50);
  
    ellipseMode(CORNERS);
    fill(30);
    ellipse(130, 130, 165, 165);
 
    ellipseMode(RADIUS)
    fill(255);
    ellipse(240, 157, 30, 26);
  
    ellipseMode(CENTER);
    fill(30);
    ellipse(227, 155, 37, 37);
  
    fill(255);
    strokeWeight(4); 
    ellipse(237, 150, 10, 10);

    fill(255);
    ellipse(145, 135, 10, 10);
  
    fill(255, 140, 3);
    ellipse(190, 210, 90, 30);
  
    fill(255, 172, 202);//blush
    ellipse(280, 190, 20, 20);
 
    ellipse(110, 187, 20, 20);
  
    fill(255, 235, 208);
    ellipse(195, 310, 130, 90);
  
  
    fill(163, 207, 54);
    arc(72, 78, 70, 70, 0, HALF_PI);
    arc(95, 83, 70, 70, 0, HALF_PI);
    fill(163, 207, 54);
    arc(120, 86, 70, 70, 0, HALF_PI); 
    fill(163, 207, 54);
    arc(143, 89, 70, 70, 0, HALF_PI);
    arc(166, 89, 70, 70, 0, HALF_PI);
    arc(189, 89, 70, 70, 0, HALF_PI);
    arc(215, 86, 70, 70, 0, HALF_PI);
    arc(238, 86, 70, 70, 0, HALF_PI);
    arc(261, 83, 70, 70, 0, HALF_PI);
    arc(284, 78, 70, 70, 0, HALF_PI);
    arc(112, 80, 80, 80, PI, PI + QUARTER_PI);
    arc(280, 83, 80, 80, PI + QUARTER_PI, TWO_PI);
  
    arc(250, 85, 90, 90, PI + QUARTER_PI, TWO_PI);
    arc(250, 100, 100, 100, PI + QUARTER_PI, TWO_PI);
    arc(210, 95, 110, 110, PI + QUARTER_PI, TWO_PI);
    arc(227, 95, 110, 110, PI + QUARTER_PI, TWO_PI);
    arc(190, 95, 110, 110, PI + QUARTER_PI, TWO_PI);
    arc(170, 95, 110, 110, PI + QUARTER_PI, TWO_PI);
    arc(150, 95, 110, 110, PI + QUARTER_PI, TWO_PI);
    arc(130, 95, 110, 110, PI + QUARTER_PI, TWO_PI);
    arc(117, 95, 110, 110, PI + QUARTER_PI, TWO_PI);
  
    arc(85, 60, 70, 70, HALF_PI, PI);
    arc(99, 41, 77, 77, HALF_PI, PI);
    arc(103, 41, 77, 77, HALF_PI, PI);
    arc(277, 42, 77, 77, HALF_PI, PI);
    arc(75, 80, 50, 50, HALF_PI, PI);
  
    ellipse(330, 80, 70, 10);
  
    fill(207, 146, 39);
    rect(250, 335, 15, 50, 20);
    rect(120, 335, 15, 50, 20);
  

}

It was a challenge to try and create shapes for my piece and try to adjust their placements, while adding more color and different elements throughout the project. I created a duck face, which was inspired by the idea that people have certain expressions and behaviors that remind me of certain visual characteristics. And so for this project, by using different elements, I made a self-portrait of myself that I believe visually represented certain characteristics of my face when I make an expression.

Danny-Face


I tried to imitate a character called “Bao” from a short film with a lot of curve vertexes, and other elements. I also added an interactive feature to add to the cuteness.

Danny-Face


let value1x = 193;
let value1y = 250;
let value2x = 190;
let value2y = 265;
let value3x = 187;
let value3y = 250;



function setup() {
  createCanvas(400, 400);
  background(227, 114, 124);
}

function draw(){
	fill(177, 204, 234)
	strokeWeight(0)
	ellipse(200, 410, 460, 300)
	//body
	fill(248, 235, 230);
	strokeWeight(0);
	beginShape();
	curveVertex(200, 200);	//top
	curveVertex(200, 200);
	curveVertex(175, 230);
	curveVertex(150, 270); 	//left handle
	curveVertex(125, 280);
	curveVertex(120, 285);
	curveVertex(135, 300);
	curveVertex(160, 288);
	curveVertex(200, 290);	//lowest point
	curveVertex(240, 288);
	curveVertex(265, 300);
	curveVertex(280, 285);
	curveVertex(275, 280);
	curveVertex(250, 270);	//right handle
	curveVertex(225, 230);
	curveVertex(200, 200);
	curveVertex(200, 200);
	endShape();
	//face
	fill(248, 235, 230);
	strokeWeight(0);
	beginShape();
	curveVertex(200, 100);
	curveVertex(200, 100);
	curveVertex(180, 135);
	curveVertex(125, 170);
	curveVertex(120, 200);
	curveVertex(200, 220); //low tip
	curveVertex(280, 200);
	curveVertex(275, 170);
	curveVertex(220, 135);
	curveVertex(200, 100);
	curveVertex(200, 100);
	endShape();
	//left eye
	fill(40)
	circle(170, 175, 20)
	//left eye shine
	fill(248, 222, 126);
	strokeWeight(0);
	beginShape();
	curveVertex(180,175); //right point
	curveVertex(180,175);
	curveVertex(173,178);
	curveVertex(170,185); // lowest point
	curveVertex(167,178);
	curveVertex(160,175);
	curveVertex(167,172);
	curveVertex(170,165);
	curveVertex(173,172);
	curveVertex(180, 175);
	curveVertex(180, 175); //top point
	endShape();
	//right eye
	fill(40)
	circle(230, 175, 20)
	//right eye shine
	fill(248, 222, 126);
	strokeWeight(0);
	beginShape();
	curveVertex(240,175); //right point
	curveVertex(240,175);
	curveVertex(233,178);
	curveVertex(230,185); // lowest point
	curveVertex(227,178);
	curveVertex(220,175);
	curveVertex(227,172);
	curveVertex(230,165);
	curveVertex(233,172);
	curveVertex(240, 175);
	curveVertex(240, 175); //top point
	endShape();
	//mouth
	fill(248, 235, 230);
	strokeWeight(1);
	circle(192.5, 200, 15);
	fill(248, 235, 230);
	strokeWeight(1);
	circle(207.5, 200, 15);
	//coverup
	fill(248, 235, 230);
	strokeWeight(0);
	rect(170, 190, 60, 10);

	//blush
	fill(247, 134, 144)
	strokeWeight(0)
	circle(140, 190, 24)
	fill(247, 134, 144)
	strokeWeight(0)
	circle(260, 190, 24)

	//left arm
	fill(248, 235, 230);
	stroke(140)
	strokeWeight(1);
	beginShape();
	curveVertex(value1x, value1y);
	curveVertex(value1x, value1y);
	curveVertex(value2x, value2y);
	curveVertex(value3x, value3y);
	curveVertex(value3x, value3y);
	endShape();
	//right arm	fill(248, 235, 230);
	stroke(140)
	strokeWeight(1);
	beginShape();
	curveVertex(207, 250);
	curveVertex(207, 250);
	curveVertex(210, 265);
	curveVertex(213, 250);
	curveVertex(213, 250);
	endShape();
}

function mouseClicked() {
  if (value2y === 265) {
    value2y = 230;
  } else {
    value2y = 265;
  }
}

Monica Chang- Project 1 – Face

sketch

/* 
 * Monica Chang
 * Section E
 * mjchang@andrew.cmu.edu
 * Assignment 1 Self-Portrait
 */
 
function setup() {
	
    createCanvas(600, 600);
    background(220);
    //background
    fill("yellow");
    noStroke(0);
   	rect(0,0,600,600);

   	//hair
   	fill("brown")
   	rect(180,150,240,300)
   	//head	+ neck
   	fill("tan");
   	noStroke(0);
   	ellipse(300,200,200,210);

   	fill("tan");
   	rect(280,300,40,50)
   	//hat
   	fill("black");
   	quad(150,150,230,100,370,100,450,150);
   	fill("black");
   	rect(230,10,140,100);
   	//eyes
   	fill("black");
   	triangle(240,200,260,180,280,200);
   	fill("black");
   	triangle(320,200,340,180,360,200);

   	fill("white");
   	ellipse(260,200,10,10);
   	fill("white");
   	ellipse(340,200,10,10);
   	//nose
   	fill("brown");
   	ellipse(300,230,20,10);
   	//mouth
   	fill("pink");
   	stroke(10);
   	ellipse(300,275,40,30);
   	//blush
   	fill("orange")
   	noStroke(0);
   	ellipse(250,230,40,30);
   	fill("orange")
   	noStroke(0);
   	ellipse(350,230,40,30);
   	//shirt
   	fill("purple");
   	quad(0,600,140,350,470,350,600,600);
   	//vneck
   	fill("tan");
   	triangle(250,350,300,450,350,350);

}

function draw() {
}

I had fun playing around with the sizes and shapes that we were able to utilize in this project. As an artist, I also wanted to incorporate the color scheme I would always gravitate towards through the struggle of trying to calculate how the shapes would be computed. The face was what I had the most fun with as I tried to draw the famous “pikachu meme” I love very much onto my face. Also, I added a bucket hat I have been wearing recently.

Angela Lee – Project 01 – Face

angela-face

/* 
 * Angela Lee
 * Section E
 * ahl2@andrew.cmu.edu
 * Assignment 1 Self-Portrait
 */


function setup(){
    createCanvas (600, 600);
    background (249, 217, 217);
    noStroke();
    
    // hair behind the shoulders
    fill (40, 27, 5);
    rect (129, 216, 325, 361);

    // shirt
    fill (239, 223, 223);
    ellipse (287.5, 652, 413, 342);

    // hair at the top of the head
    fill (40, 27, 5);
    ellipse (290.5, 235, 329, 342);

    // neck
    fill (206, 162, 132);
    rect (215, 365, 151, 128);
    ellipse (144.864, 293.5, 46.271, 79);

    // left hoop earring
    noFill();
    stroke (186, 146, 56);
    strokeWeight (12);
    ellipse (144.5, 347.5, 51, 51);

    // left earing stud
    noStroke();
    fill (216, 176, 97);
    ellipse (144.5, 314.5, 13, 13);

    // right hoop earring
    noFill();
    stroke (186, 146, 56);
    strokeWeight (12);
    ellipse (423.5, 353.5, 51, 51);

    // face
    noStroke();
    fill (224, 186, 153);
    ellipse (291.5, 280.5, 295, 333);

    // right eye
    fill ("black")
    ellipse (362.571, 284.571, 33.143, 33.143);
    triangle (378, 278.286, 363.143, 268, 386, 268);

    // right eyebrow
    rectMode (CENTER);
    translate (351.346, 237.903);
    rotate (6.21);
    fill (58, 45, 32);
    rect (0, 0, 53, 9);
    rotate (-6.21);
    translate (-351.346, -237.903);

    // hair surrounding the upper left area of the face
    translate (202.207, 163.026);
    fill (40, 27, 5);
    rotate (2.4);
    ellipse (0, 0, 176.657, 32.935);
    rotate (-2.4);
    translate (-202.207, -163.026);

    // hair on the right area of the face
    quad (256.801, 118.331, 454, 365, 453, 206, 335, 85);

    // left eye
    fill ("black")
    ellipse (217.429, 280.571, 33.143, 33.143);
    triangle (202, 274.286, 216.857, 264, 194, 264);

    // left eyebrow
    rectMode (CENTER);
    translate (220.483, 237.903);
    rotate (-6.21);
    fill (58, 45, 32);
    rect (0, 0, 53, 9);
    rotate (6.21);
    translate (-220.483, -237.903);
    triangle (194.364, 231.555, 196.263, 240.371, 172.596, 244.129);

    // nose
    fill (214, 171, 139);
    triangle (288.7, 278, 306, 341.9, 271.4, 341.9);
    ellipse (288.692, 343.42, 34.615, 19.16);

    // mouth
    rectMode (CORNER);
    fill (124, 53, 53);
    ellipse (288.762, 384, 67.524, 42);
    fill (224, 186, 153);
    rect (246, 360, 89, 21);

    // hair in front of the shoulders
    fill (40, 27, 5);
    rect (129, 432, 86, 200);

    // rounded collar of the shirt
    fill (206, 162, 132);
    ellipse (290.5, 493, 151, 80);
}

I really enjoyed playing with some of the details in this self-portrait; for example, I always put half of my hair in front of my shoulders and the other half behind my back. While the process was a bit tedious because I had some coding errors, doing it one shape at a time definitely allowed me to fix those mistakes efficiently.

Joanne Chui – Project 01 – Face

selfportrait

// Joanne Chui
// Section C
// jchui1@andrew.cmu.edu
// Assignment-01

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

function draw() {

	//BACK HAIR
	fill(0);
	rect(250, 225, 100, 220);

	//NECK
	fill(190, 150, 90);
	rect(270, 350, 60, 40);
	fill(0);
	ellipse(270, 370, 10, 50);
	ellipse(330, 370, 10, 50);
	ellipse(280, 410, 20, 10);

	//FACE
	fill(226, 183, 108);
	stroke(226, 183, 108);
	ellipse(300, 295, 115, 130);

	//MOUTH
	fill("white");
	stroke(164, 110, 97);
	arc(300, 332, 30, 15, 0, PI, CHORD);

	//EYES
	//left
	fill("white");
	stroke("white");
	arc(274, 285, 20, 6, 0, PI, CHORD);
	stroke("black");
	arc(274, 285, 20, 12, PI, PI + PI, OPEN);
	fill(64, 40, 34);
	ellipse(274, 283.5, 9, 9);
	fill(0);
	ellipse(274, 283.5, 5, 5);
	//right
	fill("white");
	stroke("white");
	arc(326, 285, 20, 6, 0, PI, CHORD);
	stroke("black");
	arc(326, 285, 20, 12, PI, PI + PI, OPEN);
	fill(64, 40, 34);
	ellipse(326, 283.5, 9, 9);
	fill(0);
	ellipse(326, 283.5, 5, 5);

	//NOSE
	stroke(200, 145, 90);
	fill(226, 183, 108);
	arc(300, 315, 15, 8, 0, PI, OPEN);
	arc(290, 300, 15, 40, TWO_PI - QUARTER_PI, QUARTER_PI, OPEN);

	//EYEBROWS
	//left
	fill(0);
	arc(276, 272, 40, 15, PI, TWO_PI - QUARTER_PI, OPEN);
	//right
	arc(319, 274, 50, 18, PI + QUARTER_PI, TWO_PI, OPEN);

	//SHIRT
	fill(255, 204, 229);
	stroke(255, 204, 229);
	arc(300, 450, 200, 140, PI, 0, CHORD);
	fill(190, 150, 90); //neck
	stroke(190, 150, 90);
	ellipse(300, 380, 49, 30);

	//HAIR
	fill(0);
	stroke(0);
	arc(290, 255, 120, 100, PI, TWO_PI - QUARTER_PI, CHORD); //left part
	arc(325, 255, 75, 80, PI + QUARTER_PI, TWO_PI, CHORD); //right part
	arc(253, 345, 70, 230, HALF_PI, PI + HALF_PI, CHORD);
	arc(347, 345, 50, 230, PI + HALF_PI, HALF_PI, CHORD);





}

While creating my self portrait, I wanted to avoid making the face look really geometric. The flexibility of the arc function allowed me to achieve that.