// this is a simplified example of how, in Processing,
// individual primitives might animate at their own individual pace/rhythm
// - rob@rahji.com

int frame; // increases with every frame

void setup() {
  // this should all look familiar...
  size(400,400);
  frameRate(15);
  background(100);
  noStroke();
  rectMode(CENTER);
}

void draw() {
  frame++;
  background(100);  // clear the screeen every frame
  
  // shows a moving square only for the first 10 of every 20 frames
  if (frame%20 < 10) {
    rect(90, 100 + frame%20, 10, 10);
  }
  
  // shows a circle sometimes...
  // in this case, the 20th-23rd frames out of every 30 frames
  if (frame%30 >= 20 && frame%30 <=23) {
    ellipse(200, 200, 50, 50);
  }
  
  // notice how the two primitives seem to be animating 
  // independently of each other...
  
  // - can you see a pattern related to the initial appearance of the two shapes?
  // - what relationship does that have to the numbers i'm using in the if stateme?
  // - knowing that, how can you make that pattern less obvious?  (or more obvious)
  // - which values might you change to make the circle stay on the canvas longer?
  // - how can we make the square move farther before it starts over?
  // - how about making 10 squares that move together?  or start moving at different times?

  // (this is not a quiz - this are just some questionst that are meant to help you 
  // understand this one way of getting things to move in varying rhthyms)
  
  // fyi, i just made this up last night so you might come up with a totally different method!
}