What I think happened to Mail

More about trends in OS X user interface design...

I have a theory about what happened to Mail’s toolbar.

Human Interface Guidelines on Toolbars

Apple’s Human Interface Guidelines page about toolbar icons shows examples from the pre-metal Finder and the pre-Tiger Mail.

Each toolbar icon should be easily and quickly distinguishable from the other items in the toolbar. Toolbar icons emphasize their outline form, rather than subtler visual details.

All the icons in the new Mail are clearly designed to de-emphasize unique shapes.

Regular shapes is the trend

Of Apple’s apps that come with Tiger or with a new computer, I can’t think of any whose toolbars emphasize unique shapes. (And then there are apps that don’t have a standard customizable toolbar, such as iTunes and iCal, that I’m not counting.)

My guess is that, simply, Apple changed its mind about the unique shapes.

This isn’t necessarily bad—and there are new consistencies and usability gains being made. Note, for example, how the back/forward button set is the same in Safari, Help, System Preferences, Dictionary, and probably other places. This is a good thing.

So the trend is toward regular shapes—and also 1) away from color, and 2) toward a more button-like experience, and 3) toward more stylization, less representation.

The Mail toolbar designers got the memo, it appears.

What went wrong—or right

John Siracusa famously said that it appeared as if Mail had got “beaten with the ugly stick.” Not everybody agrees—it’s a matter of taste. (And I bet some people are starting to change their minds.)

The problem, though, is that Mail is a very different program from Safari, Help, System Preferences, and so on. The Safari-type buttons you see all over—back/forward and home, especially—are not appropriate for Mail. Mail needs things like Flag, Show Headers, Junk, and many more which don’t exist in any other Apple app.

But that leads to a quandary: you want to use the same regular button shape lots of other apps are using, but that button works best with grayscale icons, not with Mail’s more colorful icons. At the same time you want to keep some of the colorful icons because people have already learned what those icons mean. (And some—Junk, for example—are used in other parts of the interface, and you want color to draw the connection.)

So my guess is that somebody made the following decision: let’s invent a new regular shape, and stick modified versions of the old icons inside this new shape, so it’s like a button. (And let’s have it highlight on mouse-over, because people like it when buttons do that.)

Best of both worlds: regular, more button-like shapes and the already-learned icons.

Depending on your taste, it didn’t work out at all, or it worked out splendidly and is another master stroke of Apple design.

Anyway...

You’ve probably worked all this out for yourself well before reading this. It’s just that I enjoy forensic UI design, looking at apps and trying to figure out why things happened the way they did.

My point mainly is to point out the trends in OS X toolbar icon design: regular outlines; icons inside the outlines (button-like); grayscale instead of color; and bolder, more stylized figures.

I have some theories on why these are the trends:

1. People understand buttons! So making toolbar icons more button-like is a usability gain. My suspicion is that Apple found that some users didn’t realize they could click on the toolbar icons in the older version of Mail, since they don’t look like buttons.

2. Regular outlines feel simpler, and therefore better, than different outlines. (But this may be a usability loss, because different outlines are easier to pick out. Possibly outweighed by #1 above.)

3. To many people, grayscale signifies elegance. And everybody wants their stuff to be called elegant.