Creating DirectSkin Visual Styles With SkinStudio DE

Monday, August 22, 2005 by koop | Discussion: Skinning

This article provides a brief overview of how a visual style, commonly referred to as a skin, is created with SkinStudio DE for applications that utilize Stardock's DirectSkin technology.

DirectSkin allows you to apply custom visual styles to your application by replacing all of the standard Windows controls with your own graphics. SkinStudio Developer's Edition is an easy to use graphical skin editor, complete with context sensitive help and dynamic previews.

SkinStudio DE is not an image editor, however. First, you must create your skin images in a graphics application, such as Adobe Photoshop or Jasc Paint Shop Pro. Then, you can use SkinStudio DE to assemble them into a skin.

When you create a new skin, you are presented with the default Windows XP visual style as a template. The easiest way to begin assembling your skin is by opening the default images in your image editor and replacing them with your own.


The best place to start is the window frame. Once you've completed the window frame and titlebar buttons, you'll get a first glimpse at how your finished skin is going to look. SkinStudio's live previews let you fine tune your skin as you work, without having to apply it to your application to test every change.


Next, you can continue creating images and assembling the menus, tabs, scrollbars, buttons, and other controls. Many of them can be seen in the main Window preview, others are shown in the Controls preview. SkinStudio makes it easy to visually adjust the sizing margins for each control to define which areas should stretch or tile.

In addition to the previews, you should go through the Explorer tree on the left pane to make sure you have completed all of the sections.

You'll also need to modify the colors shown in the Classic Colors preview. There are many cases where applications make use of Windows system colors. These colors include the classic titlebar, window backgrounds, and 3D objects, among others. You'll want to adjust all of the color settings to match your skin.


Once all of the controls have been skinned and the colors adjusted, you're ready to test the skin with your application. At this point, you may find that you need to go back into SkinStudio and make final adjustments until your skin is perfect.

With its hierarchal tree structure and complete attribute listing for each section, SkinStudio Developer's Edition is a powerful tool that offers everything you need to turn your graphics into a custom visual style for your application.


Stardock Media offers a full range of design services including application interface design. To learn more or for pricing, contact corpsales@stardock.com.

SATYROBE
Reply #1 Monday, August 22, 2005 6:41 PM
Bookmarked this as a little tutorial and reminder for future use. Was always curious about those tool versions. Seem expensive but worthwhile. Not that deep into skinning myself yet anyway. But thanks. On a SkinBase forum, several months ago a young female was inquiring for help saying she was new to skinning her own VB program. A Frenchman responded with a link to his solely french page seeming to feature rather basic WB tutorials. Maybe he thought she misspelled WB with VB. I felt she might need DirectSkin but did not add a comment. I only stumbled there because I had managed to upload my first .logonxp there and was interested in the forums. Plus I thought by now she would have solved her problem some way. Or I may have underestimated the french guy in lack of knowledge of his lingo...

Maybe she would like a link to this, or someone else reading her post would.
SkinStudio
Reply #2 Wednesday, August 24, 2005 10:45 AM
That's a great introductory article!

There are lots of other differences not aparent for skinners (as it was written by a skinner) but targetted at developers, (I'll try to write more about those sometime in the future), but this article aimed at artists making DirectSkin skins rather than developers is really really good.

A must read.
SATYROBE
Reply #3 Saturday, August 27, 2005 10:33 AM
Some well paying clients may not be skinners, but yet another group. At http://www.actualtools.com in Russia, some forums display inquiries of their rather content customers for the actual tools window managing program as to how to change button positions or placings normally untreatable. For instance, apple´s quick time viewing windows show their own skin and titlebar not reskinnable with normal WB and not adjustable with actual title buttons. Would direct skin be able to change that? And would you need DE version of WB then? These people do not even think in terms of skinning often. Yet I know some skins exist for them in WB, i. e., without closing buttons like they want or with the closing buttons placed elsewhere to avoid mistakes.

Another problem of theirs was removing closing buttons on DOS application windows. Seemed to be a toughie for the developer of actwinmanager 3.7, and for me too using normal wb. What about this problem?
danioc
Reply #4 Saturday, September 3, 2005 7:49 PM
Great in article, help skinners to know more about SkinStudio DE and DirectSkin, it's a great way to start using skinner skills commercially

Please login to comment and/or vote for this skin.

Welcome Guest! Please take the time to register with us.
There are many great features available to you once you register, including:

  • Richer content, access to many features that are disabled for guests like commenting on the forums and downloading skins.
  • Access to a great community, with a massive database of many, many areas of interest.
  • Access to contests & subscription offers like exclusive emails.
  • It's simple, and FREE!



web-wc01