Advertise Here
iOS 7 icon design guide and inspirations

iOS 7 icon design guide and inspirations

By in Design, Tutorials on September 23, 2013
Advertisement


Recent update to the Apple’s mobile device operating system, the iOS 7 is one of the biggest updates, and designers have been working hard to update their apps UI and icons accordingly since the software was revealed at Apple’s WWDC event in June.

Every application needs a beautiful app icon. It’s not uncommon for users to base their initial opinions about your app’s quality, purpose, and reliability solely on the look and design of your application icon. You need your design to match the standards that every iOS 7 icon design should be able attract people on App Store and stands out on their Home screen.

Here are some of the important points you should keep in mind as you think about your app’s iOS 7 icon design.

The Shape

Apple introduced a new shape, which got named “Superellipse” by Michael Flarup (I think that‘s a great way to describe this shape). Since Apple did not release an official iOS 7 icon design template of the shape, you will have to use one of the unofficial templates out there, which are replicating the shape in more or less accurate ways.

The best I have found so far is the App Icon Template, which is a very good starting point when you‘re designing an app icon for iOS 7.

iOS 7 icon design guide and inspirations
 

The Grid system

Apple has developed a golden ratio grid system, which can be used to size and align elements on your icon correctly. Although the grid system is not praised by the designers around the world and even the apples own designers are not taking the the grid system very seriously for designing iOS 7 icon design.

So you are free to do it your way, but you should keep that generic rounded shape intact.
iOS 7 icon design guide and inspirations
 

The Sizes: iOS 7 App icon for different devices.

If you’re designing icons for a universal app, you need to supply app icons in all four sizes.

For iPhone and iPod touch, both of these sizes are required:

  • 120 x 120 pixels
  • 60 x 60 pixels (standard resolution)

For iPad, both of these sizes are required:

  • 152 x 152
  • 76 x 76 pixels (standard resolution)

For the App Store, create a large version of your app icon in two sizes so that it looks good on all devices:

  • 1024 x 1024 pixels
  • 512 x 512 pixels (standard resolution)

For Spotlight search results on iPhone, iPod touch, and iPad create an icon in the following two sizes:

  • 80 x 80 pixels
  • 40 x 40 pixels (standard resolution)

For Settings on iPhone, iPod touch, and iPad create an icon in the following two sizes:

  • 58 x 58 pixels
  • 29 x 29 pixels (standard resolution)

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

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

iOS 7 Icon design Inspirations

iOS 7 icon design guide and inspirations
 
iOS 7 icon design guide and inspirations
 
iOS 7 icon design guide and inspirations
 
iOS 7 icon design guide and inspirations
 
more inspiration on next page..