Help Files and Tutorials for Computer Users
Pong Game Tutorial

Next page...

Start by opening a new Flash document. Select the Modify menu and set the Document Properties to 650 px X 450 px and a frame rate of 60 fps. Leave the background colour as white. Click OK.

Zoom out until you can see the entire stage.

 

Fig. 1


Right-click or double-click the Layer name and re-name it to Borders.

Fig. 2


Select the rectangle tool and draw two rectangles as shown.  The first one will start at the top left corner of the stage, moving down and to the right.  Don't worry about the exact dimensions yet.

The second one will start at the bottom left corner and move up and to the right.

Make them any colour you want.  These will become the border of your game.

Hint: It will be easier to change the colour during the next step.

Fig. 3


Using the Arrow Tool, drag a box completely around the top border. With top border selected set the Width Property to 650, the Height to 10, and X and Y to 0.

Do the same to the bottom border, but this time set the Width to 650, Height to 10, X to 0, and Y to 440.

Fig. 4


Use the Arrow Tool again to select the entire top border rectangle.  The rectangle selected, got to Modify --> Convert to Symbol on the top menu bar, (Mac), or Insert--> Convert to Symbol (PC).

Give it the name top, select Movie clip, and select Export for ActionScript. Click OK.

Repeat the process for the bottom rectangle and name it bottom.

Fig. 5

Select the rectangle tool and draw two more rectangles as shown, (left and right).  The first one will start at the top left corner of the stage, moving down and slightly to the right.  Don't worry about the exact dimensions yet.

The second one will start at the top left corner, slightly to the left of the edge of the white rectangle, and move down and slightly to the right.

 

Fig. 6


Using the Arrow Tool, drag a box completely around the left border. With left border selected set the Width Property to 10, the Height to 430, and X to 0 and Y to 10.

Do the same to the right border, but this time set the Width to 10, Height to 430, X to 640, and Y to 10.

 

 

Fig. 7


Use the Arrow Tool again to select the entire left border, this time going to the Modify --> Convert to Symbol on the top menu bar, (Mac), or Insert--> Convert to Symbol (PC), as you did with the top and bottom borders. Name the left border left.

Repeat the process for the right border, and name it right.

Remember to select Export for ActionScript for both borders.

Fig. 8


Go to Insert on the top menu bar and select Timeline --> Layer, and create a new layer. Name this layer Paddles. This is where you will create the game paddles.

Follow these directions carefully!

Fig. 9


Home

Click to continue...