Explaining Everything: Two Important Graphic Sets

In addition to the graphics in the user interface of the application, there are two important graphic designs needed for an iOS app: the app icon and feature screens for the iTunes store.

App Icon

_You will need to create a few versions of the same icon (different sizes) that exist in different places.  The iOS Developer website has all the details, but here are some of the needs and sizes (in pixels) to consider:

• iTunes Store icon: 512 x 512
• App icon: 72 x 72 (iPad), 57 x 57 (iPhone/iPod Touch)
• Spotlight search: 50 x 50
• Settings icon: 29 x 29

Michael Flarup of PixelResort.com wrote a very helpful set of best practices for iOS application icon design. He also has provided a very cool Photoshop template for designing your own application icons.

Different sized PNG files of app icon

_If you are not a graphic designer yourself, then this is one area that it is definitely worth spending some money as it is going to be the first thing people see when they find your app initially, and every time they go to launch it. It also will become an integral part of any marketing initiatives (which I will write about later).

There was definitely a lot of communication between me and the designer whom I worked with, and we went through several ideas and iterations before having something that we felt captured the essence of Explain Everything.

Early ideas of the Explain Everything app icon

iTunes Store Feature Screens

Whenever you go to the iTunes store an look at an app, there are always several feature screens which you can scroll through to get a better idea of what the app is like. Some developers choose to use basic screenshots (home button + lock button on any iOS device). However, there is a great opportunity to highlight aspects of your application by annotating the screenshots and explaining what certain features do or purposes of the application that are better described with pictures and text rather than text or images alone.

iTunes Store page for Explain Everything with feature screen example

These images are generally 1024 x 768. Once you have a template for your feature screens, you can make new ones as your application gets updated. Just like with the app icon, these graphics can be helpful in marketing the application.