When I was brand new to skinning WindowBlinds, I wanted to have an animated start button, but did not know how to do it.

I have heard many say that the best way to figure out how to skin is to figure out someone else's skin. I did that in this case, but I figured I'd share what I've learned.

The tools I have used are Photoshop CS4 and SkinStudio 6.

1. Create your "Normal" start button image.

Do this as a single frame. WindowBlinds reads skin parts in either strips or stacks, but for starters, just do 1 frame. This image is 64x28 pixels.

I will not at this time go into creating the graphics. Suffice it to say, if you will observe my layers panel, you may notice that there are elements that have been turned off. These are glows for the mouseover and pressed states. I have found it easiest to create my image (comprised of several layers in a layer group) in its entirety, including variations, then copy the image for each instance, modifying layers as I go.

2. Keep your position correct with a background template.

This will make more sense in the next step.

3. Create your image strip for all the standard states of the start button.

These are the states, in this order--normal, pressed, disabled, mouseover, focus.

Notice the background template. Each box is the exact size of the whole graphic section for each button state--64x28 pixels. This can make it easy, as you build your image strips, to know for sure that each button is in the exact same position for each state. This is very important so as to not have a "jumpy button."

4. Build the rest of the frames.

In my case, I had a total of 14 frames. Since the first 5 frames are the standard states of the button, frames 6-14 are all for animation.

Mine was a very simple animation--a simple glowing flash that began with no glow, peaked with light, then returned to no glow. For this effect, I made sure that the basic button image in each frame was the same (one of the benefits of copying your layers over for each frame), and I simply adjusted the strength of the glow for each frame.

For instance, frame 6 is the button only with no glow; Frame 7 has the glow set to 25% opacity; Frame 8 has the glow set to 50% opacity; Frame 9-75% opacity; Frame 10-100% opacity; Frame 11-75%; Frame 12-50%; Frame 13-25%; Frame 14-no glow.

5. Save in Photoshop & Import in SkinStudio.

Be sure to save your .psd with all layers! I cannot stress this enough. If you ever have to go back and redo something about the graphic (and you will!) it is much easier to make minor changes in a .psd than to recreate your image from scratch.

After you have saved your .psd, then merge all visible layers, delete any layers that are not used, then save your file as a .png.

Once you have done this, it's time to go over to SkinStudio and import your image. Navigate to the "Start Menu & Taskbar/Taskbar/Start Button" section, then import your image. Make sure your frame count is set correctly. The default number of states is 5. In my case, I have 14, so I had to change the Image count to 14.

6.Animation Settings

Navigate to the "Animation" tab and adjust your settings.

In my case, I had to indicate that the animation should begin on frame 6 and end on frame 14. This is found on the right-hand side of the window. I also wanted my animation to loop, or repeat itself, so I had to indicate that once the the animation finishes the sequence from 6--14, it should loop back to frame 6 and finish the loop on frame 14. In other words, the animation with these settings is configured to play continuously.

You may prefer for your animation to play once then stop. Simply do not loop your animation.

I have mine set for "no delay" between loops. You can play with this also, if you wish, to make it so that your animation loops, but pauses before each cycle.

You can also configure the speed at which the animation is played by adjusting the "Animation Rate" settings.

Once you're done, go ahead and try it! Don't be discouraged if you mess it up: just keep trying until you get it right.

Now, of course, this is a tutorial on how to create a basic animation. For a more advanced technique, see this tutorial by Voidcore. https://forums.wincustomize.com/361485/#2336920

I hope this helps.