This n That Graphics



Signature Title

At last, the tutorial on how to create an animate signature that I had promised. Before starting out on the actual tutorial, I would like to point out a few things.

First, this tutorial is a Photoshop tutorial, but it can be duplicated using Paintshop Pro. The frames are created using Photoshop, but I do use Animation Shop which comes bundled with Paintshop to produce the animation - (haven't learned how to use Image Ready which comes with Photoshop).

Second (and most important), if you have used or seen other signature tutorials, you would have noticed that almost all the tutorials out there have used the "erase method" to create the frames. By this, I mean, that a name is added to the signature graphic, then each letter is either fully or partially erased starting from the last letter on to the first letter. My tutorial is different, in that I do not do any "erases", but use a "paint" method instead. Why? I don't erase because you can sometimes leave minute traces of each letter that can be seen upon close inspection. This is especially true if you have added a drop shadow to the signature. Another good reason for using a "paint method" is that you will not have to do things backwards by having to start with the last letter.

Third, I also don't save out each frame of the animation. Animation Shop will open a Photoshop psd file. The Photoshop layers are used as the frames in the animation. Be sure that you have not added any special layer effects in Photoshop that Animation Shop can not handle, so don't forget to rasterize Photoshop text and merge any other layer effects with the text if you plan to use Animation Shop with your psd file.

This page will deal with how you paint in your letters to create your signature. While everyone writes differently, you can still get the general idea of placement of your writing tool. Please read and/or follow the steps below. Again, this is just an introduction. The main signature tutorial is Create an Animated Signature.

  1. Writing Frame #1 - Since I use the "paint method", you will paint in each letter just as you would write it. There is no need to do things backwards.
    1. Start with the first letter of the name at postion 1.
    2. Paint to position 2. (See 1a)
      (If you would like more detail in the animation, you can stop mid-point between 1 and 2, then begin a new frame, but please know that more frames add to the file size.)






1a.1a
  1. Frame #2
    1. Copy this first frame and use this second new frame to complete your first letter.
    2. Start at position 3 and paint to position 4. (See 2a)
 2a. 2a
  1. Frame #3
    1. Copy this frame and use this third frame for your next letter.
    2. Start at position 5 and paint to position 6. (See 3a)
 3a. 3a
  1. Frame #4
    1. Copy this frame and use this fourth frame for the next part of your letter.
    2. Continue from your last position 6 and paint to position 7. (See 4a)
 4a. 4a
  1. Frame #5
    1. Copy this frame and use this fifth frame for the next part of your letter.
    2. Continue from your last position 7 and paint to position 8. (See 5a)
 5a. 5a
  1. Frame #6
    1. Copy this frame and use this sixth frame to complete your 2nd letter.
    2. Start at position 9 and paint to position 10. (See 6a)
 6a. 6a
  1. Frame #7-Last Frame
    1. Continue this way until you complete all the necessary letters.
  

  Page 1 of 1  
Page added on 09-16-2002
Site Map Home