Lecture 02: Making things Move


Live Coding

FYI: Live-coding Processing in the Browser.


Today we will use tutorial resources from two great educators:

In computer graphics, animation is achieved by:

  • manipulating numbers over time, and then:
  • using those numbers as the basis for drawing something.

Here are some extremely elementary animation methods:

  • random animation: position ∝ random()
  • frame-based animation: position ∝ frame
  • time-based animation: position ∝ time
  • life on a torus: a word about periodic boundaries
  • interpose an explicit function: position ∝ f(t)
  • examples: sin(), noise(), sum of sin()’s,
  • functions of time in 2D: Lissajous curves

When animating, we need strategies for producing temporal coherence. We wish for continuities, not only of position, but of derivatives and motion as well. Here are some very elementary strategies for temporal coherence:

  1. Drunk Walk:
    position = random() versus position += random() 
  2. “Zeno’s Paradox” animation:
    position = A*position + B*target (where A+B =1)
  3. Storage of higher-order derivatives (e.g. velocity). Pong bounce.
    position = position + velocity. 

Beginning particle systems.

  • Integration.
  • Accumulation of Forces (F = mA)
  • Springs.

Artificial Life, Synthetic Characters

We will consider some inspirations: