Quite a few web applications have started utilizing gray(black) scale icons, for example Github,new Google Analytics, etc. Even applications like Firefox 4, Chrome, IE9, iTunes, Mac OS, have dropped colorful icons.
What is the reasoning behind the move from the colorful icons to grayscale/monochrome icons?
Examples:
Update: It seems Apple first introduced it in Aqua under Designing Icons for Rectangular-Style Toolbar Controls:
Icons that look good in rectangular-style toolbar controls are streamlined, black images that convey meaning through outline and contour, not internal detail. Because your icons should echo the appearance of the existing Mac OS X images inside rectangular-style toolbar controls, use the system-provided template images as a guide. As you design an icon for a rectangular-style toolbar control, keep the following points in mind:
- Make the outline sharp and clear
- Use a straight-on perspective
- Use full black and a few shades of gray to suggest dimensionality
- Use anti-aliasing
- Make sure the image is visually centered in the control (note that visually centered might not be the same as mathematically centered)
Icons for regular-size rectangular-style toolbar controls should measure no more than 19 x 19 pixels.
Answer
I believe this trend came together with the idea of separation of content and presentation. Icons are part of the chrome/ui and should not be too conspicuous in order not to compete with the content itself.
Another reason may be that it's easier to attract attention to an element when it is the only one with a colourful icon, and everything else is greyscale. For example, a green log in padlock icon in combination with greyscale menu icons. Making something pop-out in a group of colourful elements takes much more skill and time as you have to think about much more than just colour (which no longer plays the primary role in attracting the user's attention).
No comments:
Post a Comment