What Makes Up a Skin?

In Chapter 1, "Understanding the Windows XP Graphical User Interface," we defined a skin as a combination of a Windows theme and a visual style. And though theme elements such as desktop icons and the desktop background can give the Windows GUI quite a facelift, it is the visual style that really controls the overall look of the interface.

Note

A good image editor that allows you to control colors, gradients, and other image attributes is probably more important than the drawing software you select. High-end image editors like Photoshop can be expensive, but try to find image editing software that has a broad range of capabilities. It will make taking default visual style objects and modifying them according to your own skin specifications much easier.

I think you are probably getting a feel for the fact that a visual style actually references the bitmaps that make up the GUI. For example, there is a bitmap for each of the various parts of a window, including the various buttons and controls, and there is a bitmap for the Start button and for the taskbar.

But if you think about how you interact with the various parts of the Windows interface, you know that each object, such as a button or window title bar, can look different depending on what you have been doing. For example, a selected button or control looks different from one that is not selected. The same is true about a window's title barit is active when the window is selected and is inactive when it is not selected. Active and inactive are actually states. So, each object found in the GUI exists in different states, which means that a bitmap has to exist that shows each state of that object.

The different states for an object are tiled together into one bitmap image. So, you don't have a separate image for each bitmapyou have a tiled set of states for that object that are part of the single bitmap file.

For example, if you look back at Figure 7.8, you see the bitmap FrameCaption.bmp open in Photoshop. I opened this bitmap from StyleBuilder; a right-click on the object in StyleBuilder (see Figure 7.9) allowed me to open the bitmap in Photoshop. If I'm going to edit the active state of the title bar, I also have to edit the inactive state of the tile bar. Typically, these two states are different because they are different shades (of a color such as blue) but are still in the same color family (again, blue).

Figure 7.9. You can open your image editor from within your skin editor.

Now, you might be thinking that trying to remember how many states a particular GUI object can go through is a disadvantage of trying to build a unique visual style. However, when you work in StyleBuilder or SkinStudio, you can easily view the bitmaps that represent a particular object and view the different states an object goes through as you actually interact with it (when using the interface). For example, Figure 7.10 shows the SkinStudio work area. I selected the Combo box in the Preview panel; this opened the normal state of the Combo box in the Editing panel. Note that the drop-down box shown in the lower-left corner of the application window (within the editing panel) allows me to quickly view the different states of the Combo box (such as Normal, Pressed, and so on). Changing the look or style of the Combo box requires that you edit or replace the graphic that represents each of the object's states.

Figure 7.10. The skin editor (SkinStudio) makes viewing the different states of a visual style object easy.

Note

We look more closely at StyleBuilder in Chapter 8 and SkinStudio in Chapter 9.

The fact that there are a number of states for every interface object means that creating a truly unique visual style (and the theme elements to go with it) can be time consuming. And since you will have to use more than one software package to actually accomplish the editing and customization for your unique visual style, you will also need to practice patience. You will find that, once you become familiar with your skin editor and other graphic tools, you will be able to let your creativity take over and get some enjoyment out of working with skins and skin elements.