FrisbeeMonkey Logo
Home   Winamp3   Outdoors   Photos   blank

{ Main }{ Tutorial }{ References }{ Skins }
UpperLeft blank Winamp3 - Tutorial - Graphics Help UpperRight

This page by no means aims to teach you how to create amazing graphics. For help on making graphical masterpieces, check out the links on the Resources page. If instead you came here looking for pointers to keep in mind while skinning or for help with some of the recommended skinning tools, then you are in luck.

Things to keep in mind

There are a few things you should consider when making the graphics for your Winamp3 skin. One of the primary things that some skinners forget is that not everyone has XP or 2000, which means that they cannot utilize Desktop Alpha. To encompass the largest potential userbase possible, be sure to make your skin look decent even if you cannot use semitransparent pixels. If this means making a background for DTA and a background for non-DTA, take the extra time and do it.

Another important thing to remember when designing your skin is that your are creating a front-end for a multimedia player. Try to make your buttons and sliders easy to find and their function obvious. No one likes guessing where the things are nor having to click each button to find out what they do.

As you increase your skinning ability, you may get the crazy idea of trying to put something over the Playlist Editor, the Media Library, or some other Components. This currently cannot be done. The Playlist, the AVS display, and a few other things are always on top of their Containers, no matter what you do with the XML. Perhaps this will change in later releases, but until then, save yourself the headache and don't plan on being able to do this yet.


If you choose to do your graphics with Photoshop, this little program will save you lots of time and help you maintain some sanity when positioning your graphics. The program takes your layered PSD file and outputs two XML files and a PNG for each layer. One of the XML files contains the element tags for your skin, the other contains the info for the layers. This second file is what makes this program so invaluable. The skin.xml has each layer's x and y coordinates for you to use. Later versions of the program do more complicated things, but I have found little use for anything beyond getting the individual PNGs and the coordinates for each layer.


Not everyone has a 40GHz machine with a backbone connection to the internet. Do yourself and all your potential users a favor by using PNGCrush on your PNG files. It will reduce your filesize without sacrificing any quality. Copy pngcrush.exe and this batch file into the folder with your images. After running the batch file, a folder named "crushed" will be created with your compressed files inside.

Gamma Worker

RPeterClark's Gamma Worker will help you create color themes for your skin. Simply install the program, load the image you wish to adjust, and then change the settings. The program will then give you the gamma values to use in your XML for the gamma group. For more help or to get the latest version, visit the Winamp3 forums, particularly this thread.

BottomLeft blank   Up One Level   blank BottomRight

FrisbeeMonkey Logo Foot
Sign Guestbook     Email