iOS Artwork, what icons and images are needed for an iOS app

The artwork for an iOS app can become a lot of work. Icons and images for different resolutions are needed, and there are some naming conventions. If you stick to the naming conventions the correct icons/images will automatically be selected when those icons/images are added to your project.

The icons

These are the resolutions and names according to the naming conventions for the icons. For an iPhone project you probably would want to include at least the iPhone 3 and iPhone 4 icons.

iPhone 3 icons (non retina display)

• 57 x 57 – Icon.png
• 29 x 29 – Icon-Small.png

iPhone 4 icons (retina display)

• 114 x 114 – Icon@2x.png
• 58 x 58 – Icon-Small@2x.png

iPad icons

• 72 x 72 – Icon-72.png
• 50 x 50 – Icon-Small-50.png
• 29 x 29 – Icon-Small.png

Splash screen

It is possible to show a splash screen when the app starts. The iPhone supports a portrait splash screen, the iPad supports splash screens for different device orientations. The resolutions and naming conventions are:

iPhone 3 (non retina display)

iPhone 4 (retina display)

• 640 x 960 – Default@2x.png

iPad

• 768 x 1004 – Default-Portrait.png
• 1024 x 768 – Default-Landscape.png
• 1004 x 768 – Default-PortraitUpsideDown.png
• 1024 x 768 – Default-LandscapeLeft.png
• 1024 x 768 – Default-LandscapeRight.png

App store artwork

The app store also needs some artwork. The minimal needs are:

App store icon (the same for all devices)

General app artwork

If you include images in your app, make 2 images for each image you use, one for iPhone 3 and one for iPhone 4 (retina display). Also stick to the naming convention of:

• MyImage.png
• MyImage@2x.png

(Replacing “MyImage” with the name of your image…)

The resolution of the “@2x” file has to be double that of the “.png” file (for example 100×100 and 200×200). If you stick to this naming convention, and add the files to your project, your app will automatically decide which file it needs for the device it is running on. This will make your app look better on a retina device!

Workflow tip

There is a (free!) tool that converts an image to all the right icon sizes with the correct file names! That tool is “iConify” (available in OSX app store). If you start your artwork with creating an 512×512 image (App store icon) and drop that image in iConify,  then iConify will create all the iPhone 3, iPhone 4 and iPad icons for you! Essential to this workflow is to start with the 512×512 image. Downsizing of images is usually not a problem, up-sizing is.