Icon 08 (My Computer)
Today we are going to do one of the more complicated icons, the "My Computer" icon. Because I am trying to keep these relatively simple I have decided to do a simple LCD monitor. I will be using the "Mesh Fill" tool to do 90% of this icon. I have done a video on using the Mesh Fill tool. You can view it here.
I have also done a video on doing the "Gloss" look, you can check it out here.
|
Step 1:
Like I said, we are going to be doing mostly mesh fills to make this. I start by drawing several Rectangles with the Mesh Tool, and shape them into my basic shapes.
.jpg) |
Step 2:
Now I start molding the shape of the monitor, with the Mesh Tool. Whites and gray colors on the nodes.
Once again check out the Mesh Fill 101 video for more on this technique.
.jpg) |
Step 3:
You can see the how using this technique is starting to give us some shape to the main panel.
.jpg) |
Step 4:
Now I start to do more mesh editing, to get the look I want. I am going with some bevels, like we have in the folder.
.jpg)
|
Step 5
This shows how you can get quite detailed with the mesh if you want. In the end this monitor will only consist of 4 mesh fills. and a few other graphics.
.jpg)
|
Step 6:
Now I copy my main shapes, clear the Mesh Fill, and fill them with a light grey.
Then I use the "Interactive Transparency" tool and apply the same "Brushed" texture I used on the folders. (I will do a video on this later)
.jpg) |
Step 7:
Now I draw a shadow mask and pull a shadow off of it, while using the same technique as in our earlier icons.
.jpg) |
Step 8:
Most of the time I will draw my own image for the screen; something simple. This time I thought it would be fun to use a bitmap.
I take an image I am using in the Galactic Civilizations UI, and skew it slightly, then crop it down to fit in the screen area.
.jpg) |
Step 9:
Now I ad some glare.
See the Gloss 101 Video on more on how to do this.
.jpg) |
Step 10:
Now once more we make the reflection on the floor, same as the earlier icons.
(Video on this to come later.)
.jpg) |
Finished Icon Image.
.jpg)
|
SS.jpg)
Download Finished Icon Here
|
|
That's the "My Computer" icon. We will be seeing this used a lot in icons to come. The image in it might change, but with this I can use it if I get the chance to do a Galactic Civilizations theme.
Read the other Icon-A-Day Articles: Icon # 1, Icon # 2, Icon #3, Icon # 4, Icon #5, Icon # 6, Icon # 7.
CorelDRAW for Skinners videos: Mesh Fill 101, Gloss 101.
And don't forget to check for all the Icon-A-Day icons as they get made, in the Miscellaneous Icons Gallery at Wincustomize.com |