Home
Join our PSPand Animation classes
Free gifs 4
Halloween
Creepy Sounds
Color Scheme Helper
Stationery
PSP
Tubes
Masks
Resources
Tutorials
Animation
Movie-Tutorials
TEXT SLIDE ANIMATION
HootyTutŠ by Doyle Allen 2/21/04
A short course on Placement Animation
Approved by the HootyTutTestersGroup!
Skill Level: Advanced-Intermediate
Needed: Paint Shop Pro (8) Animation Shop
1 Open a New Transparent Image
350 x 200
2 Pen Tool
Settings shown below:
Note: Turn off the background color
in the layers/Material palette!
3 Left click on the left bottom leaving
a little space from the bottom and left
side as shown in the illustration below.
Hold the Shift key down & click on the
right which will make a straight line
across.
The Ilustration in step 5 will help to
aid in the real placement.
4 Objects/NodeType/Curve Before
OR
Right Click on the node as shown
above & Select NodeType/Curve Before
You will see a little circle appear almost
in the middle as you see below.
5 Left click on that (circle) Node and
drag it down as shown below.
6 Text Tool (v)
Note: Turn the background color back
on if you want 2 colors in your text!
Note: You will see that I have chosen text
type Bolder Reg.. if you don't have it then
just use a text that is sort of fat and easy
to read.
7 Move your cursor to the center area
of the line and you will see the cursor
change shape when you have
connected to the drawn line, then left
click.
You will notice that a new layer is
created because it is a new Vector
layer .... kewl!
*****Now the fun begins!****
8 Type in a short phrase as I have done
and you will see the text run along
the line and up the curve on the end!
WEEeee!
NOTE: If your text is not centered just
click cancel and click on a better spot
on the line!
To make any changes the words
must be highlighted in the text box
that you are typing in.
This could be Text size, color changes,
Font Type etc.
Just be sure that your text is long
enough to run up the right side.
9 To Change the color on one word
as I have done, highlight the word in
your text box and then change the
color. You can see that only that
changes!
10 Click apply when you have it all
looking as pretty as you do!
Yes ..... you da' bomb! LOL
11 Click on the + to open up the layers
within the Vector layers as shown
below.
12 Turn off the New Shape layer (X)
which is the layer that has the line on
it.
13 Layers/Convert to Raster Layer
This will make the Layer group 1
layer, with of course a transparent
layer underneath it.
14 Effects/3D Effects/Inner Bevel.
Note: These bevel settings will remain
the same throughout this tutorial.
Apply more than once if you'd like.
14 Effects / 3D Effects/Drop Shadow
Note: Settings will stay the same!
Settings:
V & H both = 4, Opacity = 34, Blur = 6
Color = Black
15 Now you need to choose a tube &
put it on a New raster layer.
Use the method that suits you best.
It could be an object,person, animal
or even a heart shape.. up to you!
16 Image / Resize
Be sure that All Layers is unchecked!
Make your tube a size that is compatible
with your text size. About the same
size as is seen in my examples is
probably best for what we are going
to do.
17 Apply the inner bevel and the
drop shadow to your image.
18 Mover Tool
Move your tube to the upper right hand
corner where it will be out of the way
as you will soon see.
Be sure that your shadow does not
get go off the sides of the corner!
19 Duplicate the Image of your tube 19
times by clicking on the icon as
shown below!
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
POSITIONING THE TUBE SEQUENCE
Please read:
In the next steps basically you will
take one tube image at a time by
clicking and dragging the image
from the right top corner and moving
it to the center area.
I could make this process very
cumbersome by saying turn off and on
layers as we go but for the most part
you will need to see where the last
one that you placed is and the string
of images before to aid in the
positioning of the next tube.
Warning: Now and as we go along it
will be a good idea to save repeatedly
as a type=Paint Shop Pro Image with the extension
of your name as .Paint Shop Pro
As you go through the different rotations
you should be able to gain a new feel
for how many degrees and which way you
rotate them. I know on a lot
of mine I rotated between 30-60°.
Below is what all the layers in position
look like. Pay particular attention to how
close each tube is placed next to each other.
1 Mover Tool :
Click and drag the 1st tube image to
the First Letter on the left side and
set it on top with the right side raised.
Then drag the next one over and
rotate it to the right about 18°. As if
it is falling over.
As your tube sequence goes to the
last letter you will need to rotate them
so the bottom of your tube is flush
on the tops of the letters.
Continue adding then across the text
getting a little wider each time as you
work your way across.
What this will translate in to when we
animate it will be it is getting faster
as it makes its way across the text.
TIP: I used the keyboard shortcut since
this is used repeatedly throughout
this section. Ctrl + R will call up
the free rotation box.
This shortcut saves you a lot of steps.
Tip: It will be benificial to turn off the
tube layers that goes across the text
now before you continue so you can
see what you are doing. I would leave
the one that you placed on the first
letter for a visual aid though.
Have you saved lately?
2 As you start coming off the last letter
you will need to start rotating to the
left instead of the right to start the spin!
About the 2-3 one away from the last
letter should be positioned at the highest
point of your transparent image.
Then rotate them around as it starts
it's decent and heads for the Bounce
sequence.
As we do the twirling sequence.
Notice how the head becomes the
rotation focal point ....
Food for thought:
A complete rotation can be made in
4 moves of 90° each.
(90°,180°,270°& 360°which brings you
right back to where you started.
3 Now click and drag one at a time over
and imitate the drop bounce sequence
shown below using the Image/Rotate
Free Rotate .
Be Sure that the All Layers is
unchecked in the settings!
4 Now for a little clean up!
If you have extra tubes showing on
the upper right, turn the layers off on
the bottom until none show in the
upper right corner.
All the other layers need to be turned
back on.
So your text layer and the whole
sequence should be showing.
See image right above step 1.
Yours should look similar.
You should have a transparent layer
on the very bottom.. activate that and
add your watermark to that one layer.
5 File/Save As
File Name needs to end with .Paint Shop Pro
Save As Type: Paint Shop Pro Image
OK!
TIP: Do not close out Paint Shop Pro or your
layers.. You may want to come back
later to move some of the tube images
as you see how they look when they
are animated.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
OFF TO ANIMATION SHOP!
TIP: You can use the Move Tool in
Animation Shop to make minor adjustments.
Be sure only a single frame is
selected when you do this though.!
1 File/ Jasc Software Products/
Launch Animation Shop!
2 File/Open
Find the file that you just made and
saved as a .Paint Shop Pro and open it!
3 You should see ani-frame 1 with your
watermark on it. Left click on the
transparent center and drag it off!
Kewl huh?! ;0)
4 Now you should see your TEXT
showing as frame 1.
Click on it and drag it off.
Now you have 3 separate pallets to
work with.
Watermark,Text and the tube ani frames.
5 Click on the tube stack to make it
the active one.
6 Edit/Select All
7 Animation/Reverse Frames
8 Scroll all the way to the right and
last frame & it will show you at the
bottom F? how many frames you have.
Mine says F:17, so I have 17 frames.
Remember how many you have.
9 Click on your Text frame to make it
active.
^*^**^*^*^*^*^*^*^*^*^*^*^*^*^*^*^*
10 Edit/Select All
11 Edit Copy
12 Starting your count with the number
"2" hold down the Ctrl & Shift buttons on your
keyboard and tap "L" however many
times it takes to make exactly as
many frames as you counted from
your tube frames.
Done? Do a double check by scrolling
all the way to the right and look! F?
13 All the frames should already be
selected.
14 Edit/Copy
15 Click back on your tubes stack
and Edit/Select All
16 Edit/Propagate Paste
17 Edit/Paste Into Selected Frame
Note: The Text will move with your
cursor as you move it into position.
When you are satisfied that it is in
the right spot left click and it will
paste.
If you are off you can just undo and
repeat.
***^*^*^*^*^*^*^*^*^*^*^*^*^^*^*^***
18 View/Animation
Starts the animation
19 View/Animation
Stops the animation.
If you are pleased with your alignment
then continue. If not then Edit Undo
and try again!
20 Click on your Watermark to make
it active.
Repeat steps 10-17. ^*^*^*^*^*^*^*
21 Dropper Tool:
Select a good background color.
Remember that too dark of a color will
interfer with seeing the dropshadows.
Lighter is better!
22 Animation/Animation Properties
(a) Click on Opaque
(b) RIGHT Click on the color block and
(c) select the color you chose for the
BG color.
23 File/Optimization Wizard
Click to set as "Animated Gif File"
"Create a new animation"
Set for the best quality but smallest
file size.
24 Left Click in the middle of frame
one so it is the only frame active.
25 Animation/Frame Properties
450
This will prevent the viewer from
getting bored or aggrevated with the
animation running over and over.
More enjoyable you might say.
26 View / Animation
File/Save As
Save as a gif to your document files.
**********************
Afterthoughts:
The reason we add a background
color and do not save it as a
transparency is to hold the file size
down. The one I am doing along with
this tut for instance would be 200+
kb's, but with the background added
it is 76 kb's! Viva la' difference!
Position adjustments can be made
in Animation shop using the mover
tool.
In Letter Creator use the eye dropper
at the top to select the same background
color as you have made
for the animation.
In the Header Section put it at top
left.
Note: For a footer you can use something
like a pen, flowers or something that
goes along with your theme.
Position it in the FOOTER page to
the right.
Make it smaller that the header.
If you have not done an animation
like this before then it will take a lot
of time to do it the first time.
I would have to think that if one
done this say 5-6 times and not just
go through the moves but understand
and grasp the concepts creating
placement animations would open
wider and wider. , and I am not
telling you to do this but I do
believe it to be true.
Well that's all I can think of to tell you
about this simple(?) but cool ani!
Hugs
Hooty
Remember to Watermark your creations!
****************************************
Thanks to all the great testers that help me to
make these tutorials as good as they are!
The testers are always a vital part of the end
results of what you end up using.
Special thanks to all the testers:
Kynda, Calvin, Jynx, KMRA, Maria Rosa, Linda D.,
Laurie, Adrienne, Jacqueline, Meshi Michelle, Paula
Sue and Jynx!