Creating a Simple Windows Media Skin

This tutorial works for WindowsMedia 7.0, I'm not sure about higher versions.
Edit-Febuary 2006, Well, now this tutorial is terribly out of date, hopefully it still has some relevant information. I'm keeping it up because other sites have linked to it. There are no plans to update it for current editions of Windows Media.

This tutorial is for a simple 2 button skin you can use to play music.
What you need is this text file, winzip, and of course Paint Shop Pro.
Also I'm only giving instructions for basic graphics, a lot more is possible, mostly this just explains
how to create the skin in layers.

It helps to create a folder for skins your working on, with subdirectories for each one,
since the images have the same names.

Blade Pro is nice, but not necessary.
Step 1
Open up a new image, 200 x 100 pixels, and flood fill with
#C0C0C0, if you look at the text file, you'll see that's listed
as the clipping color, which means that it will be transparent on the final image.
Turn off visibility on this layer.
Step 2
Layer/new layer . Draw a circle on the left side, antialias unchecked, filled
with black, no stroke color. Layers/duplicate, Image/mirror, merge visible. Rename
this layer map.

Step 3

Select the circle on the left with the magic wand and flood fill
it with #00FF00, then select the circle on the right and flood fill it with #FF0000,
This is your map, in the text file, these are the colors that windows media marks as being
the play and stop buttons.
Step 4
Window/duplicate,leave the other image open. We will get back to it in a minute.
Merge all, save as map.bmp . It should be a white background with red and green circles.


Step 5
Go back to your original image, and select the red circle, layer/new layer, name it buttons, flood fill
with red, selection/float/ image/effects cutout, color set to black, vertical -4, horizontal -4, blur 33, opacity
78, selections, select none. Go to the map layer and select the green, then back up to the buttons layer, flood fill
with green, selections/float, apply the same cut out. OR apply your favorite ruby and emerald presets instead.

Step 6
Duplicate the buttons layer, and apply colors/gamma correction/ link checked, 180.

Then go to windows/duplicate
and delete all the layers except the duplicate buttons layer. Merge visible and save as hover.bmp

Step 7
Go to your original image, and delete both the map layer, and the duplicate buttons layer. You don't need them anymore.
Step 8
Go to the first layer of your image, and draw a white filled ellipse, antialias checked, covert to raster, and
go to image/effects/sculpture and apply the gold preset. Then text and apply the dingbat of your choice
between the two buttons, convert to raster again, and apply the gold sculpture again, then effects/drop shadow
vertical 1, horizontal 1, opacity 100, blur 1.

Step 9
Layers/merge visible. Save as background.bmp

Okay! All done in Paint Shop Pro, go to the file manager now.
Step 10
Time to think of a name for your skin, I use tinygem1, et cetra usually. Copy the text file and paste it the
folder with your bmps, rename it to whatever your naming your sk.wms, like tinygem1.wms, then add all those files
to a zip file and rename the zip file to have the extension .wmz (like tinygem1.wmz) and then put the .wmz file
in your windows media skins folder.

This is another example of a skin I made using bladepro. Click on the image if you want to download the skin.

Windows Media is copyrighted and owned by  Microsoft , you should be able to find more information
on making more involved skins at their site.
 

All images and text in this tutorial are ©Shala Kerrigan 1999-2008. Do NOT take these tutorials and load them in other places,newgroups, mailing lists, other websites. Permission is also not given to remote link the images in these tutorials.Permission is given to link to the pages themselves on my server.
Home
Beads
Misc Stuff
Links
Printables
Paint Shop Pro Tutorials
Blog
Email me