Debug Log

Animation Value Graph: Bouncing Ball

This tool demonstrates how a bouncing ball animation relates to its value graph in animation software like After Effects. See how different easing curves affect the ball's motion.

50
100
150
200
250
300
350
Position Y: 0 | Time: 0.00s

Animation Presets:

Position Value
Current Value Point
Floor
Time Indicator
Speed: Slow → Fast

Understanding Value Graphs in Animation

A value graph shows how a property (like position) changes over time:

Steep slopes = Fast movement

Shallow slopes = Slow movement

Peaks and valleys = Direction changes

Curves = Acceleration/deceleration

Sharp points = Sudden direction changes (bounces)

Notice how the ball's motion directly corresponds to the shape of the graph. This relationship is key to creating convincing animations!

Tip: Click and drag directly on the graph to scrub through the animation.

This was designed for IM Visual Design 2 students:
Anna and Khansa
By Michel Salloum