Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

A friend of mine currently is going through process of face-lifting existing application and it's nightmare when it comes to icons for buttons.

For example there are five different icons for "information". Similar situation is with other actions.

Is there any best practices/recomendations on creating list of assets which can be used in development for representing particular actions? Like - for "save" you use only this icon.

share|improve this question
add comment

4 Answers

up vote 1 down vote accepted

Guidelines

Documents similar to Microsoft's guide on creating the best user experience / Ux.stackexchange theme

How to develop an effective gui standard / PDF book by Eric M. Schaffer

Color codes

color codes

Icon design

silhouettes

Visual information is perceived much quicker when instead of the same objects you see distinct silhouettes.

Why Distinct Icon Outlines Help Users Scan Faster

In situations when it is impossible to create a clear mental model visualization use the text description. For example is quite problematic to represent a condition "It is occupied" on the telephone line.

9 rules for clear and intuituve icons

share|improve this answer
    
Re the distinct icon outlines helping users scan faster - it's not necessarily so. –  Vitaly Mijiritsky Mar 15 '12 at 5:21
    
Very nice resources and I'll definately pass them to her. Unfortunately seems that sample how to define asset catalog doesn't exist. So bycicle must be invented :) –  PiRX Mar 15 '12 at 9:30
add comment

As far as I know, there is no such a thing.

However, you must make one yourself, specific for your application, your set of applications, or your company, depending on how far you want to be consistent. It's called a UX Style Guide. If it's just for one application you may also include it in the functional specifications of the UI for that application.

The reason why you ended up in that situation is because different developers are only looking for a solution within their own work, without caring what other developers do. If you ask 1 developer "put a button here with an information icon on it", he will just use Google to find a suitable icon. If you ask another developer to "put a button there with an information icon on it" he will do the same, and it would be a very lucky coincidence if both programmers would end up using the same icon.

A style guide, or a clear functional specification is a good way to deal with this. This will make sure you will have a consistent UI style throughout the entire application. Mind that these guidelines can describe many aspects of the UI, not just usage of icons. If you say that the icons are inconsistent within your application, I bet other things are also inconsistent.

share|improve this answer
    
I understand very clear, why such situation has arised :) And even have some ideas how this should be approached. Main reason why I'm asking this is to "don't invent bycicle" –  PiRX Mar 14 '12 at 12:27
    
Of course, this is a very legitimate question (which is why I upvoted it). But I don't think there is such a thing as a 'universal style guide'. The only thing close is the MS UX Interaction Guidelines (msdn.microsoft.com/en-us/library/windows/desktop/aa511258.aspx), but that will not go into the detail of giving icon-suggestions. –  Bart Gijssens Mar 14 '12 at 12:32
add comment

If you have the resources, ability, and buy-in...

Skip the documentation and create a reusable library of UI components that provides all the common elements developers need.

This is not easily accomplished, but it actually makes developers lives easier in the long run (and it's harder to ignore than StyleGuide.pdf on the company intranet).

share|improve this answer
add comment

Every major development platform has a corresponding style guide that fills some or all this purpose.

They are variously referred to as UX Guidelines, Human Interface Guidelines, Style Manual and Usage Guides. Exact naming varies mostly by scope. These documents usually are available as part of the platform's developer documentation.

share|improve this answer
1  
That's how it should be. Most UI developers however have never even heard of this. Therefor it is useful to refer to such documents when handing over UI programming work to a developer. –  Bart Gijssens Mar 14 '12 at 12:33
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.