← KDE Visual Design Group/HIG/IconDesign You do not have permission to edit this page, for the following reason: The action you have requested is limited to users in one of the groups: Users, Administrators, trusted, KDEDevelopers. You can view and copy the source of this page. __NOTOC__ ==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. Icon use should be consistent throughout the interface. == Guidelines == * Design icons with a small number of metaphors . ** 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. ** Use arrows only if they can easily be related to spatial features such as ''Previous/Next'' in a sequence or ''Up/Down'' in a hierarchy. Avoid using arrows metaphorically (such as for ''Reply/Forward'' or ''Undo/Redo''). ** Attempt to use metaphors that are independent of language and culture. ** Make icons simple. * If an icon has important details at larger sizes, rather than simply scaling it down, create unique versions of the icon at smaller sizes. Critical details may become unrecognizable when scaled down. * Avoid using text in icon designs; it may not scale well to smaller sizes. * Icons of a similar type share a consistent visual language (mimetypes, folders, devices, etc.). * Follow the guidelines for presenting [[KDE_Visual_Design_Group/HIG/IconsAndText|icons with text]] * Test your icon set on strength of association, discriminatory power, conspicuousness, and, if applicable, on accessibility. === Monochrome Icons === [[File:HIGMonoIcons.png]] * Used for application toolbar and button actions, menus, and status and notifications. Also used for small (16x16) devices and places icons (folders, usb drives, etc.). * Rely on a distinct shapes instead of fine details to distinguish between them. * Color can be used for distinction (change of state, destructive actions, etc.). === Application icons === [[File:HIGAppIcons.png]] * Unique and easily recognizable. * Have the widest variation of color and visual style to represent the visual identity of the application. * When creating an system icon theme, respect trademarks by avoiding significant alterations to application icons. ==Implementation== * For standard actions (back forward, open, save, refresh, etc.) use an icon from the platform-provided set. The KDE Platform 4.x uses the [http://websvn.kde.org/trunk/kdesupport/oxygen-icons/ Oxygen icon set]. Ask at the [https://mail.kde.org/mailman/listinfo/kde-artists kde-artists mailing list] to request addition of a specific item. * http://websvn.kde.org/trunk/kdesupport/oxygen-icons/ * https://mail.kde.org/mailman/listinfo/kde-artists * If you would like to request help designing icons unique to your application, you can ask for help on the [http://forum.kde.org/viewforum.php?f=285 KDE Visual Design Group Forum]. ==References==  http://user-prompt.com/semiotics-in-usability-guidelines-for-the-development-of-icon-metaphors/ [[Category:Usability]][[Category: Presentation]][[Category:Layout]] Return to KDE Visual Design Group/HIG/IconDesign. Retrieved from "https://community.kde.org/KDE_Visual_Design_Group/HIG/IconDesign"