So you want to make pixel-perfect icons for iPhone and iPad, but can’t get it just right? Here’s my own personal icon template that makes designing and previewing icons a breeze. Click the preview to download the organized and layered Photoshop file.
The template also includes layers for creating iPad document icons. Be sure to read Apple’s documentation for a clear explanation of how icons are to be formatted and used in apps: iOS Human Interface Guidelines: Custom Icon and Image Creation Guidelines
Iconverter is a simple little utility I discovered which helps you juggle between images, ICNS files, and actual “pasted” icons for Mac files and applications. Often when dealing with icons, I find the need to convert an ICNS file to an editable PNG image with transparency, or go from a PNG back to an ICNS. As much as I like IconBuilder, my needs are not nearly that complex, and Iconverter simply gets the job done. What I enjoy most about the little app is the “Use file contents” checkbox, which will force it to read the data from the file instead of the icon itself — most other icon utilities default to using the system-designated icon of an opened ICNS file (a file with dog-eared corner), not the actual file contents. Iconverter handles this with ease, and is my first choice for getting icons just right.
While working on Mac meet Xbox part 3, I kept referring to the Transmit and Xbox duo, so I decided to combine the two into a stylish Xbox Edition icon replacement, which includes a paste-able icon, .png image, a replacement .icns file, and the source .psd. Download the set.
To replace Transmit’s yellow-and-purple truck icon with the “new and improved” one, locate it in your Applications folder (or wherever you may have it stored), Control-click it, and choose Show Package Contents. Browse to the Contents/Resources folder, and find Transmit.icns. This is the icon file for the application, so rename it to Transmit.bak for safe keeping in the event you would like to return to the default icon. Drop in the replacement icns file provided in the pack, and name it Transmit.icns. You may need to relaunch the Finder or log out/in to get the full effect, after which Transmit will sport the new Xbox delivery truck icon!
I decided to create an Icons category here at Command-Tab because I occasionally find myself making Mac OS X icons for various purposes, and thought others would be interested in using them and learning from the accompanying Photoshop files.
This first icon is one I made quite some time ago, during a game icon creation frenzy in the MacNN forums. I’ve since redone some of the graphics, cleaned it up a bit, and brought out the colors. You can download the zipped file pack, which includes a paste-able icon, a Mac OS X .icns file, a PNG image, and — most importantly — the source Photoshop .psd file.
This icon and any that follow are free for any personal use. If you intend to publish them in a collection or on the web, all I ask is that you give credit where it is due. Enjoy! I’ll have more to come in the near future.