Skinning is a process filled with creative moments, frustration, and compromise.

A lot of things have to come together before the skin is fully realized and uploaded to the community. The design fase may be the most important and lengthy part of what goes into building a cohesive Windowblind.

Today I thought I'd share som images giving a bit of insight into my process. I like to document my progress through screenshots as I go. Not all skins go through a huge amount of changes along the way, but I like to capture the moment if and when something significant is altered.

Cyber Shadow started out with this image:

It was part of my previous skin which explains the gradient and texture applied. This image, for various reasons never seemed to fit in so I dropped it from the design.

I still wanted to use the image, but so as not to repeat myself I changed the globe to yellow. I felt that using a central image and building the design around it would be pretty cool. This was the first part of the design:

At this point it could have been either the top or the bottom of a start panel.

Next, you can see that I have started on the start panel by expanding the frame upwards. I felt that the globe image with the bars jutting out on each side would do nicely for the shutdown and searchbar area. Also notice that I have rounded off the corners compared to the image above. I've also nixed the drop shadow :

Below shows the start of a taskbar design taking place. I drew a smaller version of the "eye" for a start button which fits in nicely. Some changes on the start panel have happened as well. I changed the round "dots" that separate the 2 sides to a squared dotted line, but repurposed them as state indicators on the taskbar buttons. Also a subtle but important change overall was that I switched the lighting from 120 degrees (top left) to 90 degrees (top lit):

Now we're getting somewhere! First draft on the window frames in progress. It was at this point I felt that I actually had a skin and I should start thinking of a name. The only notable change to other areas was to square off the corners of the startpanel mouseover image:

Next, it was time to start building the skin. Up to this point, I hadn't even opened SkinStudio. I don't like to start building before I actually have a skin name. Here you can see that I added the "cutout" in the tray area to make room for the expander button. Also added a dot and cutout area to the startbutton to better mirror the window titlebar buttons. I dropped the indicator dots on the taskbar buttons due to limited space. Decided as well to go with a solid line rather than dotted line in the start panel. I could have made it work, but realized that it was out of place seeing as I didn't have a dotted line anywhere else. Also notice that I made the bars for the shutdown and search area larger just to give myself a more room to play with:

Finally, I had the skin finished. Changes done for the final version were to make the "dots" bigger on the whole skin, and finally settle on a taskbar button that I both liked and fit in with the rest of the theme:

Lastly, 2 lighter substyles for maximum usability!

Hopefully some of you found this even remotely interesting. I just wanted to share with you all how a design can evolve from a single image or even just a color combo into a full fledged skin.