Projects/Usability/HIG/IconDesign

From KDE TechBase
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

Purpose

Icons are pictorial representations of functions and objects, important not only for aesthetic reasons as part of the visual identity of a program, but also for utilitarian reasons as shorthand for conveying meaning that users perceive almost instantaneously. Well-designed icons improve the visual communication and strongly impact users' overall impression of visual design. Last but not least, icons are space-saving and improve usability by making programs, objects, and actions easier to identify, learn.

Guidelines

  • As a developer use an icon from the predefined set. KDE uses the Oxygen icon set. Ask at the kde-artists mailing list if the set lacks on a specific item.
  • As a designer create icons with varying sizes in respect to the level of design. Simply scaling down (or up) does not work.
  • Design icons with a small number of metaphors [1].
    • Apply metaphors only once (e.g. do not use a brush twice for different options).
    • Rethink conventionally used metaphors (e.g. the clipboard icon of paste).
    • Antiquated metaphors might work well (e.g. a floppy is not necessarily outdated to represent save).
    • Adjust the degree of abstractness according to familiarity of the metaphor.
    • Avoid using arrows, they are unspecific.
    • Define metaphors independent from language and culture.
    • Make icons simple.
  • Colorize icons according to the meaning but in respect to application’s colors.
  • Don’t use animated icons.
  • Test your icon set on strength of association, discriminatory power, conspicuousness, and, if applicable, on accessibility.

Implementation

References

[1] http://user-prompt.com/semiotics-in-usability-guidelines-for-the-development-of-icon-metaphors/