The Biggest Loser

As we continue to work on the visual design of the 2007 Office apps, we've been very conscious of looking for ways to slim down the overall UI of the apps.

Early on (especially before people learned more about how it worked) some people were saying things about the Ribbon like "it's just a fat toolbar and takes up all my space." We wanted to lose as much unnecessary weight as possible; you might remember how I feel about interface squalor.

In our current builds this week we finally got vertical spacing of the UI elements pretty much how we expect it to be when we ship Beta 2. So I thought it would be a good time to take some measurements to see where we were "out-of-the-box" vs. Word 2003 with the default Standard and Formatting toolbars up.

The question I wanted to answer was: "how much extra space does the 2007 UI take vertically vs. the 2003 UI."

So, I counted up all of the vertical pixels in Word starting directly below the title bar and extending to the last pixel of the status bar. From this, I subtracted any pixels devoted to displaying your document. This left me with the count of "pixels devoted to the UI." I did Word because it's the app in which vertical space is the most critical.

The results:

  • Word 2000: 143 vertical pixels devoted to UI
  • Word 2003: 140 vertical pixels devoted to UI
  • Word 2007: 135 vertical pixels devoted to UI

It seems that we're on our way to achieving the goal of creating a richer UI taking about the same amount of space as the common out-of-box experience with the current version.

And, the new UI uses 230 fewer horizontal pixels as well because the Task Pane is off by default.

And, you don't have to spend extra UI space to put up the Picture toolbar, the Table toolbar, the Mail Merge toolbar, the Reviewing toolbar, the Word Count toolbar, the Drawing toolbar, etc., etc. All of this is built into the 135 vertical pixels already allotted to the UI.

And, remember that when you want the most space possible for your document, you can collapse the ribbon entirely by double-clicking the selected tab, giving you 111 of those vertical pixels back.

I was pretty enthused by the results, and I wanted to share them with you.