Recitation 6

I learned some new functions from examples such as making the ellipse move and leave track (which will disappear later) by constantly overlaying a big rectangle filled with background color, and letting the ellipse “bounce” to change its direction. Also, I tried to use some new code like “angle” and “translate” rotate” to make an eye that is “looking” at the mouse. It’s surprising that I can add some mathematical symbols into the code like “arctan” sin” cos”.

The poster:

The code:

float beginX = 0;
float endX = 1024;
float distX;
float x = 0;
float y = 0;
float step = 0.015;
float c = 0.0;
int i = 0;
float angle=0.0;

int rad = 60;
float xpos, ypos;

float xspeed = 10.0;
float yspeed = 10.0;

int xdirection = 1;
int ydirection = 1;
PFont myFont;

void setup() {
  size(1024, 768);
  background(0);
  distX = endX - beginX;
  xpos = random(0, width);
  ypos = 700;

  String[] fontList = PFont.list();
  printArray(fontList);
  myFont = createFont("BMJUAOTF", 32);
  textFont(myFont);
}

void draw() {

  noStroke();
  fill(0, 15);
  rect(0, 0, width, height);

  c += step;
  x = beginX + (c * distX);
  y = 1024 - (c * distX);

  xpos = xpos + ( xspeed * xdirection );
  ypos = ypos + ( yspeed * ydirection );

  if (xpos > width-rad || xpos < rad) {
    xdirection *= -1;
  }
  if (ypos > height-rad || ypos < rad) {
    ydirection *= -1;
  }

  ellipse(xpos, ypos, rad, rad);

  noStroke();
  fill(#FF4BD2); //red
  ellipse(x, height/2-150, 100, 100);
  fill(#FEFF34); //yellow
  ellipse(y, height/2, 100, 100);
  fill(#29FFFD); //blue
  ellipse(x, height/2+150, 100, 100);
  fill(#7E83FF, 100);
  ellipse(random(0, 1024), random(0, 768), 100, 100);
  fill(#69FF62);//green
  ellipse(xpos, ypos, 100, 100);


  if (x > 1024) {
    c = 0.0;
    beginX = 0;
    x=0;
    y=0;
  }

  push();
  noFill(); //rect
  stroke(random(0, 255));
  strokeWeight(6);
  rectMode(CENTER);
  rect(width/2-10, height/2+30, 350, 240);
  pop();

  fill(random(0, 255)); //text
  textSize(196);
  textAlign(CENTER, CENTER);
  text("IMA", width/2, height/2);

  noFill();
  stroke(#E5E286);
  strokeWeight(8);
  beginShape();
  curveVertex(width/2-100, 125);
  curveVertex(width/2-100, 125);
  curveVertex(width/2, 125-50);
  curveVertex(width/2+100, 125);
  curveVertex(width/2+100, 125);
  endShape();
  beginShape();
  curveVertex(width/2-100, 125);
  curveVertex(width/2-100, 125);
  curveVertex(width/2, 125+50);
  curveVertex(width/2+100, 125);
  curveVertex(width/2+100, 125);
  endShape();


  strokeWeight(12);
  noFill();
  ellipse(width/2, 125, 95, 95);
  angle=atan2(mouseY-150, mouseX-width/2);
  translate(width/2, 125);
  rotate(angle);
  fill(255);
  noStroke();
  ellipse(100/4, 0, 100/2, 100/2);

  //println(mouseX, mouseY);
} 

Homework:

The code:

float angle=0;
void setup() {
  size(1024, 768);
  background(#F0EDA7);
}

void draw() {

  for (int i=50; i<=width; i+=250) {
    for (int j=150; j<=height; j+=250) {
      drawEye(i, j);
    }
  }
}
void drawEye(int x, int y) {
  noFill();
  stroke(0);
  strokeWeight(8);
  beginShape();
  curveVertex(x, y);
  curveVertex(x, y);
  curveVertex(x+100, y-50);
  curveVertex(x+200, y);
  curveVertex(x+200, y);
  endShape();
  beginShape();
  curveVertex(x, y);
  curveVertex(x, y);
  curveVertex(x+100, y+50);
  curveVertex(x+200, y);
  curveVertex(x+200, y);
  endShape();


  strokeWeight(8);
  fill(#A7CCF0);
  ellipse(x+100, y, 95, 95);

  angle=atan2(mouseY-y, mouseX-x);
  push();
  translate(x+100, y);
  fill(0);
  ellipse(95/4*cos(angle), 95/4*sin(angle), 95/2, 95/2);
  pop();
}