How To Make A Wack A-Mole Game In Flash.

 Making a  Wack A-Mole Game In Flash 

                                 

This Project covers the creation of a Wack-A-Mole Style game. Before you actually start building the game, you need to understand its parameters. First, the game has 16 holes from which 50 targets can appear. The 50 targets are of six-types - four target types award one point, one target type deducts one point from the score, and one target type resets are "wackable" is random, ranging from .5 to 3 Seconds. After 50 targets have displayed, the game is over.

Wack-A-Mole  

Scenes 

Start 

Game Play

End

Getting Started 

This section sets up a new Flash file. If you want your results to match those of the finished project, follow the steps carefully. If you wan to customize the project and are familiar with Flash 4, feel free to change the settings to those that meet your needs.

1. Begin with a new Flash Movie, using these settings:

Frame rate:                              18fps

Stage dimensions:                   440*320

Background color:                  Light blue

2. Set up three scenes, naming them (in order) Start, Game Play, and End.

3. Select the Start scene and set up three layers, naming them (from top to bottom) Foreground, Start Animation, and Background.

4. Select the Game Play Scene and set up five layers, naming them (from top to bottom) Foreground, Controllers, Variables, Background, and Apertures.

5. Select the End scene and set up three layers, naming the (from top to bottom) Foreground, End Animation, and Background.

6. From the Flash 4 Magic CD, Open Wack .fla as a Library.

Creating The Target Timer 

The Target Timer is the Movie Clip used to determine when to make a target unvail able if it has not been hit. This Clip uses two variables, Start and end, both of which are set by the Movie clip in which the Target Timer will reside.

1. In the Game Play Scene, Choose Insert>New Symbol to create a new Movie Clip, and name it Timer.

Flash opens this new Movie Clip symbol in symbol-editing mode.

2. Open the Properties dialog box for the first keyframe and, on the Actions tab, add the ActionScript.

If ((GetTimer - Start)>end)
    Stop
    Begin Tell Target ("../")
       Play
    End Tell Target
End If 

3. Right-click or Control+Click on the first keyframe, select Copy Frame, select the second frame, right-click or Control+click on it, and choose Paste Frames.

You should now have two identical keyframes. If you somehow end up with extra keyframes in the Movie Clip, make sure that you delete them.

4. Choose Edit>Main Movie to return to the main movie.

Creating The Target List Movie Clip

The list of targets (TargetList Movie Clip) is a six-frame Movie Clip that has one of the six target buttons in each frame. The Hole Movie Clip displays one of these frames whenever the aperture is opened

1. Choose Insert>New Symbol to make a new Movie Clip, naming it TargetList.

Flash opens this new Movie Clip in symbol editing mode.

2. Open the Properties dialog box for the first keyframe and, on the Actions tab, add the ActionScript.

3. Select the first keyframe, copy it, and paste it in the next five frames so that the Movie Clip has six keyframes.

4. In the first keyframe, drag an instance of the Approval symbol from the Target Buttons folder in the Buttons folder of the Wack .fla Library onto the Stage, and center the instance horizontally and vertically on the page.

5. In the second keyframe, drag an instance of the Art symbol from the Target Buttons folder as in step 

4.

6. Continue designing instances of the othet buttons from the Target Buttons to the remaining keyframes.

7. Select the instance of the Approval button in the first keyframe, open its Properties dialog box, and, on the ActionScript, assign the ActionScripts.

8. Copy and paste the same ActionScript on the Actions tabs of the five remaining buttons in the Movie Clip.

9. Choose Edit>Main Movie to return to the main movie.

On (Press)

     If (wackable=True)
         Set Variable: "/:Score" = /:Score+1
         Begin Tell Target ("../")
             Play
         End Tell Target
      End If
End On  

Creating The Hole Movie Clip

The Hole Movie Clip is the hole in the game that opens to reveal the targets you just made. This Movie Clip will contain the two previous Movie Clips.

1. Copy the Hole Movie Clip from the Wack .fla Library into your movie Library.

NOTE: COPYING A MOVIE CLIP FROM ONE LIBRARY TO ANOTHER IS SIMPLE: OPEN THE LIBRARY FOR YOUR MOVIE (WINDOWS>LIBRARY). SELECT THE HOLE SYMBOL FROM THE WACK.FLA LIBRARY, AND DRAG IT INTO THE LIBRARY FOR YOUR MOVIE.

2. Select the copy of the Hole Movie Clip in your movie's Library and open it in symbol-editing mode.

The Movie Clip already has a single layer named Apretures with 13 frames in it.

3. Create two new layers in the Movie Clip, name them Actions and Targets, and place the layers in this order (from top to bottom): Actions, Apretures, and Targets.

4. Create a new blank keyframe in frame 2 of the Targets layer, open the Library for your movie, drag an instance of the TargetList Movie Clip from your movie's Library onto the Stage, center it horizontally and vertically on the page, and name the instance TargetList.

5. Make sure that the Target layer has a total of 13 frames so it ends where Aperture layer ends.

6. In the Actions layer, open the Properties dialog box of the first keyframe, and, on the Actions tab, assign the ActionSript.

Stop

set Variable: "open" = False

7. Insert a Keyframe in frame 2 of the Actions layer, open the Frame Properties dialog box and, on the Actions tab assign the ActionScript.

Set Variable: "open" = True

