With iOS 5, Apple has developed a new set of application icon attributes to help make our periodical stand out in the new Newsstand feature. Our icon can now look different than the standard glossy rounded rectangle, allowing for our work to gain greater attention from our users.
In this recipe, we'll look at different ways in which we can customize our periodical icon in Newsstand.
In this recipe, we'll need a nearly completed periodical application for which we can complete the necessary icon files. It's important that we have an idea about what sort of art direction will be required for the icon as we complete this work.
Creating icon files for periodicals in iOS 5 and beyond is a bit more complex than the standard application, as we have the ability to have customizable covers that change as content changes with new issues in the app. We can also dress up our app icon to look like a real magazine or newspaper, which can offer neat artistic flare as well. Let's take a look at the steps required to create a periodical icon in iOS 5:
- Create a standard iOS icon square for the app, measuring 57 and 114 pixels for the iPhone and 72 pixels for the iPad.
- Design a periodical specific default cover image to appear in Newsstand. Select a binding edge and binding type for the Newsstand cover.
- Include cover images in future updates to the periodical for inclusion in Newsstand.
When these four steps have been accomplished, our icon will be ready to go for the Newsstand feature in iOS 5.
Throughout the history of iOS, designers have only needed to put together a single icon, consisting of a 512-pixel square that is then scaled down to other sizes as required. This made icon design simple and easy, although it was quite difficult to make an icon stand out from the crowd. With iOS 5 and Newsstand, periodicals can now add a bit of customization to help an app's content stand out.
In step one, we'll be designing a standard square icon that will turn into a rounded rectangle and look like any other app icon in iOS. This will be required for our periodical, even though we have new and improved cover icons in Newsstand. The standard icon will be used in the App Store, when searching for an app in Spotlight, in the Settings application, and in notifications throughout the operating system, so it is required that we still include it in our app binary.
With step two, we'll be designing a more periodical specific icon to serve the purpose of a cover page for our magazine or newspaper when in the Newsstand feature. As new issues come out, we'll be able to update the icon to represent the day or week's cover story, but we'll still need a general periodical cover to display in case we have no updated periodical cover to display. This should be in the art style of our periodical and look much like a standard issue would appear on a physical paper or magazine.
For step three, we'll need to apply binding properties to the cover in the application's Info.plist. For the UINewsstandBindingType key, we'll provide a string of either UINewsstandBindingTypeNewspaper or UINewsstandBindingTypeMagazine. This choice is fairly self-explanatory and based on our selection, our periodical cover will look more like either a glossy magazine or a newspaper.
Next, we'll set the UINewsstandBindingEdge key to eitherUINewsstandBindingLeft, UINewsstandBindingEdgeRight, or UINewsstandBindingEdgeBottom. With our selection, the periodical cover will be edited to look as if the binding fold is on the left, right, or bottom of the issue.
Finally, we'll need to include updated periodical cover art images whenever we update our application so that iOS can adjust the cover accordingly in Newsstand. This will allow our periodical to appear up to date and grab the user's attention with an updated cover based on our most up-to-date app content.
By following these four steps, our icon will be ready for display in iOS 5's Newsstand feature.