Curves & Splines for Motion and Paths
How Bézier curves and splines give you smooth movement, camera paths and easing — the math behind natural-feeling motion.
Straight-line motion looks robotic. Curves are how games get smooth, natural movement — a camera that glides, an enemy that swoops, a value that eases into place instead of snapping. Here's the concept without the scary math.
Start with lerp
The foundation is linear interpolation (lerp): blend between two values by a factor t from 0 to 1. At t=0 you're at the start, at t=1 the end, at 0.5 the midpoint. Lerp is a straight line — constant speed, hard start and stop. Everything else is about bending that line.
Easing: bending the timeline
Easing reshapes how t progresses over time. Instead of moving at a constant rate, you start slow and speed up (ease-in), start fast and slow down (ease-out), or both (ease-in-out). Ease-out is the workhorse of good-feeling UI and motion — things that decelerate into place feel natural because that's how real objects move.
Bézier curves: bending the path
A Bézier curve bends the path itself through space using control points. A quadratic Bézier has a start, an end, and one control point that "pulls" the curve toward it; a cubic has two control points for S-shapes. The curve never has to pass through the control points — they act like magnets shaping the arc. This is how you get a projectile that arcs or a menu that slides along a graceful path.
Splines: chaining curves
A spline is several curve segments joined smoothly into one long path. Splines are how you build camera rails, enemy patrol routes, and race tracks — lay down points, and the spline threads a smooth path through them so nothing moves in harsh straight lines.
Where you'll use them
- Camera paths — cinematic moves that glide instead of jerk.
- Movement — arcing jumps, swooping enemies, homing projectiles.
- UI/juice — panels and popups easing in with ease-out.
- Value animation — health bars, fades and transitions that feel soft.
Mental model
Lerp is a straight line; easing bends when; Bézier bends where; splines chain many curves into a path. Reach for easing when timing should feel natural, and for Bézier/splines when the route through space should be smooth.