Lerping and Slerping

Game development is a fantastic source of all kinds of mathematical ideas with fun ways to demonstrate their effects in the real world (or at least in a virtual one). One of these ideas is called “lerping”, or linear interpolation. Basically, given two points in space, how can we divide the distance between them up so that we can go from A to B in pieces, not all at once?

This isn’t even its most abstract form. Linear interpolations can also apply to any two numbers that we want to move between, but not all at once. For example, draining a health bar, or slowly shrinking a platform the player is using.

Given an initial point \(x_0\) and a destination point \(x_1\), we can linearly interpolate by using a timestep \(t\) in the formula \((x_1 - x_0)t + x_0\). It’s useful to use a timestep instead of an elapsed time because this is closer to how games work: we tend to calculate what needs to be updated since the last frame. This leads us to motion that looks like this:

There’s an analog of this kind of interpolation for rotations called “slerping”. (The “s” comes from “spherical”.) The formula uses quaternions (basically a fancier version of complex numbers) to rotate objects around in 3D space.

The slerping formula takes an initial quaternion \(q_0\) and a destination quaternion \(q_1\), again interpolating via a timestep: \(q_0 \left( \frac{q_1}{q_0} \right) ^t\). This formula is especially valuable in game programming because it’s so consistently fast: just multiply, divide, and exponentiate a few floating-point numbers. No need to do anything fancier with calculating 3D rotations via matrices or something like that.

Of course, we can apply these ideas to any property of an object, like color. Color-changing objects are more rare in the real world than merely moving objects though, so if one of your goals is to maximize familiarity, you might want to stick to transformations that analog objects undergo more often. For example, if you’re trying to make the most accessible user interface rather than a wacky video game, you might stick to more natural transformations.

One of the Twelve Principles of Animation¹ is “slow in and slow out”. We don’t see objects in real life immediately pick up speed, move somewhere else at that constant speed, and then stop immediately. We see them gradually speed up until some maximum speed, and gradually slow down before coming to a stop. This principle alone creates a much more natural-seeming interaction.

There are plenty of other ways to improve on animations, but lerping and slerping are a great start to getting more natural motion in your games. And of course, they’re just super-fun words!