Shariq M. Shah – Self Portrait01

Using basic geometric shapes and a subtle color palette, this exercise allowed me to explore different ways of arranging shapes in p5.js. Although the image looks simple, the functions that allow it to look minimal and composed will have uses in more complex programs.

shariqs_Portrait

// Shariq M. Shah
// Section C
// shariqs@andrew.cmu.edu
// Assignment_01


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

function draw() {
  background(230, 211, 211);
  noStroke()

  fill(250, 200, 0)
  ellipse(300,600,600,300)

  strokeWeight(2)
  rect(220, 400, 150, 150, 15)

  //Face
  fill(200, 162, 132)
  rect(170, 180, 250, 250, 30, 100, 150, 150)

  fill(0,0,0)

  ellipse(300,180, 250, 150)
  rect(150, 180, 300, 80,30)

  //Left Spec
  noFill()
  stroke(300)
  ellipse(240, 290, 60, 60)
  ellipse(240, 290, 55, 55)


  //Left Eye
  stroke(300)
  fill(300)
  ellipse(240, 290, 30, 20)
  fill(0)
  ellipse(240, 290, 15, 20)
  ellipse(240, 285, 2, 2)


  //Right Eye
  stroke(300)
  fill(300)
  ellipse(340, 290, 30, 20)
  fill(0)
  ellipse(340, 290, 15, 20)
  ellipse(340, 285, 2, 2)

  line(175, 180, 425, 180)

  //Right Spec
  noFill()
  stroke(300)
  ellipse(340, 290, 60, 60)
  ellipse(340, 290, 55, 55)

  line(310,290, 270, 290)
  line(310,285, 270, 285)

  line(210,285, 170, 280)
  line(210,290, 170, 280)


  line(370,285, 420, 280)
  line(370,290, 420, 280)

  //Nose
  noStroke()
  fill(240, 171, 142)
  triangle(290, 300, 290, 340, 310, 360)
  fill(214, 171, 139)
  triangle(290, 300, 290, 340, 270, 360)

//Mouth
	fill (300);

	ellipse (290, 382, 70, 42);
	fill (200, 162, 132);

	rect (250, 360, 89, 21);

    ellipse(425,300, 20, 80)
    ellipse(165,300, 20, 80)


  fill(300)



  //Logo
  bezier(105, 20, 10, 10, 90, 90, 15, 80)

  //Collar
  bezier(220, 460, 300, 650, 150, 650, 370, 460)



}