Programming Challenge GM: Easing (+ agapi)

Posted by Alert Games on Oct. 31, 2014, 9:03 a.m.

I've talked with acid about making an open-source version of the AGAPI to work on the graphics and effects and containers for it. But from past experiences on this, the only way to keep it organized is to make a lot of documentation on how it should be organized. I realized that as GM is not that great with organizing code, it also makes it more difficult to work together on code as well. (…maybe I should help jobo make a way to build better function structure in parakeet…)

Anyhow, one of the things that is needed in AGAPI, and would honestly make a lot of games better is easing functions for smooth animation. This is an example of what i mean:

from: http://easings.net/. Also, source on Github: jquery.easing.js

I was thinking of using something like ease in/out back, and ease out elastic, mostly for moving panels around and such. Do you think you can come up with a clean way to do this?

I have an older example here of the motion I have currently for the login box that you can take a look at. The login doesn't work right now because i've moved the API, but the new one will be able to update those kinds of things.

check out the old agapi2012 demo

It has a pretty smooth motion, but its rather hacky with a few variables and I'm wondering if someone could come up with a better way! I know you guys can do it ;)

Have a happy halloween and dont drink too much… unless you want to

Comments

Acid 10 years, 1 month ago

It's just parametric equations, bruh.

Using simple trig and linear equations for the scaling up/down, you can make a nice transition animation.

Ex: combining sin(x) and y=x for the elastic bounce

This would definitely be useful, though. It's not fun to have to rebuild functions, and lots of people aren't great with math.

Alert Games 10 years, 1 month ago

Well I know how to make parametric equations but Im wondering about the harder ones in this example and converting it to GM. I want to say I'm good at math, but it takes me longer to figure this stuff out and if I had enough time I would…. theres too many things to do!

For example, this is using jquery 'ticks' for speed. This is ease out back:

if (s == undefined) s = 1.70158;

return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;

How would one convert this into a function that I can use in GM, for instance?

Acid 10 years, 1 month ago

if (s == 0) s = 1.70158;

t=t/d-1;

return c*((t)*t*((s+1)*t + s) + 1) + b;

^^Seems like the right way to do it. Once you change the value of t inside that equation, you would be changing it for every subsequent "t".

And I don't see a reason to ever try to use an undefined variable - just define it, memory isn't as much of an issue any more.

Alert Games 10 years, 1 month ago

This is directly from a javascript library. So it can be undefined from the call, but in my case it wouldnt.

But I still would need to know what values to input. For example, what is the range of t, b, and c? I couldn't find what they stood for…

Acid 10 years, 1 month ago

I would say don't worry about doing it the way they did. Just define your own animations so that you can understand them, and document it so that OTHERS can understand them.

Alert Games 10 years, 1 month ago

That's fine. But I'm not sure I can reproduce them. Hopefully someone with a better understanding of making functions like these can help out? It would save a lot of time and benefit those who would like better animations…

Alert Games 10 years, 1 month ago

Looks nice. I'll have to give it a test when I get home. It doesn't seem too difficult, but you really made it make more sense to me and pretty quickly too.

Zac1790 10 years, 1 month ago

You could just download TweenGMS; I have the version that comes with JCHTML5. It has a bunch of scripts with the functions boiled down to the point where you just input the start, end, current time, and end time.

Alert Games 10 years, 1 month ago

@Zac: I think i've seen this extension before. Either I've seen it in the past where it was not complete, or there was another reason why I didn't want to use it, but I dont remember. Either way I'll try to download a version when I have the chance to test this out

@SpectreNectar: This looks neat. I will try out your contraption and get back to you on this.

Zac1790 10 years, 1 month ago

Man that's sweet SpectreNectar! I love controllable curves like that in Unity's animation curves and Lab Chirp. In fact they should hire you at YoYo to build an inhouse animation thing to replace the Spine ($300 separate software) support.