Musings on, Art, Skinning, Computers, and the True meaning of Life. (AKA The Lego Theory)
Setting the tone for the rest of the folder Icons.
Published on January 12, 2005 By mormegil In Icons

 

Icon 05 (My Music Folder)

     I was planning on doing the Internet icon today, but am still hoping to come up with something other than a globe. So I decided to do something else, something simple, but that plan failed as well so I did the "My Music" folder.

    Because this is the first of the "Special" folders it will become important in the overall look of the pack. Over the process of making this folder I have ended up with a few conventions. All the "Special" folders will probably have these things in common.

    1) They will all be the same size as the Open Folder icon.
    2) They will all have something in them, like a file or a picture.
    3) Most will have something sitting in front of them reflecting in the "Floor"

    These things can - and probably will - change, but at the rate we are doing these icons I will not have a lot of time to redesign icons, so hopefully these standards will look good with all the folders.

    Also, there are a lot of little techniques that I use making this that could use more explaining. Please let me know in the comments the one you would like to see details on, and I will do some tutorial videos showing how they are done.

    Ok, off we go....
 
Step 1

I was staring at the Open folder icons, wondering what to do with the My Music folder, and the first thing that popped into my mind was the folder overflowing with musical notes. I messed with this and it seemed a bit like overkill, but I kept the basic idea.

Using the Rectangle and Circle tools, I quickly draw up some "music" symbols; a few notes, and a CD. These will mostly be replaced as we go but I will use them as guides to the look of the folder.

Step 2

Now I take a copy of the Open folder icon and, using the Perspective tool, move my symbols around until I think it looks good.

Note: to make these folders go faster, I Group the front of the folder, and the back of the folder separately, that way I can quickly put things inside the folder. Like the CD's

Step 3
 

One of the easiest things to do on this Icon is the CD's. Use the Conical Fill tool to fill it with that Rainbow look. I am making these kind of bright because I don't want the pack to become too monotone.


Step 4

 Now I am going to go in and start making the notes. I will just draw over my quick ones, so I will stay with the one that will be hanging off the folder. All the notes will be done more or less the same way.

Using to circles, and the blend tool I make the main bulb.


 
Step 5

Using the Rectangle and the Mesh tools I go in to the stem and the flag of the note. I also give the bulb, and the flag some of the obligatory glare. Also I send the flag behind the front of the folder so it looks like its hanging.


 
Step 6

Now I make the rest of the notes. Note that I am changing the blends a bit on each one, but more or less they are all just copies of the first bulb. If the blend is still "Live" then you can change the colors of the 2 circles on the fly.

Step 7

Similar to the last few icons I do a lot of copying of the notes and making bitmaps that I can fade out to make our reflections.

Also I draw in some basic shapes that I need to do my non-standard Shadows with.

Step 8

Once I have my shadow done, I fade them out where needed to get that more realistic look.


Finished Icon Image.


 




Download Finished Icon Here

      Well 5 down 55 to go, I'm not quite sure what we will be doing tomorrow; will decide when I wake up. Still hoping for inspiration on the Internet icon.
     
      I want to do some mini tutorials on some of these techniques, and think I will try and do one each weekend. Let me know which ones you would like to see and I will put them on the top of my list.

Read the other Icon-A-Day Articles.
Icon # 1, Icon # 2, Icon #3. Icon # 4.

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

 


Comments
on Jan 12, 2005
I've enjoyed reading these tutorials every day. And I really appreciate you taking the time to write them. I have yet to attempt making any of them because I can't even seem to get past the drawing part of the folder for Icon #1. I wouldn't mind a little more in depth explanation about drawing the folder and giving it the proper 3d perspective.

Thanks.
on Jan 12, 2005
I love these tutorials... they really give great insight into how you achieve some fo the affects you do in your icons.


An idea that I thought would be recognizable as a internet icon, yet still different would be a globe thats wrapped around with a net of some sort (like a fishing net)...
on Jan 12, 2005
and another idea i just thought up for the internet icon:
make it the plug on the end of a phone line
(i know most people nowadays have broadband, but hey, a lot of us still use 56k with the good ole phone lines)
on Jan 12, 2005
Day #5 and the fun just gets better and better.

A question on layers - how many layers are involved in this icon, and which parts are on which layer?

A request on video tutorials would be in Icon #1, steps #2 and #3. It would be great to get some in depth understanding of your technique using the mesh tools.

I even went and got the free trial of corelDRAW - great program for this kind of work, might have to break down and invest.

Thanks a bunch, Paul.
on Jan 12, 2005
It's just not fair...you make it look SO easy!

But thanks for showing us feeble common-folk how a master works...I have enjoyed these articles very much!
on Jan 12, 2005
Paul,

One other question would be, "Do you have some presets on the tools that you normally use - anti-aliasing, feathering, etc.?".
on Jan 13, 2005
I love this set already and I hope there are more icons to come after the tutorials are finished.
on Jan 14, 2005
Great tutorials. And it seems they're getting better and better.
on Jan 15, 2005
Thank!Learn several recruit.
on Jan 20, 2005
thanks!!!that's very well!!i will do as you show!!!
on Feb 23, 2005
Man, you never fail to amaze me.
And yea, a vid tuto on the folder icon would be REAL helpful. i didnt quit get it.