Office 2007 RibbonX Alpha Channels Images

I have referred numerous times to the overhauled graphical user interface introduced in the 2007 Microsoft Office System, but I have always failed to get into details. No more! So today I am going to talk about a new feature that has debuted concomitantly with RibbonX, the GUI in Office 2007. And I would like to thank Eric Faller, Software Design Engineer on the Office User Experience Team, for the great insights into the RibbonX details.

While dealing with loading and displaying images into RibbonX, Microsoft has switched to images with alpha channels. The alternative? Images with masks or color keys. In fact, in the previous editions of Office 2007, Microsoft has used the latter two. Alpha channels images are a new addition.

The key to this change is transparent background. Or loading images with transparent portions into the Ribbon and let the interface's background be visible. "In the past, many add-in writers bypassed the entire issue by copying the background color of Office's UI and using that as the background color in their image. There are a couple of reasons this doesn't work very well. If the user switches their UI theme colors, or a new release of Office uses a different color, the icon suddenly looks out of place," explained Faller.

I will get to explaining alpha channels, so bear with me. In fact, I assume that some of you are already familiar with the term. I mentioned that, in the past, color keys and picture masks were used to solve the transparency problem. Using a color key involves marking a certain color that is not found in the gamma of the GUI as transparent. There are certain setbacks related to this method related to keeping track of the color separately from the images. Via image masking, through the CommandBars system, a single icon was the result of two combined images with Picture, containing the color data, and Mask, comprising a white and black image, properties.

An image with an alpha channel has an additional channel on top of the Red, Green and Blue ones. The additional color is the transparency. In this context, not only is 100% transparency a possibility, but also gradual levels of transparency.