A Icon a day Keeps the Creative Block away. (I hope)
Saturday, January 08, 2005 by mormegil | Discussion: OS Customization
An Icon a day Keeps the Creative Block away. (I hope)
As some of you may have noticed, and gotten mad at me for, I have not had a new free Iconpack out for quite some time. This is not so much because I have been doing Premium Suites, it's because I just have not been able to find any time. Since I have started working at Stardock, over a year ago now, I have been doing a lot of fun stuff at work. Making video game UI's, Skins, and 3D. This has been sapping the amount of creativity I have left when I get home. Not to mention my cursed time sucking addiction of Halo 2.
This brings me to the point of this blog. Starting today, I am going to find some time every day to make one (1) Icon. This will give us a new complete Iconpack in about 60 days.
Here is my plan.
1) Design 1 Icon a day, starting with the folder. (Can't help but do this)
2) Post that Icon in the Misc Icons section over on wincustomize. This way anyone who wants to can get the Icons as they are made, and not have to wait for the completed pack.
3) Post a short blog on the making of each Icon. This hopefully will allow for feedback from users, and help make the pack better.
With that lets get started.
|Icon 01 (Closed folder)|
The folder is always one of the hardest Icons to do. It sets the style for the entire pack of Icons. I tend to spend the most time on the folder Icon, but I am going to force myself to crank this one out. Because this is the first article in this series I am going to show a bit more of the "making of" than I will have time to do in the future.
I am going to be using CorelDraw to do all the designing in this pack; if you want you can get a free trial copy at www.corel.com. If you are more comfortable with other graphics programs hopefully you will be able to get the basics of what I am doing and translate it into that programs tool set.
One last thing; I am going to be referring to a lot of tools and techniques over the life of this blog series and I won't have time to describe them in these articles. I will try and do some individual tutorials on how I use each tool and technique as time goes by, if requested.
Using the Rectangle Tool, I Draw a 1.28 x 1.28 box. I use this to make sure to keep my Icon in a square aspect, and so the Icon dose not become stretched or distorted when I make it.
Then I create another rectangle and, using the Mesh fill tool, "Sculpt" it into the back side of my folder.
Using the Mesh fill tool I go in and do some detail. In this case I am adding in some bevels and gradients. I am winging this, so I think I will go ahead and make the back black. I am going to go with a metal and composite look for this. I am doing a lot of this in the Galactic Civilizations GUI, and am in that kind of mood. Plus maybe in the process of making this pack I can use some of the ideas in the game screens, and vice versa.
|Step 3: |
I want some texture in all of these Icons because I am in that kind of mode at the moment, plus it is a simple technique that can make for a nice rich feel. I don't have a lot of time for these Icons, and I will be using allot of the more popular looks.
So using the interactive transparency tool, I take a copy of the back of the folder. Change it to 30% black and add a stretched wave texture, setting the transparency to Multiply.
Now following the same steps as in Step 1, I use another rectangle and the Mesh tool to mold it into the shape I want the folder front to be.
As in Step 2, I use the mesh fill tool to give the folder front some detail.
Now I use the same steps as in Step 3 to make transparent texture over the front part of the folder.
Then I draw some of the obligatory white glare on the front of the folder and the tab. Then use the Interactive Transparency tool to fade it out from top to bottom. Giving us that Shiny look.
Now I just draw a black shape that I can use to pull a drop shadow off of for my shadow. I am having to do the shadow this way because I want it to look slanted back, and I don't want the standard shadows.
The only trick here is to set the shadows opacity to 100% so I can do something with it in the next step.
Now I break the shadow apart from the shadow shape I drew and delete the shape. Then using the Interactive Transparency tool I fade the shadow out. Also using Arrange I send the shadow to the back of the folder.
I see a lot of people do a reflection of their icon in their screen shots, but I thought it might be fun to try and do it in all the Icons of this pack. So lets do it.
To do this I simply copy the elements of my folder, Flip, Move, and Skew them into the location I want. Then convert them into a bitmap (24 bit RGB).
Now to get that reflected look, I can simply crop the created bitmap to fit inside my guide box, and using the Interactive Transparency tool fade it out.
|Finished Icon image.
Download the finished Icon.
Now I use IconDeveloper, or other Icon program, to create the Icon. There are several other tutorials out there telling you how to do that so I will make you look them up. For this pack, in the interest of not limiting what we can design, I have decided to only do 32 bit Icons for Windows XP.
So there we go, Icon # 1 is done. You can download it here if you want to play with it.