• Home
  • About
  • Advertise
  • Contact Us
Blue Orange Green Pink Purple

Animated Signature

Posted in Animation. on Thursday, May 7th, 2009 by Tutorial Park Tags: photoshop, signature, tutorial
May 07

Animated SignatureHave you ever had the desire to create a cool signature on a forum, an animated banner, or just something that moves? Here I will tell you how to create an inscription, giving you skills that will serve as the foundation for further experimentation. You can create …



Have you ever had the desire to create a cool signature on a forum, an animated banner, or just something that moves? Here I will tell you how to create an inscription, giving you skills that will serve as the foundation for further experimentation. You can create such things with Adobe Photoshop and Adobe ImageReady. My tutorial will show you how to do something like this:

Pink elephants are frolicking about the room... running and leaping, the pigs are happy.

This tutorial consists of two parts: Photoshop and Image Ready.

Part 1:

1. Open Photoshop .

2. Create a new document having the size of 750×50 (pixels).

3. Select Type Tool Type Tool (T). Set size 16xp, font size – Comic Sans MS, font style – Bold, font color – #FE5858.

4. Type the text: “Pink elephants are frolicking about the room… running and leaping, the pigs are happy.”

5. Duplicate the layer twice (Layer > Duplicate Layer…). Rename the created layers something like “1″ and “2″.

6. Rasterize “1″ and “2″ layers (click on “1″ layer and then Layer > Rasterize Layer > Layer. After which you should repeat the same procedure with “2″ layer)

7. Now hide each layer except “1″. (click on the eye near the layers you wish to hide) After that select “1″ layer (left button click on it).

image 3

8. Select Rectangular Marquee Tool Rectangular Marquee Tool (M).

9. Now with the help of this tool, while pressing and holding shift, select the letters in the text (the length and width selected for every letter is insignificant – the most important thing is to ensure that you have completely highlighted the letters). You should choose letters, including all spaces, having from 2 to 5 symbols, but in such way that the intervals are various.

10. Select Move Tool Move Tool (V) and drag the chosen section about 7-10 pixels upwards.

11. Deselect by pressing ctrl +D. Now you may have something like that:

1

12. Now unhide and select “2″ layer (click on the eye near the layer, then on the layer itself) and select the letters as described in the ninth point, but with the exception that you should not chose the very same letters, and preferably in a way such that the main portion of the letters was neighboring the previous ones in the previous layer.)

13. Select Move Tool (V) and drag the chosen portion about 7-10 pixels upwards.

14. Deselect by pressing ctrl +D. Now you may have something like that:

2

Now it is time to move on to the ImageReady parts.

Part 2

1. Open ImageReady Jump to ImageReady (click Jump to ImageReady or press Ctrl+Shift+M).

2. In the Animation panel (if you cannot see such panel, then go to Window > Animation) duplicate the first frame twice (double-click on Duplicate Current Frame 2 times)

Animation Panel

3. Set a delay of 0.1 seconds between the frames.(under the described frame click on the drop down menu, where you will choose 0,1)

Animation Timer

4. Choose the first frame. Make only the layer with the original text visible.

5. Choose the second frame. Make only “1″ layer visible.

6. Choose the third frame . Make only “2″ layer visible .

7. You can test your results by clicking on Play/Stop animation on animation panel.

That’s all there is to it. All that remains to be done is to save the picture – File > Save Optimized as…. (Ctrl+Alt+Shift+S), give it a name and push Save.

I hope this tutorial was helpful for you and helped you better understand how to work with animated figures (and Pink Elephants).

3 Comments

  1. hardik on May 11th, 2009

    its a common thing for any photoshop expert

  2. esotericbob on May 19th, 2009

    As an amateur (photoshop virgin) your tutorial was easy to follow and am thankful for the presentation.

  3. twilight desktop wallpapers on December 23rd, 2009

    you just found a new daily reader Thanks :)



Leave a Reply

Spam Protection by WP-SpamFree

Tutorial Park

  • templated business
    templated business
  • Search


  • Categories
    • Animation
    • Drawing
    • Freebies
    • Photo Effects
    • Text Effects
    • Tutorial Reviews
  • Recent Tutorials
    • 3D Valentine’s Day Typography
    • St. Valentine’s Photo Manipulation
    • Na’vi Avatar Photo Manipulation
    • Thanksgiving Wallpapers
    • Google Text
    • Jack-O-Lantern Drawing Tutorials
  • Featured Partners

      Web Design Library

      flash websites

      build a website

      flash intro
  • Tutorial Park Tags

      angel animals Animation ball batman business car Casino Royale cat catroon design digg earth frog glass half life 2 Harry Potter hearts icon icon set James Bond jewelry logo lollypop mafia monster navigation bar photo photoshop photoshop tutorial photoshpo plastic poster quake sunflower template transformers tutorial typography vector video vintage wall-e wallpaper watercolor

      WP Cumulus Flash tag cloud by Roy Tanck requires Flash Player 9 or better.





  • Home
  • About
  • Advertise
  • Contact Us

© 2004-2010 Copyright Tutorial Park. All rights reserved.
Designed by FTL Wordpress Themes. Website promoted by SEO Software.

Back to Top