Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

I'm specifically referring to the types of animations that are typical in 2D hand held games on the Nintendo platform, where menus slide in, bounce, squish, etc.

I'm looking for something that is somewhat canned but allows for tweaks. Does something like this exist in any form (don't really care what language or for what targeted platform, I'm just looking for the pure math behind it).

share|improve this question
    
motionscript.com/mastering-expressions/simulation-basics-3.html has some nice, simple tricks with sine waves, but that answers your question only partly. –  sarahm Dec 7 '11 at 1:28
    
Thanks, unless I'm mistaken though these expressions are evaluated by After Effects right? So it's not quite like having the complete code to reproduce in any other graphics API. Or am I missing something? –  brushleaf Dec 7 '11 at 3:16
    
The mathematical formulas presented can still be used in any other API. –  sarahm Dec 7 '11 at 15:42
add comment

2 Answers

Here is a good tweening library for javascript. Sourcecode is clean and easy to read.

http://sole.github.com/tween.js/examples/03_graphs.html

share|improve this answer
add comment

UlanB made a great answer. It's actually a pleasure to work with the specific javascript example he posted. Ajax and jquery works great for this stuff. I really wish you would have asked this in about 1 month from now though, because I'm working on a library made just for this. With a lot of control that is. So animations aren't predefined, just supported with ease of use.

To remain on topic: I recommend doing these things for yourself. It may sound like a pain at first. But writing my library has been quite a learning experience. Especially note that things "aren't always as they seem"+"sometimes it's just that simple" in general when it comes to this stuff what ever works, works.

You can create ease by simply animating something over time with a speed that increases or decreases over time. To make it "bounce" or something, have it quickly move downward and when it hits where you want it to bounce at, stretch it sideways maybe 5-10% and downwards up to 60% over that time as well. And on the returning to normal time, you could either have the same thing happen in reverse, or the method I use which is to reverse the frames of that specific menu objects animation structure.

EDIT: In general though, it's still animation. Animation happens over time, and is straight forward. You can use pathing, and have time constant, slowing or speeding up at a given rate. You can also use key frames and predetermine the methods for animation.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.