Hi, I stumbled upon a problem that I can't find a solution nowhere on the net, so I thought maybe people here can help. I'm a beginner programmer and recently I started implementing my animations into code. The problem is I animate in 24fps, and when I try to run an animation in 30 or 60 game fps since 24 is not a factor of 30 or 60, animation, depending on my code, either gets forced to a 30 animation fps which makes it 25% longer, or some of the animation frames gets drawn twice to make up for the remainder of frames that you get when you divide with 24. Every code tutorial I found does this and while some people acknowledge it, nobody really seems to care that animations get a little messed up. I'm a 2d artist and I know that 3d guys just do it in 30 animation fps so there's no problem, but for 2d it's really hard to work in 30, since it's not that dividable and it's just tedious. Is there a workaround around this or is it just mathematically impossible?

Also, is it ok to post questions like this unrelated specifically to the handmade hero project?

One way is to blend between the frames as needed. In fact most animation you see today is really just blends between keyframes.

Though that requires that you can actually blend between the frames. With poses and mathematical effects that's easy with hand-drawn sketches not so much.

This has actually been a longstanding (and unsolvable, by definition) problem in frame-based animation, so you're not alone. For example:

https://en.wikipedia.org/wiki/Three-two_pull_down

Schemes like 3:2 pull-down are the typical way to make this work - you play the 24fps frames at 30fps for a few frames, then double a frame, then back to 30, etc. I don't know that anyone has come up with a better solution thus far.

In general, this is a very serious problem and the fact that we do not yet insist on uniform frame rate technologies is a real bane to people who try to make high-quality movies and/or animation :(

- Casey

Yeah, I guess if we also watch movies on our screens all the time like this (unless it's 120 Hz), we just have to settle with 6 mushy extra sprites per second. I guess you could go the other way and adjust your animation fps to game fps. I know, for example, that some people animate 2d in 25 fps for some TV natives, but for me it seems really hard to plan an animation in fps you cannot divide.

Thanks, for fast answers :)

I would also suggest trying the "blend between frames" approach.
An ex co-worker of mine made a C# 2D Game Engine where he supports sprite blending for sprite based animations.

Here's a gif showing the difference between "classical" sprite animations and blending.

I'd try this approach and check if this is suitable for your use case.
If it is not, maybe Casey's solution works better for you.

However, just from reading about it, it seems that the sprite blending is a little bit easier to implement.

One more thing, do I double/blend those frames manually in whatever software and just include them in a sprite sheet or do I need to implement code that would do that at runtime?

You'd have to implement code that does the blending for you.
A simple linear interpolation between the pixels of two animation frames should suffice.