Tweening

2015-04-18

Tweening probably has many definitions. I heard one guy call it mapping as in mapping one range to another range. I've always called that lerping. The simplest lerp is something like

     value = start + (end - start) * lerp

Then given lerp goes from 0 to 1 value will go from start to end.

People have come up with easing functions so instead of linearly going from 0 to 1 you get some kind of ease in or ease out or both.

     value = start + (end - start) * easingFunc(lerp)

Where easingFunc might be something like

     function easingFunc(lerp) {
        return (-0.5 * (Math.cos(Math.PI * lerp) - 1));
     }

This gives you a nice ease in and ease out.

I'd been doing that for years but I'd always hand coded it meaning I'd just put in code calls directly to the easing functions where I needed them.

Recently I saw this pretty cool presention about making your game "juicy" and I decided to look into the code a little to see what ideas to learn from and the big one I came away with from looking at their code was using a tweening library.

Basically a tweening library lets you create tiny mini tasks that lerp some value over time for you. What makes them useful is you can just fire and forget. Much easier than hand writing each case.

So anyway I wrote my own tweening library and have been playing around with it.

Comments
webglfundamentals.org
The 4 stages of a C/C++ Programmer using JavaScript