Seymour's Adventure (for Macromedia Flash)


Start by creating a new document in Flash. Make it 540px by 473 px.  You can go to Modify Document Properties. on the Menu Bar or by selecting the stage itself and then the Properties Panel at the bottom of the screen.

Leave the Frame Rate at 12. (Set it higher for a faster game)

Give it a background color, but don't pick a color that will hide the characters later.

Create a new layer and name it "script"


Highlight Frame 1 in the new layer.

Open the Action panel and type the following:

fscommand("allowscale", "false");
fscommand("showmenu", "false");

Create a new layer and name it "game".  Create a new layer by right-clicking on one of the existing layers and select Insert Layer.

In Frame 1 of this layer you will create your opening Splash Screen in addition to a Start Button.

Design a Start button similar to the one shown.  Placing a rectangle behind the text and combining them using Modify --> Group will make it easier for a player to select the button.

Once you have designed the Start button drag the selection tool (black arrow) around it and choose Modify --> Convert to Symbol from the Menu Bar.

Use the names and settings shown to the right. Spell exactly as shown.

With the button selected enter the following code into the button's Action Panel:

on (release) {
on (keyPress "<Enter>") {

Creating the Hero Character

Right-click on Frame 2 of the game layer and insert a new Blank KeyFrame.

Your character is comprised of 4 frames. In each of these frames is a pose, (down, left, right, up).  Each of these four poses will consist of two frames to simulate movement in each of the four poses.

Begin with the front view. This will be the down (falling) pose.

Zoom in on the stage.  Your character is going to be quite small, (24 pixels maximum width or height) so don't worry about detail.

There are several ways to do this, but here is one suggestion. Create the basic body parts - torso, head, legs, and arms, then make duplicates of them before putting them together. (You will see why soon).

Move the body parts into a position that will simulate his/her first stepping position. You can precisely locate items using the arrow keys on your keyboard.


When moving arms, legs, and anything that naturally rotates on an axis, choose Modify Transform Free Transform from the Menu Bar. Carefully select the White dot and move it to a position that most accurately reflects the natural point of rotation, (ie. hips, shoulders, etc.).

Scaling You Character

Given the overall dimensions of your game area, your character will need to be quite small.  Although it is easier to work with larger images, you will need to make sure that no dimension, (width or height), will be larger than 24 px.  Since you will be needing the duplicate body parts you created, and will have to scale them all accordingly, there will be a trick involved in scaling the full character to the proper size.

Since my character will be taller than he is wide I created a rectangle 24 pixels high to match the end result I want for my character. (Use X and Y in Properties panel).

  • Select your character and all the extra body parts but do not select the test rectangle

  • Select Modify Transform Free Transform

  • Drag a corner handle inward until your characters height matches the test rectangle

Creating a Movie Clip

Select all of the body parts including the extras and go to Modify Convert to Symbol from the Menu Bar.

Use the settings exactly as shown.  Pay attention to the Registration point.

*You may be wondering why you've selected the extra body parts. Have patience, it will all become very clear in a moment.

Your character should now appear in the Library. If you don't see the Library go to Window and make sure that Library is checked.

Double -click on your character to enter Edit mode.  You should see the character name appear beside Scene 1 at the top of the screen indicating that the character is open for editing.

Right-click on Frame 2 of Layer 1 and insert a new Blank Keyframe.

Now go back to Frame 1 and select all the leftover body parts and Ctrl + C to copy them to the Clipboard.

Go back to Frame2.

While in Frame 2 select Edit Paste in Place or use Ctrl + Shift + V to paste the body parts into Frame 2.

While in Frame 2 select the Onion Skin button. This will allow your character position to show through from Frame 1.  "Onion Skin" refers to a type of tracing paper that drafters used before computers. This feature allows you to place the second frame in the same relative position as the first.

With the Onion Skin image of Frame 1 showing through, move the pieces around to create the second frame of the animation.

I have reversed the position of the legs, and moved the arms and head slightly.

Select Scene 1 to exit the edit mode. We will come back to this movie clip later and clean up the extra body parts.

Create a duplicate of the character movie clip by Right-clicking on char_down in the Library. Name it char_up.

Right-click on char_up and select Properties.  Check Export for ActionScript and match the rest of the settings to the left.

Double-click to open char_up for editing.

It should be fairly simple to convert the front view to a rear view in a simple animation.  Remove the eyes, add some hair...


Remember to do both frames. Delete all of the extra body parts of both frames, then select Scene 1 to exit edit mode of char_up.

Create another duplicate of char_down in the Library and name it char_left.

Right-click on char_left in the library and select Properties. Match the settings with the ones to the left.

Create a profile view in each of the two frames.

Modify the views in Frame 1 and Frame 2 to create a walking animation in the two frames.

Delete any extra body parts in each of the two frames.

You can slide the Red timeline slider back and forth to get a preview of the character's walking motion.

Select Scene 1 when completed to exit edit mode.

In the Library Right-click on char_left and choose Duplicate. Name the copy char_right, and follow all the settings from the image to the left.

Double-click the new char_right to enter edit mode. For each of the two frames choose Modify Transform Flip Horizontal.  Select Scene 1 when done to exit edit mode.

You now have all four poses that make up your hero character.  Go back to char_down and double click to enter edit mode.  Delete any extra body parts at this time, for each of the two frames.  Do the same for the other views.

Assembling the Poses

Select Frame 2 of the game layer and drag a copy of char_down anywhere onto the screen.

Go to Modify Convert to Symbol and convert to a movie clip with the name char.

Choose the center registration point and Export for ActionScript.

Double-click to enter edit mode.

Right-click in Frame 2 and insert a Blank Keyframe.

Select Onion Skin so that you can see the image outline of the character.

Drag a copy of char_left at Frame 2 position over top of the existing image.  Try to center the image with the image in Frame 1.

Right-click in Frame 2 and Insert Frame (NOT a Keyframe) so that char_left takes up two frames.

Right-click in Frame 4 and insert a new Blank Keyframe. Drag a copy of char_right into position.

Right-click in Frame 5 and insert a new Blank Keyframe. Drag a copy of char_up into position.

Remember to place the poses in the same relative position with the help of the Onion Skin tool. You want the character to change directions seamlessly, without appearing to jump or end up off-centered in the Tile.

Your character should now be completed. Select Scene 1 to exit edit mode. You can delete the character from the stage.  He should now appear in the Library as char.

Next Page - Building the Map...