Skip to main content

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.

Comments

Popular posts from this blog

How To Import and Use Fonts

-Made by Chrome Fx Films

To use different fonts in your game, your going to have to acquire some fonts. You can go somewhere like 1001 free fonts and download ones you like and want to use.

When you download the file, you'll need to extract the file if its in  a .zip

The text file should have the extension .ttf. If you text files have a FFIL extension, simply rename the font file (yourname.ttf).
Drag the text file into unity to import. By default the Character variable should be labeled Dynamic.

The Dynamic setting means  that Unity won't pre-generate the texture, so if you look at your material containing your font, It probably will be blank. (read more here)
Now your over all objective should be getting your font to look like this (unless you prefer dynamic):
Where the characters of the font are not jumbled up and visible.
Now usually all you have to do to achieve this is change the Character variable from Dynamic to Unicode.
and that should work.
Now what some people over…

Handling Music and Sound Effects In Your Games

Initiative  While developing Treva's Adventure I had to figure out a way to handle multiple music tracks and sound effects in a clean manner or suffer horribly.  What was going to help me achieve a simple solution was taking all the different sounds and centralizing them in a single class in order to black box them.  Any other code trying to play a sound wouldn't even know the sound file's name.  All code trying to play a music track would reference a enum that defines all the track names.
Defining The Class Creating The Enum When I first started defining types in my enumeration,  I was naming the types to be exactly like the file name.  For a scary sound effect I had found a file named "ghost breath".  So around my code would be scattered lines like SoundManager.Play(SoundEffectType.GhostBreath);  This was fine until I found a sound that better fit the situation it was being used in,  and decided to use "ghost breath" for a different situation like a …

Don't Destroy On Load..

So if you want to keep an object or script that keeps up variables (or for any other reason) when you go from scene to scene, you need to attach a don't destroy on load static function, which goes something like this:

function Awake () {
    DontDestroyOnLoad (transform.gameObject);
}

The Awake function is call only once, when all the objects in the scene have been created. Read more about it here.

DontDestroyOnLoad has what ever is in the ( ) to not be destroyed when creating a new scene.

(transform.gameObject) is what will not be destroyed when the new scene is loaded, in this case, it will be the game object and all it's children the script is attached to.