Submit Your Article
Home Articles News Tutorials Videos Add An Article
Topics: Design Photoshop Programming PHP CSS Java Database Web Development Javascript Ajax
– Close + Open

Find Out More About DevWebPro!

Sign up for the newsletter


» Terms & Conditions

Welcome to the New DevWebPro!

DevWebPro Includes:
  Hundreds Of Tutorials   Developer News
  Unique Gadget Videos   Tons of Topics to Discuss
  Expert Advice   We Will Publish Your Articles

Tard Emoticons

Monday, July 9th, 2007
Text: Decrease Font Size Increase Font Size | Print Print Article | Share: Delicious Digg StumbleUpon Post to Twitter Post to Facebook

In this tutorial you’ll be learning how to create a nice tard emoticon to animate later on.

You’ll be make something like this:

Step 1:

I’ll have my image zoomed in 1600% all the time, so that you know.

Make a new image, 19×19. Get out the pencil tool with 1 px and draw a circle like this: (note: the formula is 5, 2, 1, 2, 5, 2, 1, 2, 5, 2, 1, 2, 5, 2, 1, 2.)

23.jpg

Step 2:

Now, make the foreground color #5a7d90 and the background #426373. Take the Pencil Tool again and draw this area of the black blue (foreground color):

And the other area the background color (press X to switch the colours) .

Step 3:

Alright, now we’re going to shade it. I will not use Gradient Tool to shade my emoticon, because that will look too simple and noobish. And you don’t want that ;-) So I’ll show you how I shade my emoticons. Please look carefully on what to shade which color.

This will take a while but if you’ve done this correctly, you should have this:

Please note that his is my own way of shading emoticons. I don’t want everyone to use this so if you could create your own once you get the hang of it.

Step 4:

Let’s make a tard face now. Tard faces only have 2 eyes of 1 pixel, so don’t make them too big.
Grab the Pencil tool again and make two 1 pixel dots (#426373) like I did:

Step 5:

Now we don’t want a emoticon without a mouth, do we? Let’s create a shocked tard. Do this by creating a open mouth with these colours: #426373 (dark areas) and #5a7d90 (light areas). As you may notice, these are also the colours used for the outline of the emote.
Make your mouth like this:

There! You’re done. Save it as a gif or png. (In .png format, the emote won’t be resized in MSN).

Here’s your result:

Topics: ,

Leave a Comment

DevWebPro is an iEntry Network ® publication - © 1998-2010 All Rights Reserved