Starting the Game - iPhone Game Blueprints - page 33

A special template can be created in Adobe Illustrator to work with app icons. It
includes one artboard, a layer with a background (for comfort previewing), several
placeholders for icons situated in the layer called content , a grid of slices, and finally
the layer called cover with special masks with rounded corners. Some of the most
important parts are slices; though they were invented for web design, helping to pre-
pare website's images, they can be used for icon design too. Their major advantage
is their ability to slice the artboard on fragments; each of them is saved (via the Save
for web option) as a separate file. Moreover, you can control the names of such files
by using the Slice Options... panel ( Object | Slice | Slice Options... ); there is the
textfield marked Name . By default, a slice's name is generated automatically (a doc-
ument name plus some digital indexes), but you can enter the name manually. It is
useful to add a shortcut for the Slice Options panel; by default, it has no shortcuts,
but it can be done through the special menu in Adobe Illustrator: Edit | Keyboard
Shortcuts... . The slices have their nuances; try to draw them in the Pixel Preview
mode or periodically pay attention to the Transform panel; the slice should have the
exact dimensions without fractions, the coordinates should be integers too. In other
cases, some errors with dimensions of exported files can occur; for instance, instead
of 60 x 60, you would get 60 x 59 or something like that. Adobe Illustrator automat-
ically creates a folder named Images , where the all saved slices are stored (there
can be some graphic garbage too because some slices simply cut out parts of back-
ground).
It is important to remember that the application icon in iOS doesn't support transpar-
ency; they are opaque square images. Now, famous rounded corners are made by
the operating system itself, so you should not include those corners in your artwork!