Route Cafe

Smileys with The Gimp

This article may contain images that are too big for 56k users. Up next, learn how to make smileys with the gimp

Hello everyone, this is my first “tutorial” on how to make a smiley with GIMP. There might be a possibility that you see this tutorial a bit confusing if you are using the GIMP for the first time.

Now, let’s get started!

You will need:

1) A few cans of coke

2) Snacks?

3) And the gimp 2.4.x (SUPER RECOMMENDED)

In this tutorial I will cover the gif terror, it is suggested that you follow what I say at some point, and I’ll the rest to your creativity.

Fire up the Gimp

Create a 20 x 20 Layer, with 96 DPI. Transparent background

Choose the gradient

Create a new layer and do a circle that resembles a smiley for you. You can use either gradients or solid colors, which ever you prefer.

Gradients I used was

#ffe400

#FFFFFF

Use the gradient tool, and work your way till you get a perfect blend.

Stroking and blurring

In this step I stroked the circle without doing a new layer; I kinda suggest you do a new layer before stroking.

In this screenshot you’ll see the image with some kind of border, which you are right, I did use a border to it. Follow my direction, right-click the smiley template and select “Alpha to Selection” which should give you the selection back.

In Select -> Grow, 1.0

Then Select -> Border, 2.0

Why border or grow? What are these in GIMP? Well, they’d become pretty useful, gimp Alpha to Selection does not select all the pixels, which sadly seems like a bug. I chose grow so we don’t miss out those pixels before Gussian Blur it.

If there wasn’t any miscalculation, it should be exactly like the screenshot, more or less. If you notice that the selection are to close to the pixels, then do a Grow 1 pixel.

Now go to Filter -> Blur -> Gussian Blur (1.0 or 2.0, it might depend on how you would like it)

IF YOU DID PLACE A NEW LAYER FOR THE STROKE, BE SURE TO GUSSIAN BLUR IT.

Phew, we are done with the annoying part!

Give it a face!

That’s right! We are about to end.

Create three layers, for eyes and mouth. You can either follow on how I have it on the screenshot or try it on your own J

What? You finished already?!

The trick in GIF

GIFs are annoying in my opinion, loses too much quality, but oh well that’s the nature of gifs. Now you might want to use this smiley on a web/forum/blog/CMS whatever. Saving the picture won’t do, the edges will lose its smoothness.

The trick is!

Do another layer, I called it “treces” or … secret!

In your GIMP toolbar, you should see the paint brush, in that layer, put it below the smiley template.

Choose the paintbrush, scale it down if it’s too big. Choose the color white and color the edges. Look at the screenshot if you are confused.

Finalizing

Well, now you learned how to make this smile, and how to put it on your projects or website without needing to worry about anything.

Download the XCF File

Related posts:

1. Changing Lipgloss Tutorial
Change...
2. Stylish Round Corners
Learn how...