Automatically Create Icons up to iPad Retina Resolution

September 11th: Updated for iOS 7  

With iPhone and iPad retina and non-retina resolutions, there is a bunch of  icons you need to create if you need to support all of them. There is probably tons of artwork you need to fix, and nobody can help you with that. But here is a little support for you to at least have your icons correctly and easily in place.

If you are developing an app for the iPhone/iPod or the iPad, or both as universal app, there is the Apple bible for what you need to provide as icon formats:

• App icon for the iPhone in 57×57 px
• App icon for the iPad in 72×72 px
• Settings & search result icon for the iPhone/iPod/iPad in 29×29 px
• Search result icon for the iPad in 50×50 px
• Added September 11th: For iOS 7, you will also need icons sized 120×120 px and 80×80 px (iPhone), plus 76×76 px/152×152 px and 40×40 px/80×80 px (iPad). Nowadays the names of the icon files don’t really matter any longer, but I kept the old name schema for them.

These are all formats that are supported from iOS 7 on:

For retina displays, you need to provide each of them with the quadruple resolution as @2x variants (well, the last two are somewhat optional, but since we are automating it anyway now…), plus a new retina format to be future proof. So you end up with 9 icon files. What you probably usually do is take your large master artwork and then save all the required resolutions. This is quite a tedious hassle, since for the sake of supporting older devices you should stick to certain naming conventions, and doing all the resizing and renaming manually can be pretty error prone.

I created a small Automator action that takes my large 1024×1024 master artwork as input and creates all required files from it. Just drag your input file to the IconCreator.app automation tool, and it will create a folder Icons next to it containing all the required files, plus a 512×512 iTunesArtwork file (note: no extension!) that is if you distribute adHoc IPAs to testers, so that they don’t just see white squares for your app in iTunes. The Apple guidelines also demand a corresponding @2x retina file, so this will also be created. These itunesArtwork files should not be included in the final AppStore upload.

The input can actually be larger or smaller than that, but smaller is not recommended (since at least the iTunesArtwork will get pixelated then). After all, you’ll anyhow need the 1024x1024px format to upload to iTunes Connect. If you don’t drag a file to the droplet, but start it directly, a file-selector will ask you to select the input graphics.

You can download the latest version 1.3 of the automation task right here.

After adding the resulting icon files to your project, the only thing that is then still left to be done is adding them to your CFBundleIcons(~ipad) key in the info.plist file. Just copy the following entries and add them to your info.plist using a regular text editor. You can just insert it at an appropriate position between any two other entries (i.e. right before any existing <key>…</key> entry):

<key>CFBundleIconFiles</key>
 <array>
  <string>Icon-40</string>
  <string>Icon-60</string>
  <string>Icon.png</string>
  <string>Icon@2x.png</string>
  <string>Icon-72.png</string>
  <string>Icon-72@2x.png</string>
  <string>Icon-Small-50.png</string>
  <string>Icon-Small-50@2x.png</string>
  <string>Icon-Small.png</string>
  <string>Icon-Small@2x.png</string>
 </array>

<key>CFBundleIconFiles~ipad</key>
 <array>
  <string>Icon-40</string>
  <string>Icon-76</string>
  <string>Icon-60</string>
  <string>Icon.png</string>
  <string>Icon@2x.png</string>
  <string>Icon-72.png</string>
  <string>Icon-72@2x.png</string>
  <string>Icon-Small-50.png</string>
  <string>Icon-Small-50@2x.png</string>
  <string>Icon-Small.png</string>
  <string>Icon-Small@2x.png</string>
 </array>

With newer XCode versions, you can also add the icons manually to the individual requested formats by simply dragging them into their places.

Advertisement