I am animating a gltf skeleton dynamically and interpolating between position, rotation, scale for each bone.
Using lerp and slerp works, but it still looks very sudden and unnatural, so I have been trying to use easing functions to improve the quality of interpolation a bit.
For example I am using .lerpVectors(a, b, t) like so. The value t is calculated using my render loop: I start at 0 and do t += 0.01 until t >= 1.
Now to make use of easing functions I was trying to pass t through https://threejs.org/docs/#api/en/math/MathUtils.smootherstep like so Math.Utils(t, 0, 1), but I am not seeing any difference in the speed of interpolation. I am also unsure whether updating t with t += 0.01 in my render loop is correct. I have read that one should scale this by deltaTime, but then my values go from 0 to 1 too quickly.
Thanks for any advice on how to lerp in a smoother way.
Most of these functions just map input to output using some non-linear function, ease is just a parameter of the filter function that allows you to create different curves, in this case something that either slows down at the end or at the beginning. With ease = 0 you get a straight line, so it’s lerp.
ease > 0 boosts the input, making something to change faster than lerp, ease < 0 suppresses it
Ok, that clears it up thank you. So this is basically 3 different easing functions in one dependent on the parameter ‘ease’? Wouldn’t passing the ‘alpha’ parameter of lerpVectors through a manually defined easing function e.g. smoothstep, before calling .lerpVectors(a1, a2, smoothstep(t)) achieve similar results?
Lerp doesn’t add anything to the result, it maps values one to one, if you already use quadratic filter or smoothstep, then just use that result directly but technically yes.
