I decided to recompile some information about the sizes and names of the icons we need when we create an App.
Review of Icon Sizes
Image | Description | iPhone | iPhone Retina Display | iPad | iPad Retina Display | iPhone5 |
Application Icon | Icon displayed on the device’s home screen, used to launch an application. | 57x57 | 114x114 | 72x72 | 144x144 | 114x114 |
Settings Icon | Icon used to identity an application in the iOS Settings Application. | 29x29 | 58x58 | 29x29 | 58x58 | 58x58 |
Spotlight Search (uses same image as Setttings on iPhone) | Icon used to identify an application in the Spotlight Search results. | 29x29 | 58x58 | 50x50 | 100x100 | 58x58 |
iTunes Image | Large image used by iTunes during ad hoc distribution. | 512x512 | 512x512 | 512x512 | 512x512 | 1024x1024 |
Launch Image | Image used as a placeholder screen while the application loads. | 320x480 | 640x960 | Portrait: 768x1004 Landscape: 1024x748 | Portrait: 1536x2008 Landscape: 2048x1496 | 640x1136 |
iPhone Launch Images
Device Target | File Name | Size (in pixels) |
iPhone 3GS | Default.png | 320x480 |
iPhone 4 | Default@2x.png | 640x960 |
iPhone 5 | Default-568h@2x.png | 640x1136 |
iPad Launch Images
File Name | Size (in pixels) | Use |
Default~ipad.png Default@2x~ipad.png |
768x1004 1536x2008 |
This is the basic loading image that is used if a more specific image is not available. If no more specific images are supplied, this should be present. |
Default-Portrait~ipad.png Default-Portrait@2x~ipad.png |
768x1004 1536x2008 |
This is the generic portrait-loading image. This image is used for right side up (home button on bottom) portrait orientations and takes precedence over Default~ipad.png. Therefore, if you supply this image, Default~ipad.png is not used. Additionally, if Default-PortraitUpsideDown~ipad.png is not supplied, this image is used. |
Default-Landscape~ipad.png Default-Landscape@2x~ipad.png |
1024x748 2048x1496 |
This is the generic landscape-loading image. This image takes precedence over Default~ipad.png. Therefore, if you supply this image, Default~ipad.png is not used. Additionally, if Default-LandscapeLeft~ipad.png or Default-LandscapeRight~ipad.png is not supplied, this image is used. |
Default-PortraitUpsideDown~ipad.png Default-PortraitUpsideDown@2x~ipad.png |
768x1004 1536x2008 |
This is the portrait upside-down (home button on top) loading image. |
Default-LandscapeLeft~ipad.png Default-LandscapeLeft@2x~ipad.png |
1024x748 2048x1496 |
This is the landscape left (home button on left) loading image. |
Default-LandscapeRight~ipad.png Default-LandscapeRight@2x~ipad.png |
1024x748 2048x1496 |
This is the landscape-right (home button on right) loading image. |
Newsstand Icons
The aspect ratio of all Newsstand icons should be between 1:2 and 2:1. In addition, all Newsstand icons must be flat and have 90° corners.
Description
|
iPhone 5
|
high-resolution iPhone
|
iPhone iPod touch
|
high-resolution iPad
|
iPad
|
Guidelines
|
---|---|---|---|---|---|---|
App icon (required for all apps) | 114 x 114 | 114 x 114 | 57 x 57 | 144 x 144 | 72 x 72 | “App Icons” |
UITabBarItem Icons
If your want to create an Icon for the UITabBarItem you must consider the next steps:
- Image -> Mode -> Grayscale
- "Discard color information" -> Discard
- Mark all [cmd A]
- Copy [cmd C]
- Layer -> Layer Mask -> Reveal all
- In "Chanels" (Window -> Chanels) show the "Layer 0 Mask" (click on the left)
- Paste [cmd V]
- Image -> Adjustment -> Invert [cmd I]
- Save for web [cmd alt shift S] as PNG 24
using the Icon size of 30x30 pixels for iPhone and double for retina display 60x60 pixels.
In general, when you are supplying a retina image you should name it with [name]@2x~iphone.png or [name]@2x~ipad.png. Then, in the IB you should put the name of the file without the whole suffix, so just [name] instead of [name]@2x~iphone.png. The image won't show up in the IB, but should be ok in the live app.
No comments:
Post a Comment