Dev:Source/UI/Icon Redesign

Rationale

Blender needs an icon redesign. The reasons for this are many - the current icons are dated looking, inconsistent with themselves, don't follow any established guidelines, there aren't enough of them, some are using bad and unclear metaphors, the list goes on.

This is understandable. Back in the NeoGeo days, icons were made by one or two people at most, and although there were still no codified guidelines, they were relatively consistent then. Now with open source, many people can and should be making icons, so we need to co-ordinate things to stay consistent.

We also need more people doing icons. Often things get committed to CVS with "reused this icon" or "ugly temporary thing for now" messages and unfortunately stay that way. Developers rarely make icons themselves to go along with features (and when they do, the results are not always great). Icons can be a good way for designers and artists to get interested and involved in Blender development. I've made a patch for dynamic icon loading and theme-ability that hopefully reduces the barrier to entry for non-coders to get involved here. ( https://projects.blender.org/tracker/index.php?func=detail&aid=5334&group_id=9&atid=127 )

Requirements

Things that we should have in Blender, but don't at the moment include:

• A consistent, codified style and consistent palette of colours to choose from
• Visual language of colour, style or content, i.e.
  • When to use black & white, greyscale, or colour, and what colours?
  • What represents selection? what represents editing? what represents a datablock? can we use colour or shape to communicate this, and if so, how?
• 'Base' artwork templates that can be built upon to create variations and permutations of icons. eg. timeline controls, 3d shapes, files and folders
• ..?

Here's a draft page that we can use to define these guidelines, in order to start on a new icon set.

• Icon Guidelines

Research Notes

Tango

The Tango Project is an initiative to create a reusable set of icons with a consistent style across open source software interfaces.

Quote from the website:

Eventually, the Tango Desktop initiative aims to provide:
*A specified default native look.
*A subsystem to help standardize toolkits on a common look and feel.
*A complete, standard set of application, mimetype, and stock icons to build upon a style guide.
*Cross-desktop humane interface guidelines.

• As part of the project, there is the 'Art Libre' set of icons, containing common icons used in graphics applications. While there are many more icons specified than actually produced, work is continuing on it and there are more in the CVS repository than on the linked page.

• SideFX have adopted Tango for a redesign of Houdini's icons. http://lists.freedesktop.org/archives/tango-artists/2006-April/000313.html . The results shown so far seem promising: http://www.sidefx.com/index.php?option=com_content&task=view&id=545&Itemid=66

• Jakub 'Jimmac' Steiner has already done some initial experiments with a Tango Blender theme, though this has not been done with any Blender-specific guidelines in place: http://www.blendernation.com/2006/11/30/experiment-alternative-blender-icon-theme/

Analysis

Pros

• Following the Tango guidelines at least to some extent provides a more unified experience for people who use other open source graphics applications
• Adopting Tango icons (and the art libre derivative) gives us access to a lot of other icons that we can repurpose for use within Blender

Cons

• Many of the Tango icons are very bright and colourful, giving a more cartoony appearance. Blender should have a more professional and muted appearance, so if Tango is used in Blender, we should be careful to restrain the use of colour sensitively.
• I think some icon creators get a bit too enthusiastic with this passage in the Tango guidelines:

"Highlights : The edges of objects tend to reflect light more due to the fact the position of the observer relative to the light source is almost always ideal for the reflection. In terms of highlights, the theme inherits the style of Firefox/Thunderbird Pinstripe/Winstripe designed by Kevin Gerich & Stephen Horlander (Pinstripe, Winstripe) which shift away from reality by creating a second inner outline of the object. This stroke is very subtle and may not be aparent on some matte objects."

Some Tango icons put too much emphasis on this 'highlight', making it into a stylistic feature almost like a second internal cartoon outline, rather than a subtle highlight intended to communicate the 3d form of the shape in question. This is one example where I think it's gone too far: (broken link) http://tango.freedesktop.org/static/cvs/tango-icon-theme/16x16/actions/mail-send-receive.png

This is not only a problem with the high contrast lines making simple shapes look more busy, but especially when using small icon sizes like in Blender with a limited number of pixels to use, so many are being used just to show an stylistic outline, rather than being used on the form itself (in the above example, some horizontal lines have half the available pixels spent on outlines).

Anyway, this is not a big issue, and it's due more to individuals' own interpretation of the guidelines than Tango itself, but I do think it's something to watch out for.

Modo

Modo has a very nice set of icons, visible in this screenshot. The way the icons communicate the functionality is quite clear, and they have a consistent, modern look and feel throughout the application.

Analysis

Pros

• Modo's icons use colour very well. The colours are restrained to avoid being too busy and distracting from the graphical content, but the best thing about them is the colour is used to communicate on another level of visual language. As visible in the above screenshot, different types of actions/data are visualised with different colour codes. For example, yellow/gold means selection (eg. the Vertices/+Bounds/Polygons icons at the top of the screen), green means adding geometry (eg. the buttons on the left side tool panel), etc.

--Matt Ebb