In pursuit of an excellent interface

“The secret of success is consistency of purpose.”
-Benjamin Disraeli

Why are good interfaces important? They’re the lens through which we view our computers, and they’re the control panel we use to interact with them. Because interfaces make up the layer directly between us and our machines, they are crucially important to our ability to use those machines efficiently.
A powerful computer capable of the most impressive feats of computation–but with an interface so Byzantine that its capabilities remain buried–is effectively useless; a decade-old clunker whose interface was designed with usability in mind can remain in service for years.

In fact, I am typing this introduction on an 8 year-old PowerBook G3. It has a passive-matrix screen, its battery holds approximately 8 seconds of charge, and it has no USB ports. By modern standards, it is laughably underpowered, and the eBay community seems to agree; I picked this machine up for $82. But despite its age and feebleness, it runs Mac OS 8, which was well-designed when it was released in 1999, and my black behemoth still feels relatively modern. In fact, as I navigate my hard drive, I occasionally come across a feature or two that I wish Mac OS X had.

Sure, OS 8 has its share of annoyances; every operating system (OS) does (naysayers will point to cooperative multitasking, lack of protected memory, and other buzzwords). But at its core, OS 8 was designed with the vision of usability and simplicity, using familiar metaphors, such as (gasp!) buttons.

In OS 8, things that open when you single-click on them appear as buttons, and things that open when you double-click on them highlight and darken on the first click. The clickable area of an icon is determined by the bounds of its picture. Clicked window widgets acknowledge clicks by changing their appearance. Dialog boxes use active verbs in buttons and can only be dismissed by clicking one of them. These conventions may seem simple and obvious, but most “modern” operating systems break many if not nearly all of them.

For example, in Windows XP, desktop icons can be selected by clicking in arbitrary areas around them because their clickable areas are seemingly random. In Mac OS X, many toolbar buttons don’t look anything like buttons and have unclear borders. In Linux, dialog boxes often have multiple ways to answer in the negative, with ambiguous results for each different method. Mac OS X’s so-called tabs don’t look anything like tabs. Windows makes you click a button marked “Turn off Computer” to restart it or make it hibernate. OS X scrollbars never look like they’ve been clicked. Many windows in Windows (haw haw haw) don’t show up in the Taskbar. And so on. The state of “modern” interface design is actually somewhere in the digital stone age.

Though this series of posts focuses specifically on the interface sins of Mac OS X, this isn’t to say that other operating systems fare better. In fact, OS X is by far the least bad of the other two most popular ones—Windows and whatever flavor of Linux you prefer. Volumes many times the size of this one could be written about the egregious interface transgressions of Windows. I focus on OS X for two reasons: both because it is the OS I am most familiar with, but also because it comes so close to excellence that I really don’t think that it would take entirely too much work to perfect it.

To business

For all the beauty of its downright lickable interface, Mac OS X often sacrifices uniformity in pursuit of this beauty. Here’s an example. The following are all toolbars on various applications that come with OS X:

Here’s what all toolbars used to look like in Mac OS X. Clear title bar area, pinstripey toolbar shelf, and toolbar buttons are big labeled icons. Simple enough that ColorSync Utility got to use it. Woohoo.

Here’s a new style–commonly known ad “Unified”–in which the titlebar area grew downward and engulfed the toolbar shelf, as seen in Xcode here People seem to like it.

System preferences uses this style (a variant of Unified), which consists of buttonlike buttons without icons that cannot be dragged around.

This toolbar belongs to Safari, which uses a bastardized form of the standard toolbar; when you hit the “customize toolbar” button, the resulting sheet shows buttons that are clearly labeled, yet when you drag them to Safari’s toolbar area, the labels disappear!

Even though these buttons of iTunes’s look like they might belong to a toolbar, they don’t: those buttons are immobile as your dead granny.

Mail uses these odd toolbar buttons, which look different from standard buttons for no perceptible reason. On the plus side, they look more “buttonlike,” but on the minus side, they’re pretty fugly.

There is a very serious problem here. Though they all have the same purpose–to put frequently-used commands and tools in an easy-to-access location–none of these toolbars look the same. Why not? Some have obvious borders, indicated by the “lozenge” surrounding the words or symbols within them; some do not. Some lozenges are white; some are not. Some buttons have text indicating their function beneath them; some do not. Some windows have a clear line separating the titlebar and the toolbar; some do not. Some toolbars are darker than others; some are not.

And so on. These toolbars and buttons are all pretty, but none of them is consistent with any other one, and none of them appear to follow concrete guidelines that might govern what they should look like. Apple’s own Human Interface Guidelines–the supposed de facto standard for OS X’s interface–is rarely taken seriously anymore, it seems–even at Apple! It’s this sort of seemingly random inconsistency that those guidelines were written to prevent, and for good reason: an inconsistent interface is confusing to new users.

OS X is plagued by this irritating inconsistency, which manifests itself through a couple of big, broad issues that OS X’s interface designers seem to have forgotten about, and which I will address in future posts: clickability, predictability, and adherence to real-life metaphors.