The Basics

       Okay, my old Smiley Tutorial was rather bland, but it got the job done.  However, its high time I updated the tutorial.  As you can see, the page itself is a little more interesting (but not much ).  I'm also using a more interesting smiley as my basis for the tutorial, one that looks better and is more detailed, and I'm also going into how to animate the smiley.  Please note, however, that this is going to be a Paintshop Pro 7 heavy tutorial, as that is what I use.  I find it to be plenty powerful, it can share plugins in with Photoshop, and the sister program Animation Shop is easy to use.  You can download free trails of both Paintshop Pro (henceforth PSP) and Animation Shop (AS) from www.jasc.com.  On the up side, PSP and AS are about a tenth of the cost of Photoshop, and its just as good and easier to use to boot.  But, on to the smilies!  For this tutorial, I will take you through building my Fighter smiley, step by step.  When we're done, this is what we will have:



Step One

    The first part of any basic smiley is a circle.  This is obviously going to be the smiley's head.  Now, there are many differant sizes of smiley, but the ones used on the Dungeons and Dragons message board (for whom I'm making this tutorial), are all the same basic size, 15 pixels tall.  To get a perfectly round smiley of this size, its actually surprisingly simple, even to draw it freehand with no circle tools at all.  In fact, I find that the circle drawing tools are rather poor when making something this small.  The entire circle is just three simple lines, repeated over and over.  A single pixel, a line two pixels long, and a line five pixels long, show below.





    Okay, pretty simple so far.  Now that we have our basic pieces, we need to arrange them so that it appears to make a circle.  Once arranged, just rotate them around so that they make a circle.  I know that didn't make much sense, but just look at the pictures below, and it'll show you what I mean.







    And thats how we start making a Smiley.  I'd suggest saving this circle as a "BlankSmiley.xxx" for future use.  Although it only takes a few seconds to whip one of these up once you're used to them, its a pain to have to make them over and over again for every new smiley you make.

    Now that the basics are done, we'll move on to adding some color and some features to our circle.  This is where it'll start looking like a real smiley, and not just some weird geometric hocus pocus.  This isn't geometry class, after all.


Hosted by www.Geocities.ws

1