Which Color When? (Part 1)

As you probably know by now, each of the Office 2007 programs (both classic UI and new UI) have the ability to render themselves in several different color schemes.

What determines which color scheme is used when, and what are the defaults?

Before discussing Office 2007, let's jump back and talk about Office 2003 for a bit of background and history.

Office 2003 was primarily designed to run on top of Windows XP. Windows XP has three "themed" color schemes which you can switch between in the Display control panel: Blue, Olive, and Silver. In addition to these, you can turn off theming altogether and use Classic mode (a Windows 95-like appearance) or High Contrast mode (an appearance designed for maximum contrast in the UI to help those with low vision.)

So the decision was made to have Office 2003 try to always match the OS color scheme. If you were using blue, Office looked blue; if you were using olive, Office looked olive. This work was done primarily through an internal data structure called the "color table."

Office 2003's UI is rendered on-the-fly based on entries in the color table. Each color table entry represents a specific color to be used for an element of one of the Office programs. There are around 1500 defined colors, each of them is chosen by a designer for each of the Office color schemes. This means 1500 colors for blue, 1500 for olive, 1500 for silver, etc.


The Office 2003 UI is rendered using around 1500 colors

Here's an example: the background fill of a toolbar might be based on three entries in the color table: the color at the top, a gradient stop in the middle, and the color at the bottom. In reality, of course, the rendering of a toolbar is more complicated than this simple example and toolbars are actually drawn based on more like 50 colors instead of 3. But you get the idea.

The upside of this method is that defining a new color scheme is just the matter of choosing 1500 colors or so and then extensive testing to make sure they're all used correctly. It's hard and time-consuming to get right, but there's no huge up-front production art cost.

This downside of this method of rendering the UI based on a color table pretty much means that the UI is limited to solid fills and simple gradients. As a result, the Office 2003 UI couldn't be as rich and polished as the designers working on it wanted it to be.

There's more than just the blue, olive, and silver themed color schemes, however; you can also turn off theming in Windows XP to revert to Windows 95-like appearance. In this mode, you can change the color of Windows system elements based on the old color picker for each part of the UI. There are around 25 system colors defined as part of one of these classic appearances.

And so, in an effort to have Office 2003 match the OS in this mode, every entry in the color table has to map to one of the system colors.

The problem? Windows only provides 25 colors, but Office needs around 1500. In order to try to make the UI still look nice despite there not being nearly enough colors, the team created the ability to specify that a color table entry is a blend between two Windows colors or a lighter/darker variant of a Windows color.

Sometimes this comes out looking OK, but many times it doesn't turn out that great with certain color choices. A big effort was made to make sure Office 2003 works well with the default color choices provided by the system, but the fact that you can make your own Windows schemes makes the design a bit of a crapshoot.

Finally, in High Contrast mode, we have to render the UI based only the system colors; blending colors doesn't work because it reduces the contrast. This means that every one of the 1500 color table entries has to map directly to one of the 25 Windows colors, which usually boil down to black, white, green, and purple. It's extremely easy to end up with black text on black background or another impossible-to-read combination, so it takes us pretty much the entire product cycle of working to get all of the bugs in the mapping worked out.

Now you know how the Office 2003 UI is rendered. There were a few drawbacks to this approach:

  • The UI rendering was limited to solid fills and simple gradients.
  • Many "classic" color schemes didn't look right or had usability problems.

In addition, one of the biggest pieces of feedback we received about Office 2003 was that people wanted more flexibility to change the Office color scheme independent of the Windows scheme.

Some people disliked that the Office color scheme was based on the OS appearance and that they couldn't specify what Office scheme to use. Those of you in the 2003 beta will undoubtedly remember that this was one of the longest and most involved discussions in the 2003 private beta newsgroups.

Next time, I'll describe what changes we made for the new UI in Office 2007 and how Office chooses color schemes on Windows Vista.