TodePond / Habitat

my javascript helpers
MIT License
45 stars 5 forks source link

Pull out easing logic from tween #85

Open TodePond opened 1 year ago

TodePond commented 1 year ago

So that it can be used in other things, like lerp

also consider different ways of providing smoothing controls - maybe separate issue though

Magnogen commented 1 year ago

Would you like a seperate file for handling this, like an ease.js? If you'd like I could do that and use a bit of Newton-Raphson for Cubic Béziers?

Magnogen commented 1 year ago

Also, I had a play with the ease() function in desmos. What do the variables like in, out and ratio represent? They don't seem to make much sense from an artistic stand point... 🤔

https://www.desmos.com/calculator/b01zpscifm

TodePond commented 1 year ago

This is what they do: https://todepond.gitbook.io/habitat/documentation/tween

Yes a separate ease.js or smooth.js or something like that. the key thing I'm trying to figure out is how to make it all manipulate-able - rather than just picking a named easing function, which seems like the norm in these kinds of libraries

Magnogen commented 1 year ago

What about allowing for a mixture between two easing functions? I.e. evaluating both of the results of a functions, and then lerping between them?

You could lerp by a constant factor, like 60% circular in + 40% sine out, or by the t value, starting at full circular, then finishing at full sine. You could ease the lerp of the easing functions!

TodePond commented 1 year ago

Maybe, though the thing I'm really hoping to have is:

(inspired by freya holmer!)

To me, standard easing functions feel similar to 'magic numbers' and I'd like to be able to reach past them to the key thing, which is a decision around how smooth something is.