Icons Using GIMP 2.6

In this tutorial,  I'll be switching from 3D modeling and such to 2 dimensional aspects such as icons which alone can make a game seem more appealing and also more interesting.  I'll be using GIMP 2.6, a completely free photo manipulation and drawing software.  You can download here.  GIMP comes in many different languages, which makes it so awesome.   Okay, on to the icons!

When making icons, the canvas size is your choice.  I prefer to keep it a square, being no larger than 400px by 400px.  Although a smaller size would be preferable to prevent pixelation if you're going to shrink it.

I will be using the brush, eraser, eye drop, and scale tool.

To play it safe, I make a layer for everything (Lineart, solids, shadows/lights, etc.)  The first layer I do is a sketch of the icon, very rough and unclean.  (Also, I keep a white background just to make clean up easy for the final lineart)

I use a lighter color than black for my rough draft, and set it to a lower opacity when I draw the final lineart. Once The lineart is finished, I either delete the rough draft or make it invisible.

 

 

 

The next thing I do is make a layer off only solid color, and once I have my color scheme set, I duplicate the layer and add the shadows to the liquid in the bottle.

The last steps are simply finishing up the shadows.  I create 2 new layers, one for the bottle and one for the label.

 

I'm sorry if the picture/icon seems crude, but the point of this post was to show you the process of actually making the icon, not making this icon specifically.  One thing to keep in mind is to not be afraid to use a lot of layers, as long as you know what you're doing, that's all that matters.

A couple things before I wrap up this post.  One: the function of the eyedropper.

The eyedropper picks up a color, which when you add your shadows, this comes in handy.  Click on the eyedropper icon to pull up the settings/defaults. 

Check the box that says "sampled merged"  this way when you're adding shadows, it'll also pick up the colors on the solid colored layer so that you have a more naturally colored looking object.
   

And the last thing is that if you're making an icon like this, you may want to keep the same composition but want a different color.  In this case, merge lights, shadows, and the colors together (you can do this by right clicking on a layer and clicking "merge down") click on the color tab and choose "colorize"  From there you can change the hue, saturation, and lightness

I will do another GIMP icon tutorial on how to do icons using minimum layers while still being careful.  If you're new to GIMP, I would suggest playing around with it and learning how to use the different layer modes and different tools.  Two other layer modes that are important are multiply and overlay.  Overlay comes in handy when applying textures and multiply comes in handy if you accidentally do something on an opaque layer and you need to color under the lines (What you do is set the opaque layer to multiply and set another layer under it.  What you do to the layer bellow will show up on the top layer without covering the lineart)

Yeah so, I save my icons as a .psd (adobe photoshop file) and then import it into Unity, this way when you don't have a background it stays transparent.