Recitation 6: Animated Post

Step 1

To draw the eye, I learned to use the BezierVertex function. After multiple attempts to find the right value for the handle, I finally succeed in creating an ellipse that was good enough for an orbit. 

Step 2

Using the parameters of x & y and the nested for loop, I successfully fill the canvas with my eyes.

Step 3

For some reason, my computer’s screen recording function isn’t working, so I only took a video of how it worked. I use the mousePressed function to change the color and create a flashing effect. 

Here’s the full code:

void setup() {
  size(1024, 768);
  background(185, 90, 64);
}

void draw() {

  for(float i = 0; i < 100; i++) { 
    for(float m = 0; m < 100; m = m + 2 ) {
      //eye(i*110+60, 50);
      eye(i*110+60, m*50);
  }
  }
    
}

void eye(float eyeX, float eyeY) {
   noStroke();
  fill(151, 250, 249);
  beginShape();
  vertex(eyeX-50, eyeY);
  bezierVertex(eyeX-50, eyeY-50, eyeX+50, eyeY-50, eyeX+50, eyeY);
  bezierVertex(eyeX+50, eyeY+50, eyeX-50, eyeY+50, eyeX-50, eyeY);
  endShape();

  //fill(0);
  //circle(eyeX, eyeY, 50);
  if(mousePressed && (mouseButton == LEFT)){
  fill(random(0, 255), random(0, 255), random(0, 255));
  }
  circle(eyeX, eyeY, 50);
  fill(255);
  circle(eyeX+10, eyeY-10, 20);
}

 

And here’s the video: