Adobe Flash - Transforming Letters With Shape Tween

(Above: figure 1: Adobe Flash workspace)

In this lesson we’re going to learn how to do a shape tween using the alphabet in text.

We’re going to have letter by letter transformation.

Now open your adobe flash and select action script 2.0

Click on text tool icon (see fig1). Then on the center of your stage type in the alphabet letters from “a” to “e” just for this practice (see fig2)

(Figure 2: stage with letters from “a” to “e”)

Select the letters you have in your stage. And in your menu bar (see fig1): under the modify tab, click on the break apart (CTRL+B).

With the break apart option we can now separate the letters and select them individually.

Click on the selection tool (shortcut: V). Cut (CTRL+X) the letters from “b” to “e”. “a” is the only letter supposed to be left in your stage.

(Figure 3: 5^th playhead)

Right click the 5^th playhead in layer 1 of your timeline. You then click on the insert keyframe (F6) option. (See fig3)

You should be able to see the same letter “a” in the same position in your 1^st playhead found in your stage.

On the 10^th playhead: select in the insert blank keyframe (F7) option to create an empty stage. This time, paste (CTRL+V) the letters “b” to “e” in your stage.

Our goal is to keep letter “b” alone in the same position as to where your letter “a” was placed.

Since in the 10^th playhead you won’t see letter “a”, aligning letter “b” with the “a” would take much time. Now, to have it align perfectly is to use onion skin (see fig1). With onion skin, you can view the previous frame even though it’s no longer visible in your current frame. It can help you adjust easily the position of your letter “b” with your letter “a”.

On the 15^th playhead: do the same thing you did in your 5^th playhead by selecting the insert keyframe (F6) option.

For the rest of the letters “c” to “e”: follow the step you had with letters “a” and “b”.

(Figure 4: timeline and playhead)

Once finished you should be able to have the same set of frames in your timeline as you see in the figure above.

Next, click the frames then on your menu bar; under the modify tab; select the option break apart (CTRL+B).

Do the same thing to all the frames. Doing this will make the shape tween option available.

We can now apply the shape tween.

Right click on the frame and select the create shape tween option. Do the same thing to the 5^th, 15^th, 25^th, and 35^th Frames.

We’re creating shape tween alternately since we only have to transform one letter to another.

You should be able to see a green notch right arrow pointing to the next frame.

(Figure 5: applying shape tween)

We’re done. To check your work, just hold CTRL+Enter.