Fixed timestep and interpolation question

Question

I'm following Glenn Fiedlers excellent Fix Your Timestep! tutorial to step my 2D game. The problem I'm facing is in the interpolation phase in the end.

My game has a Tween-function which lets me tween properties of my game entites. Properties such as scale, shear, position, color, rotation etc. Im curious of how I'd interpolate these values, since there's a lot of them. My first thought is to keep a previous value of every property (colorPrev, scalePrev etc.), and interpolate between those.

Is this the correct method? To interpolate my characters I use their velocity; renderPostion = position + (velocity * interpolation), but I cannot apply that to color for example.

So what is the desired method to interpolate various properties or a entity? Is there any rule of thumb to use?

Answer 1

For interpolation you'll need the previous state of your properties. So, the previous value solution should work just fine.

The generic formula for the classic lerp (linear interpolation) is

nextValue * alpha + previousValue * ( 1.0 - alpha )

where alpha is accumulatedTime / timeStep in this particular context.

However, in the case of color it's a bit different as the RGB color model doesn't really have a continuous dataset as a whole. It depends on how do you want to interpolate color. If you want to change the brightness, hue or color saturation, you could use the HSV/HSL color model and interpolate among one or more dimensions.

You can do the same with the RGB model, or any other model, but it really depends on how do you want to interpolate and what do you want to happen.