15web Wiggly Text Animation

PhotoShop/ImageReady Version: 7

  1. New file In Image Ready
    Size W300 by H100
    Transparent 72 RGB
    Click ok
  2. Choose your own colour use the text tool type your name.
  3. In the Layers pallet, right click and duplicate the text layer. You need 6 layers all together.



  4. Click on the second layer. Go to: Filter > Distort > Ripple



    As you are applying this you will get this message:


    Click yes each time.



    layer 1 do not apply filter to this layer.

    layer 2 amount = 65%

    layer 3 amount = 75%

    layer 4 amount = 85%

    layer 5 amount = 95%

    layer 6 amount = 105%

    Turn the eye off all the text layers but the first one on the bottom.


    Animation Construction
  5. Go to: Windows > Show Animation

  6. Next click on the duplicate Frame button in the Animation pallet.



  7. In the Layers pallet turn the eye off text layer 1 and turn it on text layer 2.

  8. Repeat this step each time until you get to the last frame 6.


  9. To check it out in your browser .on your tool bar the letter

  10. To save to the web save as optimized html and images

Back to PhotoShop Home Page