Lesson 5
Situation
The Awesome Game Company has hired you as an intern for its 2D game development division. In order to be assigned higher-level tasks, you must first learn how object movement is created in a game. After learning about this, you will be assigned a game build.
How to Begin
1. Read the passage below.
2. Complete the review questions.
3. Turn in all materials.
4. Complete the game build.
Reading Materials
Object movement in a game is created in one of three different ways: transportation, animation, and spawning. The next sections discuss each of these methods in detail. Answer the review questions at the end of the reading materials.
Transportation
In the Click Ball game you created earlier, the ball was made to move arid bounce on the walls. This form of movement is transportation. In the simplest of definitions, transportation is the moving of an object from one location to another. As part of the transportation movement attribute set, which is a collection of characteristics or features, the designer can manipulate characteristics such as direction, speed, acceleration, and deceleration.
Transportation attributes are easy to understand, as you can see these applied every day in the real world. If you watch a car pass in front of you as you stand on a street corner, the car has a direction attribute that determines how it moves from a position on your left to a new position on your right. In this example, the direction attribute is "moving right." So you can see that direction determines the path the object will travel. Look at Figure 5-1. This is the dialog boo you used to set the direction for the ball in the Click Ball game you created earlier. Game Maker uses nine-position direction attributes (including the middle "no movement" option).
The car described above also displays a speed attribute. In engineering and physics, speed is referred to as velocity. Roth words have the same meaning, and speed is used more frequently in game programming. Speed is how fast something is moving. If the driver is obeying a speed limit of 50 miles per hour, the car would have a speed attribute of 50. To calculate speed, use the formula: speed = distance time. In this example, the car is traveling at a speed of 50 miles per hour. To find out how many miles the car will travel in one hour, use the formula: 50 mph = X miles I hour. Solve the equation for X, which in this case is equal to 50.
Speed can change as the object is moving. The instantaneous speed is the exact speed the car is moving at the exact moment or instant you are observing it If you are driving along in your car and a slow-moving bus gets in front of you, you will need to slow down. Your instantaneous speed might drop to 40 miles per hour until you can pass the bus. You may even
speed up a bit to 60 miles per hour as you pass the bus. During your trip, your instantaneous speed will change as you drive through traffic and around coolers. In the end, you may still have traveled 50 miles in one hour, meaning your average speed was 50 mph, but your instantaneous speed will have varied along the 50-mile journey. To change the instantaneous speed of the car, the driver must push down the accelerator pedal to speed up or push down the brake pedal to slow down. To speed up, the car must accelerate. To slow down, the car must decelerate.
A stopped car has no speed, or an instantaneous speed of zero. If the driver presses down the accelerator, the car begins to move. Suppose the speed is observed two seconds later and the instantaneous speed is 20 miles per hour. Applying the accelerator allowed the car to accelerate from 0 mph to 20 mph in two seconds. This means the car has accelerated, or a positive change in instantaneous speed has been applied. In other words, the speed of the car is getting faster. Mathematically, acceleration is calculated using the formula: acceleration = distance + (time)'. If the driver applies the brakes, the car will slow down. Slowing down, or changing the instantaneous speed in the negative direction, is deceleration.
In game design, it is typical to apply the formulas for direction, speed, and acceleration using the virtual distances in the game. The game room can be broken down into a grid, as you saw in the Click Ball game build. The regular spacing of the grid acts like real-life units of measurement. In the real world, a meter is 100 centimeters. In the virtual world, one division in a one-meter grid might be 10 pixels. Just as the virtual world reduced the size of the real-world room, the time intervals most also be accurately reduced to scale. In most games, time intervals are milliseconds (.001 seconds). Game Maker can also change the room speed to adjust by milliseconds. It typically uses a 1/20th of a second as one step. You learned about steps in the Click Ball game build. Speed is calculated by how many pixels an object moves in each step. If you set an object to move at a speed of eight, it will move eight pixels every 1/20th of a second. In Game Maker, the standard room size is 640 pixels wide. If an object moves at eight pixels per step, it would take 80 steps (four seconds) to move from one side of the screen to the other.
Animation
An animation is a series of images played in quick succession, each with a small change that give the illusion of movement. This is similar to a flipbook animation where you draw a series of pictures in the corner of a notepad and then flip the pages to see the figure move. Game Make has some built-in animation features you can use or you can create custom animations on your own and import them.
To animate a sprite is to make it move. To accomplish sprite animation, the designer needs to create several animation frames to make up the entire animation. On each frame, the sprite has moved or changed a small amount from the previous frame. For example, if you need a sprite to walk, you need to create animation frames for each pose as the character's arms and legs articulate. Articulation is the bending and positioning of movable parts. A human character may have articulated legs, arms, fingers, head, lips, eyelids, and so on
If an object is transported and animated, it is considered an active animation. An example of an active animation is a walking animation with articulated movement synchronized to the transportation (movement). Synchronizing is linking the timing of events. In this case, the footstep animation distance must correspond (link) to the transportation distance the object is moved. It the character does not move a distance your brain interprets it should based on the footstep animation, the overall animation will look odd. Using your fingers like legs, make your hand "walk" on your desk. To do so, you must synchronize the animation of your fingers to match the transportation of your arm.
Spawning
The final object movement option is spawning. Spawning is the creation of an object within the game. An object can be randomly created or teleported. An obstacle object, like a flying meteor, might be randomly spawned to make the game challenging for the player, since the objects must be avoided. With a teleported object, the object is moved from one point within the game to another point. This might occur between levels or could be just an added feature to jump from one spot
in the game to another. It is like a magic doorway that takes the player to another place within the game. In the classic game of Pac-Man, when the characters leave the right side of the room they are teleported to the left side of the room. This specific teleportation feature is called wrapping.
In addition to wrapping, the player can teleport in many other ways. The most common application of teleporting is when the player dies and is re-spawned or re-created at a checkpoint. A checkpoint is a saved point within a game that allows the player to teleport back to that point if damaged or destroyed. Without a checkpoint, a player would have to restart from the beginning of the game each time the character is damaged or destroyed. The checkpoint allows the player to stay interested in the game and avoid the frustration of having to redo sections of the game already mastered.
Review Questions and Activities
Vocabulary Questions
Write a definition for each of the terms listed below.
1. Transportation: ______
2. Attribute set: ______
3. Direction: ______
4. Instantaneous speed: ______
5. Accelerate: ______
6. Decelerate: ______
7. Animation: ______
8. Articulation: ______
9. Active animation: ______
10. Synchronizing: ______
11. Spawning: ______
12. Teleported: ______
13. Wrapping: ______
14. Checkpoint: ______
15. Given a rate of 50 mph, how far would a car travel in 2 hours? ______
16. What is the velocity of a car that drove 345 miles in 5 hours & 45 minutes? ______
17. If you drove a car & maintained an instantaneous speed of 40 mph for 20 minutes, 50 mph for 30 minutes, & 60 mph for 10 minutes, how far would you have traveled in 1 hour? ______
18. Explain how to calculate the average speed of the car in question 17. ______
______
19. How many milliseconds are in 1 step (1/20th of a second)? ______
20. If your trip from home to school were part of a game, list 3 ways you would move the player to school. ______
Situation
The Awesome Game Company needs to make a simple 2D game for a client named Ugly Furniture Organization (UFO). The client loves to make fun of the company name and the UFO acronym. The company wants a UFO-themed game to lure customers to its website. Your job is to create an entertaining game that uses a UFO launching projectiles to destroy meteors.
How to Begin
This lesson builds on the skills you learned in earlier lessons. If needed, refer to earlier lessons if you do not remember how to do certain tasks. All future lessons build on the skills learned in previous lessons.
1. Launch Game Maker
2. Create a new room (room0) and set its background color to black.
3. Save the game as LastName_Meteors in your video game design folder.
4. Create a new sprite named SPR_UFO. Load the ufo.gif or ufo2.gif image file located in the
Resources folder > Sprites on my teacher website.
5. Create a new sprite named SPR_Meteor LG. Load the meteor_LG.gif image file located
in the same folder as the UFO.
Animating the Meteor
6. Open the Sprite Properties dialog box for the SPR_Meteor LG sprite.
7. Click the Edit Sprite button to open the Sprite Editor.
8. Select Animation>Rotation Sequence>Clockwise from the Sprite Editor pull-down menu. The Animation Rotate dialog box is displayed.
Clockwise direction is circular movement from the top, to the right, bottom, left, and back to the top, like the hands of a clock moving forward. Counterclockwise direction is the opposite, like the hands of a clock moving backward.
9. In the Animate Rotate dialog box, enter 5 the Number of frames: text box and 360 in the Degrees (0-360): text box. This will automatically create a total of five frames, each frame one step in an animation that rotates the meteor clockwise in a full circle. There are 360 degrees in a circle.
10. Click the OK button to see the created frames, Figure 5-2.
11. Check the Show Preview check box in the Sprite Editor.
12. The meteor is spinning too fast. Enter 6 in the Speed: text box to slow it down. This is the preview speed only.
13. Click the OK, save changes button (green check mark) to close the Sprite Editor.
14. Using similar steps to create sprites with the following attributes.
Sprite Name / Image File / Animation Rotation / # of Frames / Animation SpeedSPR_Meteor_Med / Meteor_med.gif / Counterclockwise / 8 / 7
SPR_Meteor_Sm / Meteor_sm.gif / Clockwise / 10 / 9
15. Save your work.
Custom Sprite
You are now going to draw your own sprite using the Sprite Editor.
16. Create a sprite named SPR_Photon.
17. In the Sprite Properties dialog box, click the Edit Sprite button to open the Sprite Editor
18. Click the Create a New Sprite button.
19. In the Create a New Sprite dialog box, set the canvas size to 32 x 32. Click OK.
20. Double-click on the word Image 0 to open the Image Editor.
21. Left-click on the yellow color swatch in the color palette to set the Left: color.
22. In the menu bar go to Image > Transparency, enter 255.
Opacity is a measure of how transparent (see-through) and object is. A setting of 255 means the object is completely opaque, or not fully transparent. A setting of 0 means the object is fully transparent, or invisible. A setting of 128 means the object is midway between fully opaque and fully transparent.
23. Select View > Zoom In from the drop down menu.
24. Click the Draw an Ellipse button. The shape area appears below the tools. The 3 buttons in this area determine how the color will be applied. The top button creates a shape that contains an outline and no fill. The middle button creates a shape with an outline and a fill. The bottom button creates a shape that has fill with no outline. Choose the top button.
25. Draw a circle in the middle of the canvas. If you hold down the shift key as you drag, a circle is created.