Effective Icon Design
By James Hobart
President & CEO
We
see icons everywhere -- on the road, at the airport, at the ATM machine, on bike trails,
and of course, on computers. In a graphical user interface, icons convey objects or tasks.
Since people comprehend images faster than words, icons can make it easier and faster to
perform a task. Good icons convey their function rapidly and are easy to remember. Bad
icons can actually reduce the usability of an application.
Above is the final
version of an application icon for a program that performs government document searches.
This icon takes advantage of the Windows® 95 and NT multi-resource file format (.ico).
Three sizes of the 16-color application icon are shown -- 48 x 48, 32 x 32, and 16 x 16.
When you are designing icons, keep in mind the minimum video display of the application
and the control within which the icon will be displayed, before using 256 colors. This
icon uses the Windows® system default 16-color palette.
In the preliminary
version of the application icon, shown above, we worked through conveying the idea of
documents, searches, and state institutions using several sketches and whiteboard
drawings.
This early
application icon had too many elements for easy recognition. A 16 x 16 pixel version of
this image would be too complex and unclear. This early application icon also lacked
dimensionality, appearing too flat.
In the final version
of the application icon, we eliminated the building and emphasized the document by using a
golden seal in the lower right for an official appearance. We added dimensionality by
using highlights and shadows on the magnifying glass to give the appearance of a round
handle and curved glass. The end result was an application icon that conveyed the
application's function and was clear at all of the three different icon sizes.
Throughout the
process of designing the icon, we tested it for clarity in concept and appearance. This
was achieved by removing elements rather than adding them. When it comes to icon design,
less is really more.