A comment we've heard again and again about the Office 12 interface after people use it or see it demoed live is: "wow, it's so much better than I imagined just by seeing the screenshots."  Several people made that comment to me once again after my talk at PARC Tuesday night, and I wanted to write down some thoughts on the subject.

Fundamentally, there's a kind of UI that is built with great screenshots in mind.  Generally including big, shiny buttons with copious whitespace on all sides, these interfaces look extremely simple and easy-to-use in "back-of-the-box" marketing screenshots.  The screenshot-optimized interface is generally low-density, with only a few controls on the screen at once.

We've definitely thought about this in designing boxshots for marketing materials in past releases of Office.  The picture we show on the back of the box is what the product looks like the first time you run it.  But one of the problems with the current Office user interface is that it tends to degrade over time--toolbars pop up over your document and never go away, things get accidentally moved, Task Panes pop up automatically, etc.  When we do site visits, we often see Office screens that look more like the picture below than the one on the back of the box.


Back of the box vs. Real world screenshots

This is not deceptive advertising in any way, it's just the reality that today's system of menus and toolbars and Task Panes tends to present more and more complexity over time.  It's true for today's Office, and it's equally true with dozens of other full-featured software packages.

That's because to build efficient productivity software that wears well over time, the interface needs to be relatively high-density.  Having only five shiny buttons on the screen is very simple-looking, but it means that using any functionality beyond those buttons requires at least one extra mouse click.  (Probably more.)

Based on just a screenshot, the Ribbon appears fairly involved.  This is because the density of controls, especially on the first tab which tends to be shown in screenshots, is fairly high.  Yet, when people use the new UI or see in action--actually interacting with the software and not just staring at it--it doesn't feel cluttered.  The first tab is high-density because it's designed for high efficiency, and you wouldn't want most of those features an extra click away.  Bold and Italic and Center have small, unlabeled icons because they tend to be among the handful of features people can use without text labels.

One of the design tenets we've embraced from the very beginning was that the Ribbon was going to be a flat tax on screen real-estate.  Yes, it takes up a few more pixels vertically than the two toolbars from the back of the Office 2003 box, but it won't degrade over time.  We won't pop up extra UI over top of the document, or from the side, to advertise features.  Our goal is that when you boot Word 12 five years from now, it looks as clean as it did the first day you brought it home.

We don't worry about the screenshots; we worry about getting the product right for everyday use.  We worry about the long-term ramifications of our current design decisions, not how they'll look on the back of the box.  And if that means that some people don't react as positively as we'd like to static screenshots, then we need to redouble our efforts to get people to watch, read about, and use the UI in action.

A friendly, high-density productivity interface that demonstrates respect for your screen real-estate is one that will wear well with time.