How can I improve the "smoothness" of a 2D side-scrolling iPhone game?

Question

I'm working on a relatively simple 2D side-scrolling iPhone game. The controls are tilt-based. I use OpenGL ES 1.1 for the graphics. The game state is updated at a rate of 30 Hz... And the drawing is updated at a rate of 30 fps (via NSTimer). The smoothness of the drawing is ok... But not quite as smooth as a game like iFighter. What can I do to improve the smoothness of the game?

Here are the potential issues I've briefly considered:

• I'm varying the opacity of up to 15 "small" (20x20 pixels) textures at a time... Apparently varying the opacity in this manner can degrade drawing performance

• I'm rendering at only 30 fps (via NSTimer)... Perhaps 2D games like iFighter are rendered at a higher frame rate?

• Perhaps the game state could be updated at a faster rate? Note the acceleration vales are updated at 100 Hz... So I could potentially update part of the game state at 100 hz

• All of my textures are PNG24... Perhaps PNG8 would help (due to smaller size etc)

Answer 1

I'd recommend using CADisplayLink to manage your loop rather than NSTimer. It's synchronized to the screen refresh.

Are you updating your graphics positions on the screen at a fixed interval or is their movement based on the time elapsed since the last update? Occasionally the iPhone stutters, if you don't take account of it the animation can look jittery.

Answer 2

30fps is probably your problem?

Some/many people will try to tell you that 30fps is just fine. But really, it's not. While 30fps is certainly 'playable', it's never going to be 'smooth', especially for a fast-moving 2D scroller, and especially to any games enthusiast that's had a taste of 60fps.

2D games on 16bit consoles and arcade machines ran at 50/60Hz for a very good reason — it looks far, far smoother than 25/30, especially for 2D scrolling games. Back then, 60fps was almost the definition of 'arcade quality'. These days, many developers are prepared to sacrifice that smoothness for better image quality (better screenshots) or shorter development time (less time-consuming optimization work).

Unfortunately, I can't help with the iPhone specifics. I get the impression that 60fps on iPhone/Android isn't easy to achieve — although a few do manage it. (The iPhone port of Pinball Dreams being one example.)

Answer 3

I hate to be nitpicky but....wouldn't trying your suggestions answer them? Like PNG8 vs 24....give it a shot? Convert them after loading and see if things improve?
30fps should be smooth enough for a game, but my experience has shown that you have to be very careful (at least on my 2G testphone) to actually maintain 30fps....I'd get a spike every half a second or so throwing me one frame off, so it is crucial that your code is framerate independent. Have you verified that you don't have those spikes?

Answer 4

Another thing to watch out for with 2D scrolling games:

Are you scrolling a nice constant number of pixels per frame?

If you're scrolling 2 pixels one frame, then 3 the next, then 2, for example, that will add a bit of judder. If you're working with a 3D API, and scrolling some arbitrary speed, like 2.73 pixels per frame, that may add sub-pixel 'wobble'

If you are able to target a fixed framerate, try to ensure that the character's walk/run speeds are a whole number of pixels-per-frame.

Answer 5

Don't trust the 60Hz hype - it is partly misinformstion. 30fps is perceived as smooth by the human brain (anything over 18fps is perceived as motion) - movies have been shot at 24 fps for the majority of the past century without people thinking they were not smooth. There is one caveat though - the interpolation has to be correct. If your timestep is not compensated properly the glitvch will break the illuision, even at 60fps - this is something that movies obviously never suffer. The only difference between 30fps and 60fps (given proper interpolation) is streakiness, since the brain will internally also try to blend the frames, and compensation for the fact (less of an issue with LCD) that the frame slowly fades between every redraw out and thus you see a wobble. Regarding the streaking: An eagle's eye registers frames at 2Hz, so when it sees a mouse running on the ground it sees a dot at place a, a dot at place b and the brains interpolate this to a line, which is why it can see the mouse from such height - streaking.
The only thing that 60fps gives is that, if your interpolation is not done right, the glitch is less and thus less disturbing to the perception of smoothness.