Author: zk2274

Week 1 Post Zere

  • My concept of the self-portrait assignment is me as a bird. I have seen a lot of videos online with cute birds lately, so this is the first thing that came into my mind. The bird is eyeing the worm, which is a pink oval moving together with the mouse.
  • function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(204,255,255);
  

  fill(102, 255, 255)
 circle(130,280,100);
  
    fill(102, 255, 255)
 circle(270,280,100);
  
  
  circle(180,210,50);
  fill(102,255,255)
  circle(200,320,200);
   fill(102,255,255)
  circle(200,200,150);
  fill (255,204,255);
   fill(255)
  circle(170,190,20);
fill(255)
  circle(225,190,20);
  ;
  fill (250,250,0)
 triangle(200,190,200,210,230,200)

  
  let moveX=constrain((mouseX - width / 2), -4, 4);
  let moveY = constrain((mouseY - height / 2), -4, 4);
  // pupils
fill(0);

// left pupil
circle(170 + moveX, 194 + moveY, 10);

// right pupil
circle(225 + moveX, 194 + moveY, 10);
  
  
  textSize(32);         
  fill(0);               
  text("I am a bird!", 100, 100);
  
   fill(255,255,255)
 circle(200,350,130);
  
  //worm
    fill(255,204,229)
 ellipse(mouseX, mouseY,80,40);

}

     

  • A code that I am proud of is the one that makes the bird’s pupils move alongside the “worm”. I had to look up how to constrain the pupils within the eyes so they would not move all around the canvas:
  • let moveX=constrain((mouseX – width / 2), -4, 4);
    let moveY = constrain((mouseY – height / 2), -4, 4);
    // pupils
    fill(0);// left pupil
    circle(170 + moveX, 194 + moveY, 10);// right pupil
    circle(225 + moveX, 194 + moveY, 10);
  • Embedded sketch: “I am a bird!”
  • “How this was made”: I have created the body of the bird using simple circles. The face of the bird was also created using simple shapes – eyes and pupils are circles, while the beak is a triangle. At first, I had forgotten math, so I had a hard time understanding the coordinates of the triangle, but I figured it out after asking the Professor. We have learned the mouseX,mouseY function in class, so I had the idea to make some sort of an interactive object in the sketch. I decided for it to be a worm since birds like to eat worms. Only the worm moving felt a bit strange, so I decided to make the bird’s pupils move as well. I looked up the constrain function in the Reference page, but had a hard time understanding it, so I used AI to break it down. After I figured it out, I had the bird’s pupils moving.
  • Reflection and ideas for future work or improvements: Use something more complicated than 2D shaped to draw, focus on breaking down the functionality of the code first to fully grasp what each part of the function is responsible for.