Clubhouse Project Starter

Look Who’s Talking

Have you ever wanted one of your drawings to start talking?

This project starter shows how you can use Flash to create a character and sync its lips up to your voice.

As an example, we’ll show you how we made a talking birthday card for our friend Robbie.

[Show images from several different examples. For each example, perhaps show lips in several different positions.]

or

/
he /
ll /
o /

[More examples to come…]

Recording Your Voice
What do you want your character to say?
You can use the “Sound Recorder” software that comes with Windows.
Record a few words and then save the file. /

For our project, we recorded “Happy Birthday Robbie”.
Bringing Your Voice into Flash
Start with a new project file in Flash.
To bring your sound clip into the project library, choose File > Import.
The Flash library stores items (graphics, sounds, movies) for your project.
To see what’s in the library, choose WindowLibrary.
Your sound clip should be there. /
Choose File > Import to import your sound clip into the project library.

Highlight your sound clip, and then click on the play button to hear it.
Creating a Face
Our friend Robbie likes bowling. So for his birthday card, we decided to let a bowling ball do the talking. We used the Flash drawing tools to draw a ball with eyes and nose -- but no mouth yet.

What kind of face do you want to create? Do you want to create a talking object (like our bowling ball)? An animal? A person? A comic-book character?
There are many ways to create a face. You can use the drawing tools in Flash. Or you can import a picture you’ve drawn, a photo you’ve taken, or an image from the Web.
For now, create a face with everything except a mouth. Later, you will several different mouth shapes, to make a moving mouth.
Your project will consist of several “layers,” each of which you can control separately. You’ve just completed the first layer. Change its name from “Layer 1” to “Face”.

You can double-click on the name
of the layer to type in a new name.
Adding an Audio Layer
You’ll need to add a separate layer for your sound clip. Choose Insert > Layer
Label the new layer “Audio”
To add your sound clip to the Audio layer, drag the sound clip from the library onto the stage.
The sound clip is now in the Audio layer – but the layer has just a single frame. You’ll need to add more frames to hear the whole sound clip. Choose Insert > Frame (or simply press the F5 key) to add a new frame.
Keep adding new frames until you can see the whole waveform of your sound clip.
Press the Enter key to play what you’ve created so far. /
Here’s another way to add a layer

Make sure that the Audio layer is selected before dragging your sound clip onto the stage.

By default, Flash runs at 12 frames per second. So a two-second sound clip needs 24 frames. Our “Happy Birthday Robbie” clip was about 1.75 seconds, so it needed 21 frames.

Click in the top-right corner of the timeline to enlarge it and make it easier to see.

Read My Lips

To make your character look like it’s talking, you’ll need to create several different mouth shapes and change from one to another.

We looked in a mirror as we said “Happy Birthday Robbie,” to see how our mouths changed shape as we pronounced the words. We decided to make four different mouth shapes for our animation:

Try saying your phrase in front of a mirror – or watch someone else say it. Look for big changes in how the mouth moves. Think about what shapes you’ll want in your animation.

mouths for the claymation

character Wallace of
“Wallace and Gromit”


mouth action chart (from

Your First Mouth

Add a new layer and change its name to “Mouth”.

You’ll probably want to start with a closed mouth.
Rewind the playhead to the first frame, then draw the closed mouth on top of the face. /
Rewind to the first frame.
Make sure the Mouth layer is selected.

To keep the closed mouth for future use, store it in the library.

To store it, select it and then choose Insert > Convert to Symbol. Give it a name like “Closed Mouth”. and click the radio button for Graphic.

Mouth-to-Mouth Animation

Look at the waveform in the Audio layer to see where your voice starts. That’s where you’ll want the mouth to change shape.

Move the playhead to that frame, so that the red line is at the start of the first word in the waveform.


Now, click on that frame in the Mouth layer.

You’ll need to insert a keyframe here, to indicate a change in the animation. Choose Insert > Blank Keyframe

Decide what mouth shape you want to match the beginning of the first word. Draw the new mouth shape.

For the beginning of “Happy” in
“Happy Birthday Robbie,”

we used a wide-open mouth.

Rewind to the first frame, then press the Enter key to play everything you’ve created so far. (It might not look like it’s talking yet, but you’re almost there.)

If you’re happy with the new mouth, store it in the library (select it, and then choose Insert > Convert to Symbol).

Now You’re Talking

Now you have two mouth shapes in the animation. For each new mouth movement you want to add, you’ll repeat what you just did to make the second mouth:

1. Identify the next place in the voice clip where you want the mouth to change shape, and move the playhead to that frame.


For our birthday card, we decided the mouth

should become smaller at the “ppy” part of “Happy”

2. Click on that frame in the Mouth layer. Insert a blank keyframe by choosing Insert > Blank Keyframe

3. Add a new mouth. You can either:

-- Re-use a mouth that you already made. Just drag it from the library to the stage.

or

-- Draw a new mouth shape, then store it in the library.

4. Test out the animation by pressing the Enter key.

That’s it. For each new mouth movement that you want to add, just follow those four steps.


You can use the X-Y positions

in the Info window to help line

up the mouths. To open the Info

window, choose Window > Info

Let Your Voice Be Heard

Congratulations on bringing your character to life!

To share your creation with others, save it as a Flash movie by choosing File > Export Movie

You can post your Flash movie on the Web or send it to friends.

We’re creating a gallery of talking animations from all over the Clubhouse Network. Take a look at the gallery to get new ideas – and add your animation to inspire others!

[Note: We need to include a URL for the gallery]

Other Things to Try

* Make your character’s eyes move along with the mouth. (You’ll want to add an “Eye” layer.)

* Try other voices and phrases. Make your character sing!

* Import a different character for your animation. Try your favorite action figure, or a photo of a friend. You can use the same mouths – or create new ones.

* Add another character and create a conversation.

* Add other objects to the scene. Try Flash’s “tweening” feature to make the objects move or change size during the animation.

* Create a talking claymation character.

* Create an animation that expresses your views on an important issue.