Sunday, January 9, 2011

Estimating iOS and Android App projects: The devil in the design

If you're planning your first iPhone or Android app project, pay close attention to the Design phase. At current count you'll need to generate 6 versions of your design to cover both operating systems safely.

Here's a quick rundown:

iOS: 3 Versions:
Due to the iPhone 4's superb Retina Display, your designers will now be generate two sets of designs. One at the higher resolution (iPhone 4), and one at half the resolution (iPhone 3GS and previous). There's no shortcut here, the device won't automatically scale down the high resolution to the lower resolution (although the iPhone 4 does manage to scale up lower resolution, hence still displays the older v3 applications).

If you add iPad to the equation, this is another set. Depending on the complexity of the app, make sure you consider both portrait and landscape modes, which may require some further customization.

One tip is to have your designers work in vector shapes, allowing them to export in any resolution they like. But this doesn't help when your agency sends you those fab product JPGs. So if that's not possible, have your designers start with the high resolution version, and on signoff, generate a second set from there. There's a few handy tips and Photoshop actions available on Smashing Magazine to help make this more efficient.

Android: 3 Versions:
Google do not dictate the resolution of their devices like Apple do, so get set for a dizzying array of combinations for Android. The good news is, if you generate three resolution types (two of which are very close), you'll cover approx. 97% of devices. These resolutions are:
  • 320 x 480 px,
  • 480 x 800 px
  • 480 x 854 px
Keep up to date on the resolution numbers as they evolve at the Android Developer site. And a useful slide deck on design UI for Android here on Slideshare.

Differences between Android and iOS:
Make it your job to know both operating systems well and understand their differences. If you're an iPhone user, borrow a workers Android device. Use an app, such as Facebook, to see how they approach the different widgets and design standards. Here's a few:

Image from the article by Suzanne Ginsberg. Best of luck.