Exercise 8 Snow Removal Game
syllabus | schedule | assignments | Web Resources | ARTC courses
Name your file: username_ex8.FLA. You will turn in the FLA file, not the SWF.

1) Draw a snowflake (about 90 px by 90 px). Convert it to an movieClip (MC) symbol named flake.

2) Under the Library options menu, open the Component Definitions.

In the Component Definitions window, use the "+" symbol to add two new parameters:

  • Change the name of the first parameter to xfall, and the name of the second to yfall.
  • Leave the Value and Type = default.
    • You have now created a SmartClip. A SmartClip is a special type of MovieClip.
    • It can have certain variables that are 'built-in' (clip parameters).
  • Click OK.

3) Under the Library options menu, open Linkage:

  • Export for actionscript should be checked
  • Identifier type: flake
  • Click OK

4) Select the snowflake on the stage and delete it.

Later, we will add some actionscript that will dynamically pull this SmartClip from the Library onto the stage.

5) Draw a snow shovel:

  • Make it about 100 px by 100 px
  • Convert this to a MC symbol called: shovel

6) Under the Library options menu, open Linkage:

  • Export for actionscript should be checked
  • Identifier type: shovel
  • Click OK

7) Delete the shovel from the stage.

Like the snowflake, we are going to use the name we typed in the linkage box, to call this MC to the stage.

8) There should NOT be a thing on the stage or the main timeline, BUT there should be a smartClip called flake and a movieClip called shovel in your library.

9) Make two layers on your main timeline, one called actions, and the other called score.

10) On the score layer, draw a Dynamic text box:

  • Instance Name = score
  • Leave all the other boxes in the text option unselected
  • Type 0 (zero, not an O) in the actual text box
    • This Dynamic text box will display whatever number is sent to the score variable in our script

11) On frame 1 of the actions layer, open the actions panel and type:

//initialize variables
level = 0;
caught = 0;
score.text = 0;

Mouse.hide();
//get rid of cursor
_root.attachMovie("shovel", "newShovel", 10); //replace it with shovel MC
_root.newShovel.startDrag(true); //make shovel draggable


function createFlake (count) { //function for creating snowflakes

var i;
for (i=1; i<=count; i++) {
_root.attachMovie("flake", "flake"+i, i+10);
}

}

//function for making a random number that will be returned inside of the
//flake MC to make it start and fall randomly. The min and max parameters
//are so that it occurs within a certain set given the stage proportions.

function calculateRandom (min, max) {

return Math.floor(Math.random() * (max + 1 - min)) + min;

}

12) Add 2 more frames to the main timeline for both layers.

13) Insert a keyframe on frame 3 of the actions layer. Add the following actions to this frame:

//this logic statement checks to see how many snowflakes have
//been caught, and increases the level as long as it is less than 100
//so there will never be over 100 snowflakes falling at once.

if (caught==level) {

if (level<100) {
level++;
}

caught=0;
createFlake(level);

}

//loop this mechanism so that the createFlake function can be
//repeated andthe logic statement can be continually checked.

gotoAndPlay(2);

14) Double click on the flake SmartClip in the library to enter its edit mode. (It should say scene 1 > flake across the top of the timeline).

  • Call the layer that exists - flake
  • Create a new layer called actions
  • Add 4 more frames to both layers
  • On frame 1 of the actions layer, add a stop(); action
  • Add keyframes to frames 2 and 5 of the actions layer
  • Put a label on frame 2 called caught
  • Add the following code on frame 5 of the actions layer:

//removes any caught flakes from the movie and increments how many have been caught.
//when caught is incremented, the level of the game is higher and more flakes fall.

removeMovieClip ("");
_root.caught++;

15) Still in the flake's edit mode, select the flake on the stage and convert it to a MC Symbol called: flake_alpha. You now have a movieClip within in a smartClip.

  • Make a motion tween between frames 1 and 5 that makes the flake transition from 100% alpha to 0% alpha:
    • Hint: click on the flake on stage and check the property inspector
  • Click on frame 1 of the flake layer, to select that instance AND click on the flake symbol on the stage (with the playback head on frame 1), and add this code into the actions panel (top of actions panel should say: actions-movieclip):

//check to see if the snowflake has been caught. Basically
//using 'hitTest' to see if the area in the shovel is overlapping
//the area of the snowflake. If this is the case, it plays, and fades out.

onClipEvent (mouseDown) {

if (this.hitTest(_root.newShovel.hitarea)) {
_root.score.text++;
_parent.gotoAndPlay("caught");
}

}

//when each individiaul snowflake is created through the function on the main timeline,
//it is initialized to a random place on the stage via this event command.

onClipEvent (load) {

_parent._y = _root.calculateRandom(-200, -50);
_parent._x = _root.calculateRandom(60, 500);
scale = 10;
_parent._xscale = scale;
_parent._yscale = scale;
xfall = 12;
yfall = 8;

}

//this creates a directed and slightly random freefall to earth
onClipEvent (enterFrame) {

_parent._y = _parent._y+yfall;
_parent._x = _parent._x+(Math.sin(_parent._y/100)*yfall);

if (_parent._y>600){
_parent._y = -50;
}


//this logic statement makes the game a little easier if not caught
if (_parent._y<-30 and yfall<0) {

xfall = -(xfall-(xfall/4));
yfall = -(yfall-(yfall/16));
scale = _parent._xscale+4;
_parent._xscale = scale;
_parent._yscale = scale;}else if (_parent._y>670 and yfall>0) {

xfall = -(xfall-(xfall/16));
yfall = -(yfall-(yfall/16));
scale = _parent._xscale+4;
_parent._xscale = -scale;
_parent._yscale = scale;

}

}

NOTE: BE SURE YOU ADDED THAT ON THE MC AND NOT ON THE FRAME! **

16) Double Click the shovel MC in the Library to bring up its edit mode. (It should say scene 1 > shovel across the top of the timeline):

  • Call the layer that exists: shovel
  • Create a new layer called: hit area
  • On the hit area layer, draw a shape that covers the scoop area of the shovel
    • Make sure you are drawing on the hit area layer
    • Also, make sure this layer is above the shovel layer
  • Convert this graphic on the hit area layer to a MC Symbol:
    • Give it the Instance Name = hitarea (no space)
  • Make the alpha of this area 0% (so that it cannot be seen floating on top of the shovel scoop.)

17) TEST Movie.

Example:

Student Sample 1

Student Sample 2

NOTE: Following the instructions with basic graphics (as seen in my sample) will get you a C grade. To increase the grade value of the exercise, consider doing one or more of the following:

  • Design a more intricate interface and change the theme.
  • Trigger an event based on the score, such as:
    • Different levels of difficulty
    • Animations, etc.
Experimenting with the CODE will get you a better grade than "pretty" graphics -- but good design is a plus!