Big Bucket Software you like to use
Updating The Incident for iPad
June 21st, 2010

When Neven and I started work on The Incident back in December, the iPad was only a rumor. No specs, no screen resolution, but we knew it was coming. We were hard at work when it was announced (in late January) and I initially treated it as a distraction. It took a couple months for us (or maybe just me) to acknowledge that we really needed to get our game onto it. This is what it took to get the gameplay component of The Incident ready for iPad.

Artwork

iPad automatically pixel-double iPhone apps but the end result is janky; the proportions of iPhone and iPad screens aren’t the same so you end up with an ugly black frame and blurry pixels.

iPad and iPhone Screen Resolution

So we needed new artwork. The iPhone resolution is 480×320. The Incident is pixel-doubled so the effective resolution is 240×160. The resolution of iPad is 1024×768. The Incident is pixel-quadrupled on the iPad such that the effective resolution is 256×192. So ultimately, that’s another 16 pixels horizontally that needed to be filled in.

iPad Artwork

Gameplay

There were also gameplay concerns to consider. The screen width is almost 7% wider (remember that The Incident is pixel-doubled on iPhone and pixel-quadrupled on iPad) which means 7% more space for items to fall. So to make the game equally fair on all devices, items were made to fall 7% more frequently on iPad. For example, in the first level, on an iPhone, items fall every 1.8 seconds. On an iPad, they fall every 1.68 seconds. Likewise, Frank’s maximum speed is 7% faster.

Code and Performance

Overall, making The Incident work for iPad was easier than I expected. It took two full days and I hit few obstacles. Something that had me stumped for a while was the actual drawing of the backgrounds. As I detailed previously, the backgrounds are made up of three layers. The top two layers have alpha transparency. The first-gen iPhone struggles to composite these layers so I spent a very long time making it fast.

Turns out the GL_OES_draw_texture extension is pretty awesome. This extension provides a really fast way of drawing a texture to the screen. It supports scaling, but not rotation (so the background image resources are rotated 90° to suit the landscape orientation of the device). However, using this extension to draw a 192×256 image to iPad’s 768×1024 screen is very slow and the iPad frame rate sat at a steady 25 frames. So I added a new code path; iPhone still uses the GL_OES_draw_texture extension, and iPad uses plain old glDrawArrays.

The final result is just awesome. It looks and apparently feels great. I say apparently because I don’t actually own an iPad; all my work has been done in the simulator. Neven assures me it’s pretty cool. He even took a picture for me:

Love it.