Set Variable: "/:numUp" = /:numUp+1
Set Variable:"TargetList/:wackable" = True
Begin Tell Target ("TargetList")
    Go to and Play (Random(6)+1)
End Tell Target

8. In the Actions layer, insert a blank keyframe at frame 7, drag an instance of the Timer Movie Clip from your Library (not the Wack .fla Library) onto the Stage, and name the instance Timer.

The Positioning of this Movie Clip is not important because it is not visible.

9. Open the Properties dialog box for frame 7 and, on the Actions tab, assign the ActionScript. 

Stop 
Set Variable: "Timer/:end" = Random (3000)+500

10. In the Actions layer, insert a blank keyframe at frame 8, open its properties dialog box, and, on the Actions tab, assign the ActionScript.

Set Variable: "TargetList/:wackable" = False

Set Variable: "/:numUp" = /:numUp-1

11. Choose Edit>Main Movie to return to the main movie.

Creating The Controller Movie Clip 

The workhorse of the game is the Controller Movie Clip. It controls the opening of each of the holes and signals when the game is finished.

1. Choose Insert>New Symbol to create a new Movie Clip, naming it Controller.

Flash enters symbol-editing mode.

2. Select the only keyframe in the Controller Movie Clip, open its Properties dialog box, and, on the Actions tab, assign the ActionScript.

If (Random(3) = 1 and /:numUp<3 and /:total<>50)

       Set Variable: "found" = False 
       Set Variable: "num" = Random(16)+1
       Loop While (found=False)
If (Eval("/target"&num&"/:open")=False)
       Set Variable: "found" = True 
Else
       Set Variable: "num" = Random(16)+1
End If
       End Loop
       Set Variable: "/:total" = /:total+1
       Begin Tell Target ("/target"&num)
            Play
       End Tell Target
End If
If(/:total=50 and /:numUp=0)
   Begin Tell Target ("/target"&num)
        Play 
   End Tell Target 
End If

3. Select the first keyframe, copy it, and paste it in the second frame.

Make sure that no other blank frames are in the Timeline.

Putting The Start and End Scenes Together 

1. In the Background layer of the Start scene, drag the Background symbol from the Vector Graphics folder in the Wack .fla Library onto the Stage, centering it horizontally and vertically.

2. In the Foreground layer of the Start scene, drag the Foreground symbol from the Vector Graphics folder in the Wack .fla Library onto the Stage, using the Object Inspector to position itat x: 0, y: 4.

3. In the Start Animation Layer, drag the Start Movie Clip drom the Movie Clips folder in the Wack. fla Library onto the Stage, and center it horizontally and vertically.

4. Select the first frame of the Foreground layer, Open its Properties dialog box, and, on the Actions tab, assign the ActionScript.

5. In the Background layer of the End scene, drag the Background symbol from the Vector Graphics folder in the Wack .fla Library onto the Stage, centering it horizontally and vertically.

6. In the Foreground layer of the End scene, drag the Foreground symbol from the Vector Graphics folder in the Wack .fla Library onto the Stage, and use the Object Inspector to position it at x: 0, y: 4.

7. In the End Animation layer of the End scene, drag the End Movie Clip from the Movie Clips folder of the Library to the Stage and use the Object Inspector to position the symbol at exactly x: 219, y: 162, making sure that the Use Center Point option is selected.

8. In the first keyframe of the Foreground layer of the End scene, open the Properties dialog box, and, on the actions tab, assign the ActionScript.

The actual game play will be located in the Game Plat scene.

Putting The Game Play Scene Together 

1. In the Background layer of the Game Play scene, drag an instance of the Background symbol from the Vector Graphics folder in the Wack .fla Library onto the Stage, and center it horizontally and vertically on the Stage.

2. In the Foreground layer of the Game Play scene, drag an instance of the Foreground layer of the Game Play scene, drag an instance of the Foreground symbol from the Vector Graphics folder in the Wack .fla Library onto the Stage, and align it so that it fits with the Background graphic.

3. In the Controller of the Game Play scene, drag an instance of the Controller Movie Clip from your movie's Library (not the Wack .fla Library) onto the Stage.

The positioning of this Movie Clip is not important because it's not visible.

4. In the Apertures layer, drag 16 instance of the Hole Movie Clip from your movie's Library onto the Stage and align the instances so they fit in the holes in the Background layer.

5. Name the instances (from the upper left corner to the lower right corner) target1 through target16.

6. In the Variables layer, create a new text box, select the Text Field button to make it an aditable text field, draw the text field to fit inside the space, and give it following attritubes and properties:

Font:                Arial     
Font Size:        14 pt  
Font Color:      Light Green
Variable:          /:Score
Options:           Deselect Draw Border and
                             Background
                         Select Disable Editing and Disable 
                              Selection
Outlines:          Select Include only specified font 
                              Outlines (Numbers)

7. In the Variables layer, open the Properties dialog box of the first keyframe, and, on the Actions tab, assign the ActionScript.

Stop

Set Variable: "/:score" = 0
Set Variable: "/:numUp" = 0
Set Variable: "/:total" = 0

Modifications

This game is one you can modify into an educational tool relatively easily. Instead of using Purely graphical images, you could set the game up to display math facts, images of historical figures, or any other bits of information students could learn just by sight.

Writer: Mr. Krishan Kumar Saini 

Today we have learnt Basics about How to make a Wack A-Mole game in Flash. Hope this lesson is helpful for you.