May 27, 2015

How to release a Mac app: 3. Icons.

Yesterday, we learned something about preparing Design for the Mac app. Let's continue with icons!

For customers, the app icon is exactly the same thing as the program it represents. So Icon Design is extremely important, and you should plan for it separately from mockups and graphics. Do not forget about Retina Display support which requires even more work.

  • Dock. This icon will be displayed in Finder and on the Mac App Store page. But if you are lucky enough, it will live in the user Dock. So you should tend to make the best citizen which must look perfectly as in the Dock attached to the Bottom as to the Left or the Right screen side.

  • Documents. Some apps work with documents and files, so you may need to create one more full-featured icon similar to the Dock which should be distinguishable and scalable in Finder.

  • Preferences. OS X provides standard icons for General and Advanced preference panels, but you may want to provide custom ones. These icons are small and do not require 1024x1024-rendered versions.

  • Menu Bar. This tiny icon should look good in black and white colors on the black, blue and white backgrounds. Ideally, it should be a universal vector template in PDF format.

  • Outlines. Outline views may represent a tree or grouped data in the app eg. Sidebar became a standard control in master-detail interfaces. Some apps use monochrome icons here, other prefer bright and colored ones, so this is up to you.

  • Tables. Items in the table rarely need their own icons. Such lists can be massive, so repeating graphics may look not so nice.

  • Controls. Using custom graphics all over the place is nice for some kind of apps, but usually you should prefer Clarity and Deference. Try to use more white space and generate icons from the user-provided contents like photos, avatars, website icons etc.

That's it about interface and icon design. Tomorrow we'll dive into Cocoa Development!

No comments:

Post a Comment