Home▸Physics & Mechanics▸Frame-by-Frame Animation: 2D Timing Lab

🎞️ Frame-by-Frame Animation: 2D Timing Lab

Interactive 2D side view of a bouncing ball animated like a hand-drawn film: choose drawings per second, shoot on ones, twos or threes, see onion-skin ghosts and spacing marks, and compare real gravity-and-bounce physics with keyframes shaped by a draggable Bezier easing curve plus volume-preserving squash and stretch.

Physics & Mechanics2DEasy60 FPS📱 Mobile-adapted⇄ 2D version
2d-arts-animation-simulation ↗ Open standalone
⚙ Under the hood

Interactive 2D side view of a bouncing ball animated like a hand-drawn film: choose drawings per second, shoot on ones, twos or threes, see onion-skin ghosts and spacing marks, and compare real gravity-and-bounce physics with keyframes shaped by a draggable Bezier easing curve plus volume-preserving squash and stretch.

animationtiming and spacingsquash and stretcheasingonion skinarts

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)