Have you ever been frustrated by a particular UI element in Vista that you just wished you could change? Sure, you can patch your system to allow custom themes, but there really aren't that many custom themes, and even less that are any good. Soon, there will be a better way.

Andreas Verhoeven, the guy that brought us the Vista Thumbnail Resizer, has created an application that will let you visually modify your Vista theme, import styles from XP to be used in Vista, and even create and use StyleHacks (think of them like registry hacks for your theme). It's not going to be free, but it will be priced very reasonably.

Let's jump right into the screenshots…

Starting Out

When you open the application, you'll be asked whether you want to start a completely new Visual Style based on the Aero theme, or you can open up an existing visual style, for instance one you've downloaded from deviantART or elsewhere.

Now that we've got the theme open, we can start browsing down into the different elements, for instance the Start button as you can see here:

You can export the current image as a PNG file, or import a new image to replace it. If you click on the image, you'll see a preview window that you can resize, and choose to export only one of the different states. You can also change the properties as seen above, such as turning transparency on or off.

Virtually everything in your theme can be customized if you know where to look (more on that in a future article), even down to the drop-shadow that Aero uses for open windows:

You can see the individual images that make up certain UI elements, like the close button… you probably didn't know that it's actually comprised of numerous images with a glyph on the top of it.

Style Hacks!

If you click on the "Import StyleHack" button, you'll get to one of the really innovative things about this application… you can import a small hack for a theme, so if you just want to change a single element you'll be able to browse online and find StyleHack files which can be used to implement a certain change without having to get into the details yourself. Think of it like downloading a registry hack file, but for your theme instead.

I imagine this will eventually create a community of theme hackers and a giant library of style hacks. For now, you've got a couple to play with:

You can even create your own StyleHacks… for instance if I created my own custom start button image, I could then export it as GeeksAwesomeStartButton, or whatever name I choose to give it, and then distribute it to my friends.

These StyleHacks have the potential to become something really interesting, and we'll be paying a lot of attention to them in a future article.

Importing XP Visual Styles

You can also import Visual Styles from XP, or downloaded from deviantART or elsewhere. You can't expect any XP theme to work perfectly on Vista right off the bat, but with a little tweaking most of them should work pretty well.

Once you select the .msstyles file, you'll be given a choice of which "sub style" to import… for instance XP has 3 main theme colors, so you can import just one of them at a time.

If you start looking through the resources, you'll see that they are now using XP style images imported from the theme.

Without doing a single edit to the theme, I was able to switch my Vista theme to a fairly decent Luna (keep in mind this is an alpha pre-release version I'm using)

The really impressive thing is that the start menu search box still works, even though we're using a theme file originally from XP.

With a few small tweaks using the style builder, I'm quite sure we could iron out the few inconsistencies.

Replace the Start Button Easily

Just how simple is it to replace the start button image? Turns out that it takes no more than a couple of clicks… browse down to Start \ StartButton and then pick your taskbar location… whether on the top or bottom of the screen, or if you have a double-sized taskbar choose "Middle" instead. (Of course if you are making a professional theme you should replace all of them)

Then simply click on the Import Image button and choose a file…

Click on the Save button to save the theme, and give it a name…

Vista Style Builder will then prompt you to switch to the new theme:

It's even smart enough that if the current theme is the active theme (while you are working on it), it will prompt you to switch back to Aero first, and then prompt you again to switch to the new theme.

And just like that, we have a new start button. What was that, like 7 clicks?

Of course that image doesn't look so professional… so I exported the original start button image, did a little photoshopping… and now my start button is a Firefox logo:

Looks pretty good, too… I'm not an expert, but it only took me a couple of minutes. Once the application is released, maybe I'll distribute a StyleHack with my custom Firefox button =)

Thoughts

This is an excellent tool, and judging from my experiences working with Andreas in the past, this application is going to be phenomenal. I plan to create an article series explaining how to actually make decent looking themes using this application, so stay tuned for updates.

Ave's Vista Style Builder [vistastylebuilder.com]