My Peers ↓ Filter:

23 Apr 2012

Interface Design

I'm using a little time I've set for myself to build a 'splash screen' and app icon for my GoReference app. I've been sketching and have an icon I would like to build, but with the different screen resolutions, how does Apple recommend going about doing it?

Unlike other custom artwork in your app, these icons and images must meet specific criteria so that iOS can display them properly. In addition, icon and image files have naming requirements.
Table 8-1 Custom icons and images


Click image to enlarge

Icons

Tips

For all images and icons, the PNG format is recommended (avoid using interlaced PNGs).

The standard bit depth for icons and images is 24 bits (8 bits each for red, green, and blue), plus an 8-bit alpha channel.

You do not need to constrain your palette to web-safe colors. Although you can use alpha transparency in the icons you create for navigation bars, toolbars, and tab bars, do not use it in application icons.
App Icons

When iOS displays your application icon on the Home screen of a device, it automatically adds the following visual effects:
  • Rounded corners
  • Drop shadow
  • Reflective shine (unless you prevent the shine effect)


Click image to enlarge

Launch Image

To enhance the user’s experience at application launch, you must provide at least one launch image. A launch image looks very similar to the first screen your application displays. iOS displays this image instantly when the user starts your application and until the app is fully ready to use. As soon as your app is ready for use, your app displays its first screen, replacing the launch placeholder image.
Avoid using your launch image as an opportunity to provide:

  • An “application entry experience,” such as a splash screen
  • An About window
  • Branding elements, unless they are a static part of your application’s first screen
There are quite a few apps that break these rules! Mine wont. Here is an example of how Apple's 'Settings' launches:


Click image to enlarge

Source used in this post: iOS Human Interface Guidelines