What is animation?

Flip books and Zoetropes, how do they work?

Flipbooks and zoetropes both create the illusion of motion by rapidly presenting a series of slightly different images to the viewer. Flipbooks achieve this through manual page-flipping, while zoetropes use a spinning cylinder with slits to display the images in quick succession. Both rely on the eye's persistence of vision and the brain's ability to interpret rapid sequences as continuous motion, tricking our visual system into perceiving smooth animation from static images.

How to MAKE A FLIPBOOK

Zoetrope Animation Toy Of A Galloping Horse | Zoetrope

<aside> 📌

What is interesting about this is you’re manually controlling the speed (the transition), which is the essence of animation!

Example: an ellipse moving down the screen at a constant speed, is different from an ellipse moving down the screen at increasing speed.

</aside>

Masstransiscope

A video is similar… How does a video work?

What is Video? — Vsauce

What Is Video ??

• Slightly varying images overtime create a sense of motion.
• Too fast a framerate actually needs digital motion blur for it to feel natural (matches what your eyes actually see).
• Slow motion vs. timelapse.
• It’s all about change and timing!

How does animation work on p5.js?

• Instead of happening on a timeline, the frame animation happens in a loop function draw() in p5.js. The code in the draw() loop runs 60 frames per second