Lesson 1: Game Maker Vocabulary. Reading Materials: Introduction to Video Game Design

Introduction to Video Game Design Grade 9 BBT Objectives: Lesson 1: Game Maker Vocabulary Reading Materials:  Students will be able to define comm...
Author: Jasper Cross
29 downloads 0 Views 1MB Size
Introduction to Video Game Design

Grade 9 BBT Objectives:

Lesson 1: Game Maker Vocabulary Reading Materials:

 Students will be able to define common game design vocabulary  Students will be able to name computer languages used in game design  Students will be able to compare and contrast Game Maker and PowerPoint

A game designer is a person who is involved in the development of a video game. Games in Game Maker are built around a concept of rooms. The room is where you place game objects to create a scene. In other types of 2 dimensional (2D) game design software, maps, levels, or frames are used instead of rooms. In general, these terms all refer to the same concept. A room is like a blank sheet of paper on which you can design your game. You start with a blank screen, then add a background, images, objects, and text to the room to build a scene. This process is very similar to creating a PowerPoint presentation slide. When your scene is complete, then you will need to program interactions and animation to make your game. When a player moves from one room to another, you can add a transition, which is a visual effect between rooms so the player is not faced with an abrupt change in the display. This is very similar to transitions in PowerPoint presentations, which are added so the presentation does not appear to “jump” from one slide to the next. The background for a room can be a solid colour or an image that you create and import from another program. For example, suppose you made a cool background in PowerPoint. You can save this as an image file and then import it into Game Maker. You could also choose an image from the image library files provided by your teacher or from an online resource. Two dimensional images have only height and width dimensions (or X and Y dimensions). When a 2D image is used in a game, it is called a sprite. Anytime you want to add an image to Game Maker, you first need to upload it into Game Maker as a sprite. Almost everything you see in a 2-D game is a sprite image file. An artist is the person who creates images and graphics for use in a game. In Game Maker, you cannot add programming to a sprite. Here, sprites are simply the image used for an object. Objects in Game Maker can receive programming. An object can be placed in a room, while a sprite cannot. Typically, the first programming an object receives is which sprite (image) it will display. For example, if you create a ball object, it should be programmed to display a ball sprite. In this way, the object will look like a ball when the game is played. Each time you place an object in a room, you are creating an instance of that object in the game. An instance is an exact copy, and it inherits the properties of the parent object. For example, if you are creating a brick wall in a Game Maker room, you will create several instances of a brick object to construct the wall. Objects are also the game assets that can be programmed to have an interaction or event. There are two types of objects: active and background. Active objects can be interacted with during game play, like a ball or a wall. Background objects cannot be interacted with during game play, like clouds. These objects are just there to develop the scene. Both active and background objects can be further classified as animated or static. Some objects, like a wall, do not move during game play, but others need to move. An animated object is programmed to

1

Introduction to Video Game Design

Grade 9 BBT

move around the screen. A static object does not move, it just sits in the same place during game play. The programming of objects is typically in a programming or event- editor screen and not within the room (scene). The programming follows a logical design process that makes it easy to interpret and if/then logic statement. Almost all game interactions follow if/then logic. For example: IF a ball object hits the wall object, When this condition is met, the action event is triggered: THEN the ball object bounces. In Game Maker, condition events are called named events and action events are called named actions. This means that in Game Maker, an event is any condition within a game that will cause something to happen. Likewise and action is what happens to an object after the event occurs. One action you might want in your game is playing of sounds. Sounds can be added as background music or as part of an action. For example, you might want a water balloon to make a splashing sound when it hits the wall. You may also want to have a nice musical background playing during the introduction or title frame of the game. These small pieces of sound used in programming are called sound effects or sound fx. While sound can be formatted in many ways, the most common types used in games are MP3, WAV, and MIDI formats. A long sound file is typically referred to as music and may be as long as a complete song. A short sound file is typically referred to as a sample and may be as short as less than one second. A game programmer can create a game using game-design software or by programming directly in a computer programming language. Game-design software makes the job of programming much easier. Game Maker is object-oriented software, which simply means each item in the programming is a container, called an object, that can interact with other objects. Object-oriented programming allows a visual interface, such as Game Maker, in which the programmer can see the game objects and drag- and-drop programming commands for each object. A more complicated way to design a game is to write a set of computer commands in a programming language. A programming language is similar to a verbal language, like English or French, only it is a written language that a computer can understand. Coding is the process a programmer uses to record the words and symbols that the computer can understand, and the result is called code. Lines of code are assembled to form a script. A script is a list of computer commands. There are many computer programming and scripting languages, but the ones most commonly used in game design are C,C++, C#, Java, Python, and Ruby. Game Maker also allows for advanced programmers to use scripts to make custom game interactions not found in the basic object-oriented programming. When you write in a computer language, you are programming computer code. The process of changing computer codes, scripts, and other programming into a file that can run on a computer is called compiling. When a computer compiles, it takes your script or object-oriented programming and rewrites it as an executable file. An executable file is a program file that tells the computer exactly what it is supposed to do, or execute. Finally, the player needs to be able to play the game. As a game programmer, you will need to program a user interface (UI) for the player to control the game. A user interface is how the player (user) connects to (interfaces with) the game. In the games you will build in this course, the mouse and keyboard will be the input devices for the UI. In your home, you 2

Introduction to Video Game Design

Grade 9 BBT

probably use a game controller for your Xbox or Playstation system. In some games a custom UI input is created, like the Guitar Hero or the dance mat for Dance, Dance, Revolution. In handheld devices like the iPhone, the UI input might be an accelerometer that detects how the player is tilting or shaking the iPhone. In all of these examples, the game is programmed to receive some input from the user (player) and connect those actions to the action in the game (interface). Once you understand this information and terminology, you can begin your journey on becoming a game designer, game programmer, or game artist.

Vocabulary Questions: On your Activity Sheets write a definition for each of the terms listed below. 1. Room 11. Sounds 2. Sprite 12. Sound Effects 3. Object 13. 2D 4. Instance 14. Music 5. Animated 15. Sample 6. Static 16. Object Oriented 7. Condition Event 17. Programming Language 8. Action Event 18. Coding 9. Game Maker Event 19. Compiling 10. Game Maker Action 20. User Interface

Review Questions On your activity sheets write a response for each of the following questions: 21. List 6 computer languages commonly used in game design. 22. List three sound formats commonly used in game design. 23. Describe the user interface for the iPhone. 24. How is a Game Maker room similar to a slide in PowerPoint? 25. Circle the action for the logic statement: IF the car collides with the ambulance, THEN destroy the car

3

Introduction to Video Game Design

Lesson 2: Game Maker Basics Situation:

Grade 9 BBT Objectives:  Students will identify commands, buttons, and interface elements for the Game Maker software.  Students will be able to describe the resource tree.  Students will use hot keys to start a command.

The Awesome Game Company thinks you have the right stuff to become a successful intern in the company. The next step to designing games is to learn how to use the game-design software. You will complete learning activities before starting on skill-building designs.

How to Begin: 1. Launch Game Maker 8.1 And change the look or “skin” of the Game Maker interface to a brighter screen. Go to the File Menu→Preferences and select the General tab, and in the lower right hand side select GM8, and the black screen will turn white. You can also watch this You tube video: http://www.youtube.com/watch?v=5ogX5whVJqc&list=PLkxX06BbFnF5CiCODnWq_nGGLOBGuak51&index=2

2. Complete the Game Maker toolbar activity. 3. Complete the Game Maker menu bar scavenger hunt.

Game Maker Menus and Tools Shown in Figure 2-1 are the menu bar and toolbar for Game Maker 8.1. The menu bar contains pull-down menus, beginning on the left with the file pull-down menu and ending with the help pull-down menu. Clicking on each of the words in the menu bar displays the corresponding pull-down menu from which you can choose a command. You will learn more about these features as needed for each game built in the lessons ahead. Below the menu bar is the toolbar. The toolbar contains buttons used to start a command. Icons on buttons help identify what command will start when the button is clicked. If you hover the cursor over a button (without clicking), the name of the command appears next to the cursor as help text. Identify the commonly used Game Maker 8.1 commands shown below. Menu bar Toolbar

Figure 2-1

Game Maker Resource Tree In Game Maker, all of the game parts or assets, are stored in a folder tree named the resource tree. This is shown in Figure 2-2. A folder tree creates a visual directory for quickly finding items. Double-clicking on a folder, or a branch in the resource tree, will expand it to show the contents of that folder. You can also click the plus sign next to the branch to expand it. This only appears if the branch is empty. An expanded branch displays a minus sign instead of a 4

Introduction to Video Game Design

Grade 9 BBT

plus sign. A branch can be collapsed by double-clicking the branch or clicking the minus sign next to the branch. More folders may be contained inside of a branch. You can continue to expand branches until you reach the final destination file, called a leaf. The branches and leaves compose the resource tree, just like a real tree is composed of branches and leaves. In the resource tree you will find folder branches for sprites, rooms, game Information, Global Game Settings, and Extension packages. In Branch Leaf figure 2-2, the Sprites branch has been expanded to display the Enemy 1 Sprite leaf.

Game Information

Resource

The Game Information branch Tree on the resource tree is used to provide help to the player. Help is what the player uses during gameplay to learn Figure 2-2 how to play the game, obtain directions on how to solve problems with the game, and, in some cases, see hints for completing the game. The player accesses help by pressing [F1] key on the keyboard. The [F1] key is a standard key for accessing help in many programs, including Microsoft Office. Double-clicking on the Game Information branch displays a text editor in which you can type information. This text editor is similar to Microsoft Word. You can even copy a document from one of these word processors and paste it in the Game Information branch text editor. Game Maker keeps the formatting, colour, and alignment of the pasted document.

Global Game Settings The Global Game Settings branch contains all of the default game settings, such as standard window sizes and error handling. A default setting is a game setting the game developer assigns. When a player modifies a default setting, the setting becomes a custom setting. An example of changing a default setting is changing the help feature from the [F1] hot key to the [H] hot key. The [F1] key is the default setting. If the setting is changed to the [H] key, then the setting for accessing help is a custom setting. A hot key is the keyboard key a player uses to activate a feature of the game. In the above example, the hot key for help was changed from [F1] to [H]. Hot keys are programmed into games for players who prefer to use a keyboard instead of a mouse or other input device. Game Maker includes many hot keys for various commands and functions. For game builds in this course you will not need to change the settings in the Global Game Settings branch. The default settings serve well for most situations.

5

Introduction to Video Game Design

Grade 9 BBT

Lesson 2 Review 1. Game Maker Menu Identification: Print the name of the command in the space next to each pictured icon. 1.

________________________ ___

10.

______________________________

2.

__________________________

11.

______________________________

3.

___________________________

12.

______________________________

4.

___________________________

13.

______________________________

5.

____________________________

14.

______________________________

6.

_____________________________

15.

______________________________

7.

_____________________________

16.

______________________________

8.

_____________________________

9.

______________________________

Game Maker Hot Key Shortcuts Hot Key shortcut combinations are shown next to the command name in the pull-down menu. Explore the Game Maker menu bar to find the hot key combinations for the following commands: 1.__[Ctrl]+[N]___ = New 8. ____________ = Run in Debug mode 2. ____________ = Create Sprite 9. ____________ = Save 3. ____________ = Delete 10. ____________ = Duplicate 4. ____________ = Run normally 11. ____________ = Create Room 5. ____________ = Open… 12. ____________ = Create Object 6. ____________ = Properties… 13. ____________ = Rename 7. ____________ = Find Resource 14. ____________ = Exit

6

Introduction to Video Game Design

Grade 9 BBT

Objectives:

Lesson 3: Click Ball Situation:

 Students will use game-design tools to create a simple game.  Students will set a background colour and apply sprites to enhance a room (scene).  Students will program objects to react to the game rules.

The awesome Game Company wants to create a game for young children to improve the child’s control of the mouse and ability to left click. First, you must learn the definition of a video game and the associated rules and victory condition. The information in this lesson discusses these aspects.

How to Begin: 1. 2. 3. 4.

Read the passage below. Complete the review questions. Have all material marked by your teacher. Complete the game build.

Reading Materials A video game is a software-entertainment product that has a game environment, rules, and a victory condition. The game environment is what separates a video game from all other games. The game environment is a setting altered or designed to play a specific game activity. For a game like baseball, the game environment is the baseball field. The field has been altered to have three bases, home plate, a pitcher’s mound, in-bounds areas, and foul areas. None of these things exist in nature. A piece of land has been changed to make this game environment. In a video game, the game environment is a virtual game world. This virtual world is seen through a video screen, thus the video in video game. The video display is the part of the game environment that separates video games from regular games (such as board games). The really cool part of a virtual world is that anything can happen without regard to reality. Both realistic and unrealistic events can occur in a video game. It is up to the designer to create the world. Inside the game environment are the rules that determine the gameplay. A rule is a constraint that determines what can or cannot happen in the game. Look at the baseball example again, the game rules become clear. Inside the game environment of the baseball field these rules apply: teams have 9 players, each team has three outs per inning, there are nine innings in a game (unless the score is tied after nine innings), each batter can take up to three strikes to reach the base or an out is recorded, if the ball is caught before it hits the ground it is an out, etc. There are of course many more rules in the game of baseball. It is important to understand that rules make the game environment meaningful. Imagine if the rules for the game of baseball did not set an out of bounds. The batter could hit the ball anywhere out of bounds to have a home run. That makes the out of bounds rule a very important part of the game environment for baseball. Much thought has been put into designing the rules of baseball. Similarly, a video game designer has to be very careful when making the rules for a video game. Rules must help the player feel the game is fair and winnable. This is one of the main reasons to construct a rule. If players think the game cannot be won, they will not play it. 7

Introduction to Video Game Design

Grade 9 BBT

Lastly, a game must have a victory condition. A victory condition defines what the player must achieve in order to win the game. It is a moment in gameplay where the player has overcome the objective and is the winner of the game or a level within the game.

Lesson 3 Review: Definitions: 1. Video Game: _______________________________________________________________________________ _______________________________________________________________________________ _______________________________________________________________________________ 2. Game environment: _______________________________________________________________________________ _______________________________________________________________________________ _______________________________________________________________________________ 3. Rule: _______________________________________________________________________________ _______________________________________________________________________________ _______________________________________________________________________________ 4. Victory condition: _______________________________________________________________________________ _______________________________________________________________________________ _______________________________________________________________________________ Review Question: 5. Describe how a video game differs from a regular game. _______________________________________________________________________________ _______________________________________________________________________________ _______________________________________________________________________________

8

Introduction to Video Game Design

Grade 9 BBT

Situation: The Awesome Game Company wants to create a game for young children to improve the child’s control of the mouse and ability to left click. This game hopes to improve motor skills for these young children in a fun game environment. The game will need three levels, each requiring better mouse skill and hand-eye coordination.

How to Begin 1. Launch Game Maker 8.1 2. Select File→New Project. Select your BBT Folder→GameMaker Folder and name the game Click Ball 3. Click the Create a Room button on the toolbar to create a new room or scene for your game. You could also select Resources→Create Room from the pull-down menu. The Room Properties dialog box is displayed. 4. Select the Backgrounds tab, Figure 3-1. The background colour for the room is gray by default, as shown in the color: swatch and room grid. 5. Click the Color: swatch to open the Color dialog box, Figure 3-2. 6. Select a blue color swatch (any blue) and click OK button to close the color dialogue box and change the background for the room to blue. Notice that the room has a grid pattern with gray lines on the blue background. The spacing of these grid lines can be changed by entering new values in the Snap X: and Snap Y: text boxes. Grid lines do not show during gameplay, they only help in alignment during design. Snap Settings

Backgrounds tab

Room Grid

Colour Swatch Isometric Grid on/off

Figure 3-1

Grid on/off

Select a colour Figure 3-2 7. Change the grid lines so they are 20 pixels apart in both the X and Y direction. 9

Create a Room

Introduction to Video Game Design

Grade 9 BBT

8. Click the Toggle the Showing of the Grid button to the right of the Snap Y: button. The grid is removed from the room. Click the button again to reapply the grid. 9. Click the Turn the Grid into an Isometric Grid button. The grid lines are now at 45° to horizontal and vertical. Isometric games use a slanted game board to give the illusion of three dimensions in a two-dimensional game. Click the button again to return to the normal grid. 10. Click the Settings tab to display the settings for the room. In this tab, the Room name, caption (title), and size of the name room can be changed, Figure 3-3. 11. In the Name: text box, be sure the name room0 is displayed. If not, Size change the name to room0. 12. The size of the room is set in the Width: and Height: text boxes. Change the size to 640 wide X 480 tall, if it is not Figure 3-3 already. 13. Click the Windows close button (red X in the top right corner of the window) to close the Room Properties dialogue box. 14. A warning appears asking if you want to save the changes to the room. Click Yes button to save the changes. 15. Select File→Save as… from the pull-down menu. 16. In the Save as dialogue box, navigate to your Game Maker folder and save as Lastname_Clickball.

Adding and Naming Sprites This section covers creating and naming sprites. In naming game assets, you should follow a naming convention, which is a standard way of naming items. A naming convention makes it easy to identify the proper game asset during game construction. These prefixes will be used in asset names: SPR_ for sprites, OBJ_ for objects, SND_ for sounds, and BCK_ for background images. For example, you may have a sprite named explosion and a sound named explosion. By using a naming convention you will be able to quickly identify the correct item. Name the sprite 17. Click the Create a Sprite button on the toolbar. The Sprite Properties dialogue box is displayed, Figure 3-4. Click to assign 18. In the Name: text box, type an image to a SPR_Ball to identify this sprite Image assigned asset as a sprite, or an image, of a ball. to the sprite 19. Click the Load Sprite button. Figure 3-4 A standard Windows “open” dialogue box is displayed. 20. Navigate to the Game Maker Sprites folder, if it is already current. Your instructor may have you use a different folder location. 21. In the Sprites folder, 10

Introduction to Video Game Design

Grade 9 BBT

22. Select the ball(2).png image file. A preview of the image appears on the right hand side of the dialogue box. 23. Click on the Open button to assign the image file to the sprite. 24. Click the OK button in the Sprite Properties dialogue box to finish creating the sprite. The sprite is added to the resource tree in the Sprites branch (folder). 25. Using similar steps, create a Wall sprite named SPR_Wall using the wall(2).png image. 26. Save your game build before continuing (File→Save or the Save the Game button on the toolbar).

Adding and Naming Objects You now have two sprites. They are listed in the resource tree in the Sprites branch. However, sprites cannot be placed in the room, only objects. You now need to create objects, have these objects “wear” the sprites, and then place the objects in the room (scene). 27. Click the Create an Object button on the toolbar. The Object Properties dialogue box is displayed, Figure 3-5. Click to select a 28. In the Name: text box, Name the type OBJ_Ball sprite object 29. Look at the Sprite area, Sprite which currently states to indicate no object sprite has been assigned Check to make to the object. Click the the object selection button to the visible right of the display. A list of available Figure 3sprites is displayed. (or go 5 to the Folder in the Shared drive) 30. Choose the SPR_BALL sprite from the list. 31. Check the Visible check box so that the ball object can be seen in the game.

Do not check

Note: do not check the Solid check box to make the ball a solid object. Instead, moving objects need to be programmed to act solid. Game Maker does not work as well when moving objects that are made solid. Object that will not move can be set to solid. 32. Click the Show Information button. The Information about: dialogue box is displayed. This dialogue box shows the scripting for the object. When changes are made in the Object Properties dialogue box, Game Maker automatically builds the scripting so you do not have to. Close the Information about dialog box. 33. Leave all other options in the Object Properties dialog box at the default settings, and click OK to finish creating the object. 34. The OBJ_Ball object is added to the resource tree in the Objects branch (folder). 35. Using similar steps, create a wall object named OBJ_Wall using the SPR_Wall sprite. Check both the Visible and Solid check boxes. Since this object will not move, it is okay to make the object solid. 36. Save your work.

11

Introduction to Video Game Design

Grade 9 BBT

Adding Objects to the Room Now, you have created two sprites and two objects. You have also assigned the sprites to the objects. However, you have not yet placed the objects in a room (scene). Remember, earlier you created a room named room0. You will use this room to build the game. 37. In the resource tree, expand the Rooms branch and double-click room0 to open the room for editing. 38. Click the Windows Maximize button in the top right corner of the Room Properties window to maximize the room display. 39. Click the Objects tab in the Room Properties Object to be Click to select dialogue box. At the bottom of the tab are a different inserted some helpful directions, as shown in Figure object 3-6. 40. Click the selection button to display a list of Coordinates objects and choose the OBJ_Ball object. of cursor 41. Left-Click anywhere in the room to place an Figure 3-6 instance of the ball object. Notice that the object snaps to a position that is aligned to the top-left corner of the grid. 42. Left-click anywhere in the room to place another instance of the ball. 43. Right-click on each ball object to delete both of them. 44. Hold down the [Alt] key on the keyboard and left-click anywhere in the room. An instance of the object is placed in the room, but it does not snap to the grid lines. 45. Hold down the [Ctrl] key and left-click the ball object you just added. Drag the ball so it is located in the center of the room and then release the mouse button. Notice as you drag the object, it snaps to the grid. If you hold down the [Ctrl] and[Alt] keys, you can drag the object without it snapping to the grid. 46. Change the object to be inserted to the OBJ_Wall object. 47. Move the cursor to the top right corner of the room. 48. Hold down the [shift] and [Ctrl] keys, then click the left mouse button and drag along the top of the room to add a series of OBJ_Wall objects to create a wall. Notice that the wall bricks automatically snap to the grid, which results in gaps in the wall. 49. Hold down the[shift] key, then click the right mouse button and drag across the wall objects to erase them. 50. Change the grid size to 16 X 16. The sprite assigned to OBJ_Wall object is 16 X 16 pixels so the grid now matches the size of the object. 51. Holding down the [shift] and [Ctrl] keys, drag to create a row of OBJ_Wall objects along the top of the room. There should be OBJ_Wall objects added to create no gaps in the wall now. a wall around the room 52. In a similar manner, create a wall all the way around the room. See Figure 3-7. 53. Close the room by clicking the windows close button. When prompted save the Figure 3-7 room.

12

Introduction to Video Game Design

Grade 9 BBT

Programming Conditions and Events Remember, Game Maker uses events and actions to create the interactions needed in a game. Your game does not yet have any programming, only scene design. The first programming is to create an event for the ball to move in a random direction. Random actions and chance allow games to be unpredictable and more fun when replayed. 55. In the resource tree, double-click on the OBJ_Ball leaf to open the Object Properties dialog box. Notice the Events: and Actions: columns. These columns are used for programming. 56. Click the Add Event button at the bottom of the Events: column. The Choose an Event to Add dialog box is displayed. 57. Click the Create button in the Choose the Event to Add dialog box. An event is added that translates to: IF the OBJ_Ball object is created, THEN perform all actions displayed in the Actions: column. Right now, the Actions: column is black, so you need to add something cool for the ball to do when the game begins. The first action will be to make the ball object move. 58. Click the Move tab Click the on the right side of move tab the Object Properties dialog Drag the Move box, Figure 3-8. Fixed button into 59. Hover the cursor the Actions: over each button column on the first row to find the Move Fixed button. Drag this button and drop it onto the blank section of the Actions: column. The Move Fixed dialog box is displayed and the start moving in a direction entry appears in the Action: column. 60. In the Move Fixed dialog box, click the Self radio button in the Applies to area, Figure 3-9. Since you are modifying the properties of the OBJ_Ball object, this means that the selected movement will apply to that object (self).

Movement should be applied to the ball (self). Select the four directional arrows Set speed

61. At the bottom of the Move Fixed dialog box is a matrix of directional arrows. Click Figure 3-9 the four diagonal arrows to select them. Selected arrows are red, while unselected arrows are blue.

Leave unchecked

When the game is played, one of the selected directions will be randomly applied to the object. This means that the ball will randomly travel in one of these four directions. Do not click the center square. The center square is no movement. If you were to run the game right now, even with the directions selected, the ball would not move because it would be travelling at a speed of zero.

13

Introduction to Video Game Design

Grade 9 BBT

62. In the Speed: text box, enter 10. This setting will have Game Maker move the OBJ_Ball object 10 pixels for every one step of time. The default setting for a step is 30 per second. 63. How many pixels will the ball move in one second? (answer on your activity sheet) To change the speed of all objects, you can also change the step number. If the step number is increased, the speed will increase. If the step number is decreased, the speed will decrease. If you wanted the ball to travel 120 pixels in one second and entered 2 in the object’s speed: setting, what would the step number need to be to get the ball to move properly? (answer on your activity sheet). The step number setting is not changed in the Move Fixed dialog box. You will not change this setting for this lesson, but in later sessions. Relative is a term that means “from where it was before.” If the ball is already moving at a speed of five, a relative speed of ten would increase the speed by ten, not to ten. In other words, the new speed would be 15. What would be the speed of an object traveling at a speed of 15 when the speed is increased for a speed: setting of 10 relative? (answer on your activity sheet). 64. Make sure the Relative check box is unchecked. 65. Click the OK button in the Moved Fixed dialog box. 66. Close the Object Properties dialog box, saving the changes when prompted.

Testing While designing a game, you will want to try things out along the way to make sure everything is working as you intended. Click the Run the Game button on the toolbar. When the game compiles and starts, the ball will move, but it eventually travels outside the room. It does not bounce off the walls as it should. In a game, just because it looks like a wall does not mean it will act like a wall. Remember, the “wall” is just a picture of a wall. You now need to program the wall and ball objects to react to each other as if they were real. This concept is called collision theory. You need to apply collision theory so the objects act realistically during gameplay. A collision is simply When things touch, hit, or come in contact with each other. Not all objects will react when they collide. Think about a flying game with an airplane and clouds. For Click Ball game, you need to create a new event for: IF OBJ_Ball object collides with OBJ_Wall object, THEN the OBJ_Ball object bounces. Follow the steps below to program this: 68. Close the game preview. 69. In the resource tree, double-click OBJ_Ball to open the Object Properties dialog box. 70. In the Object Properties dialog box, click the Add Event button. 71. In the Choose the Event to Add dialog box, click the Collision button. A menu is displayed showing all of the available objects. Select the OBJ_Wall object for this collision. Notice that a new event has been added to the Events: column in the Object Properties dialog box. Each event will be listed on a separate line. Now, you must add the action that will take place for the event. 72. On the Move tab of the Object Properties dialog box, locate the Bounce button and drag it into the Actions: column. The Bounce dialog box is displayed. 14

A: 600

A: 60

A: 25

Introduction to Video Game Design 73. Click the Self radio button so the ball will bounce, not the wall (you are adjusting the ball object properties), Figure 3-10. 74. Click the button to the right of the Precise: text box and select Not Precisely from the menu. 75. Click the button to the right of the Against: text box and select Solid Objects from the menu. Remember, the wall object is set to be a solid object. Since the ball is now set to bounce against solid objects, if you edit the wall object and uncheck the Solid check box, the ball will pass right through the wall.

Grade 9 BBT

Select to apply the bounce to this object Click to select a precision Click to select against what the bounce will occur ision Figure 3-10

76. Click the OK button to close the Bounce dialog box and add the action to the object properties. 77. Test play the game. You do not need to close the Object Properties dialog box to test the play the game. After seeing how the game runs, close the game preview. 78. Save your work.

Mouse Click on Ball You now have a bouncing ball, but nothing else. Time to add some fun to the game and give the player a reason to play. You need to add an event. IF the player clicks the ball with the left mouse button, Then add a point to the score. Follow the steps below to program this. The Object Properties dialog box should be open. If not, double-click on OBJ_Ball in the resource tree to open it. 79. Click the Add Event button. 80. In the Choose the Event to Add dialog box, click the Mouse button and, in the menu that is displayed, select Left Pressed. Do not select Left Button. The Left Pressed option is the condition when the player clicks the button. The Left Button option is the condition when the left mouse button is being held down, not clicked. 81. In the Object Properties dialog box, click the Score tab. 82. Locate the Set Score button and drag it into the Action: column. The Set Score dialog box is displayed. 83. In the Set Score dialog box, enter 1 in the New Score: text box. 84. At the bottom of the Set Score dialog box, check the Relative Check box. Then, click the OK button. Remember, relative means “from where it was before.” This action changes the score to “one from where it was before.” In other words, it increases the score by one each time the ball is clicked with the left mouse button. If you do not check the Relative check box, the score will always be 1. 85. Close the Object Properties dialog box, saving the changes when prompted. 86. Save your work. 87. Test play the game and see how many times you can click the ball in one minute. The score is displayed in the title bar of the game preview. Then close the game preview.

15

Introduction to Video Game Design

Grade 9 BBT

Cashing in on Sound You now have the elements of a simple game, but it needs a little tuning or improvement. Start by adding some sound to let the player know when the ball has been clicked and a point has been received. First, you need to add sound to the resource tree. Note: If you cannot find the sound file you want in the Stu Shared folder→BBT9→Game Maker→ Assetts→Sounds, then it is worth creating a free account at the following web site and then you can download royalty free sounds free. http://www.audiomicro.com/free-soundeffects/free-amusement-and-games . 88. Click the Create a Sound button on the toolbar. Name the The Sound Properties dialog box is displayed. Sound asset Figure 3-11. Click here to 89. In the Name : text box, enter SND_Click. This load a sound identifies the sound for the click event. 90. Click the Load Sound button. A standard Figure 3-11 windows “open” dialog box is displayed. 91. Navigate to Game Maker Sounds folder : Stu Shared folder→BBT9→Game Maker→ Assetts→Sounds. 92. You can preview any sound in media player by right-clicking on the file and selecting Play from the shortcut menu. Select the Paddle ball hit 1.wav sound file in the open dialog box and click the Open button. 93. Leave all default settings as they appear, and click the OK button to close the Sound Properties dialog box. Next, you need to program the logic statement: IF the player clicks on the ball, THEN add one to the score AND play a sound. You have already programmed part of this logic statement, where the score is increased when the player clicks the ball. So, you need to add another action to this existing statement. 99. Open the Object Properties dialog box for the OBJ_Ball object. 100. In the Event: column, select Left Pressed. The action currently assigned to this event is then displayed in the Actions: Drag a new action and drop column. Currently, the only it in the Actions: Column Select the event to modify action listed is Set the Score relative to 1. 101. On the right-hand side of the Object Properties dialog box, click the Main 1 tab. 102. Locate the Play Sound button and drag it into the Actions: column, Figure 13-12. The Play Sound dialog box is displayed. Figure 3-12 103. In the Play Sound dialog box, click the selection button to the right of the Sound: text box. A menu appears listing all of the sounds that have been added to the game. 104. Select the SND_Click sample in the menu. 16

Introduction to Video Game Design

Grade 9 BBT

105. Click the selection button to the right of the Loop: text box and select False from the menu. Loop means the sound will play again after it finishes. The click sound should play only once each time the ball is clicked, so it should not loop. False is a programming command for “no.” To make the sound loop, choose True in the menu for “yes.” 106. Click OK in the Play Sound dialog box to finish creating the new action. 107. Save your work and test the game.

Victory Condition The Victory condition is what it takes to win the game. In the Click Ball game, the player will win if the ball is clicked ten times. The game needs to be programmed to check each time a point is scored to see if the total is enough to win. This procedure is called a test. In a test, the programming looks to see if a condition is True or False. Each time the programming tests a condition, it will return a value of True or False. In this case, the victory condition is when True is returned for the test: Is the score equal to 10 points? 110. Open the Object Properties dialog box for the OBJ_Ball object. 111. In the Event: column, select Left Pressed. This is the event that adds 1 to the player score and plays the click sound. Select the event Drag the Test Score button and 112. Click the Score tab, then drag the Test Score button and drop it into the to modify drop it in the Actions Column Actions: column, Figure 3-13. The Test Score dialog box is displayed. 113. In the Test Score dialog box, enter 10 in the Value: text box. 114. Click the select button to the right of the Operation: text box and select Equal To in the menu that appears. 115. Click the OK button to close the Test Score dialog box and finish creating this action. This action tests if the Figure 3-13 score is equal to 10 every time the ball is clicked by the player. 116. Click the Main 2 tab. 117. Locate the End Game button. Drag and drop it into the Actions: column. Make sure the action is at the bottom of the list. If not, drag it to the bottom of the column. This action will end the game when the score reaches 10. The action must be at the bottom of the list because Game Maker processes the list in order from top to bottom. If, for example, the End the Game action is placed above the If Score is equal to 10 action, the game will end the first time the player clicks the ball. Save your work and test play the game.

17

Introduction to Video Game Design

Grade 9 BBT

Room for Expansion You have reached a milestone of design. Milestones of design are key points in the process of creating a game that represent significant events, such as the first playable level. The first playable level is the prototype version of the game. The click Ball game has reached the first playable level milestone. It could use a little improvement, but it is a solid game. To add another level is very easy since most of the programming is already done. You can simply copy the first level and then edit it to require more skill to win. To better tell the player that a different level is being played, you will change the background. For the second level, you will add a picture background. 118. In the resource tree, right-click on room0 and select duplicate from the short cut menu. Level 2, room1 is ready. 119. Click the Create a Background button on the toolbar. The Background Properties dialog box is displayed, Figure 3-14. 120. In the Name: text Click to assign box, enter a background BCK_Level_2. This follows the naming Assigned convention, which background calls for all background assets to begin with BCK_. Adjust the 121. Click the Load background Background button. position Figure 3-14 A standard windows “open” dialog box is displayed. 122. Navigate to the GameMaker Backgrounds in the Stu Shared drive: Grade 9BBT folder→GameMaker→Assets→Graphics→back_Wood.png 123. Select the back_Wood.Png file and click the Open button. 124. Close the Background Properties dialog box. 125. If the Room Properties dialog box for room1 is not open, double-click room1 in the resource tree to open it. 126. Click the Backgrounds tab. 127. Click the selection button to the right of the display box in the middle of the tab. Then select BCK_Wood from the menu that is displayed. Just above the background display box, which now displays BCK_Wood, is the Foreground image check box. The Foreground is the image in front of all other images, as opposed to the background, which is the image behind all images. If you make the wood the foreground, the player will not be able to see the rest of the game. However, there are some instances where you will want the “background” image to be the foreground. For example, if the image is a frame surrounding the playing field, you may want this image to be in the foreground do it is always in front of other objects. 128. Check the Foreground image check box. Notice the “background” is now in front of all other objects. Uncheck the Foreground image check box to return the background to behind all other objects. 18

Introduction to Video Game Design

Grade 9 BBT

129. Click the Settings tab and enter Level 2 in the Caption for Room: text box. 130. On the Toolbar in the Object Properties dialog box, click the Close the form, saving the changes button (green check mark) to close the dialog box and save the changes you made to the room, Figure 3-14A. 131. Save your work.

Close the form, Saving changes

Level 2 Modifications

Select the Settings tab Caption for Room text box Figure 3-14A

Using skills you learned earlier, increase the difficulty for level 2. For example, you could add some additional wall blocks to the room. This will give the ball more objects to bounce off of, which means it will change direction more often and be harder to click. You could also change the speed of the ball. Be creative in applying what you have already learned.

Cheat Code A Cheat code is a shortcut built into the game to help the quality assurance team and programmers navigate through the game. This allows them to jump past certain points without having to complete the task or level. To help you pass each level while testing your game, you will now program a cheat code. To stop the ball, program the logic statement: IF the player presses the space bar, THEN set the ball speed to zero. To return the ball to normal speed, program the logic statement: IF the player presses the [Enter] key, THEN set the ball speed back to normal. 132. Open the Object Properties window for the OBJ_Ball object. 133. Add an event for pressing the space bar. Use what you have learned to figure out how to do this. 134. Add an event for pressing the [Enter] key. 135. Add an action for the event you just created that sets the ball speed back to the original speed for the level. 136. Test play the game and try out your cheat codes. 137. Save your work.

Next Room Currently the player cannot get to Level 2 once level 1 is defeated. This is because the programming currently ends the game when 10 points are achieved on Level 1, instead of moving the player to Level 2. Why? This is the Victory condition you programmed earlier, to end the game when 10 points were achieved on level 1. The victory condition for Level 1 needs to be modified: IF the score is 10, THEN go to the next level (room). 139. Open the Object Properties dialog box for OBJ_Ball. 140. In the Event: column, Select Left Pressed. 141. In the Actions: column, right-click on End Game and select Delete from the shortcut menu. 142. Click the Main 1 tab. 143. Drag the Next Room button into the Actions: column.

19

Introduction to Video Game Design

Grade 9 BBT

Level 3 144. 145. 146. 147. 148.

Duplicate room1 (Level2) to create room2 (level3). Change the Caption to Level 3. Modify the wall layout for more challenging gameplay. Change the background. For OBJ_Ball object, add programming below the existing 10 point victory condition action: IF score equals 20, THEN move to the next room. 149. Save your work.

Level 4: The End At the end of the game, the player should see some sort of congratulations. You will create this as a custom sprite with text. 150. Click the Create a Sprite button on the toolbar. The Sprite Editor is displayed. 151. In the Name: text box, enter SPR_EndText. 152. Click the Edit Sprite button to create an image from scratch. The Sprite Editor is displayed. 153. Click the Create New Sprite button on the Sprite Editor toolbar to display the Create a New Sprite dialog box. Note: this dialog box may be automatically displayed when the Sprite Editor is launched. Change the Height: and Width: settings to 100 and click the OK button. A square canvas with a checkerboard pattern is displayed in the Sprite Editor. The checkerboard pattern represents transparent parts of the image and will not be part of the final image. Double-click on the checkerboard canvas to open the Image Editor. The Image Editor is used to create custom drawings and images, much like Microsoft Paint. 154. Notice the colour palette on the right-hand side of the Image Editor. The Left: sample colour is what will be used for the text. Right-clicking will set Left and the colour for the Right: Draw Text Right sample. button Left and Samples 155. Click the Draw Text button. Transparent Right The Font area is displayed Click to select Background Samples Transparent below the buttons, Figure 3- the font, its size Background and colour 15. Figure 3-15 156. Click the Aa button in the Font area to display a standard Alignment Figure 3-15 Windows font selection dialog options for text box. 157. Enter 20 in the Size: text box, and enter Bold in the Font Style: text box. You can also make selections in the corresponding lists. 158. Click the OK button to close the font selection dialog box and return to the Image Editor. 159. Click anywhere on the image canvas (the checkerboard section) to begin placing the words. The Drawing a Text dialog box, is displayed. 160. In the Drawing a Text dialog box, type a phrase such as Congratulations!#You are a#WINNER! The pound sign (#) indicates where a new line will start. 161. Click the OK button in the Drawing a Text dialog box to place the text onto the canvas. 20

Introduction to Video Game Design

162. 163. 164.

165. 166. 167. 168. 169. 170. 171.

172. 173. 174. 175. 176.

Grade 9 BBT

Notice that the words do not fit on the canvas. Game Maker is not very friendly with text. So, the best thing to do is undo the text placement, then either resize the canvas or use a smaller text size. For this example, you will resize the canvas. Click the Undo button on the Image Editor toolbar to remove the text. Select Transform→Resize Canvas… from the Image Editor pull-down menu. The resize dialog box is displayed. In the Resize dialog box, uncheck the Keep Aspect Ratio check box. If you do not uncheck this, as the canvas is resized, the height and width will remain proportional. Proportional means the ratio of height to width remains the same. Enter 300 in the Width: pixels text box. Make sure 100 is entered in the Heigth: pixels text box. Then click the OK button to close the Resize dialog box. Make sure you have the Draw Text button still selected, then click near the top-left corner of the canvas to start placing the new text. Retype your statement in the Drawing a Text dialog box when it appears and then click the OK button to place the text. Move the cursor over the text on the canvas. A move cursor (four arrows) is displayed. Click and drag the text to the center of the canvas. Click the Center Align button in the Font section. Click the Close the Image Editor, saving changes made button (green check mark) to close the Image Editor. In the Sprite Editor, click the OK, save changes button (green check mark) to close the Sprite Editor. Also, close the Sprite Properties dialog box, saving the changes when prompted. Create a new object, name it OBJ_EndText, and assign the SPR_EndText sprite to it. Create a new room (room3), which will be the room displayed when the player completes the game. In the Room Properties dialog box for room3, add a background image of your choice to the room, but it should complement the yellow text. Add the OBJ_EndText object to the room and place it in the center. Open the Object Properties dialog box for the OBJ_Ball object. Add the programming needed to move the player from room2 to room3 when the score is 20. Now the game has a victory condition for each level and the player receives a message when the game is successfully completed. However, on the final screen, there should be a way for the player to either replay the game or end the game. To do this, you will as Quit and Play buttons to the final screen (room3).

177. Create a new sprite, name it SPR_Quit, and assign the Quit.png image from the Assets file in the GameMaker folder in the BBT9folder. 178. Create a new Sprite, name it SPR_Play, and assign the Play.png image from the Assets folder named above. 179. Create a new object, name it OBJ_Quit, and attach the SPR_Quit sprite to it. 180. Create an event: IF the player clicks the left mouse button. Remember how you did this for the OBJ_Ball object? 181. Create an action: THEN end the game. Remember how you did this to end the game before you added additional rooms? 182. Create a new object, name it OBJ_Play, and attach the SPR_Play sprite to it.

21

Introduction to Video Game Design

Grade 9 BBT

183. Program this logic statement for the OBJ_Play object: IF the player clicks the left mouse button, THEN go to room0. For this action, you need to drag the Different Room button from the Main 1 tab and drag it into the Actions: column. In the Different Room dialog box that is displayed, select room0. 184. Place the OBJ_Quit and OBJ_Play objects in room3, Figure 3-16. 185. Save your Work. Figure 3-16

Title Page A game should always start with some directions on how to play the game. For this game, you will create a title page to tell players the name of the game and to give basic directions for playing. Start by creating a room above room0. 186. Right-click on room0 in the resource tree. This is currently the topmost room in the tree. 187. Select Insert Room from the pull-down menu, a new room named room4, is placed above room0 in the resource tree. 188. Using the skills developed in this lesson, create an attractive slide to inform the player how to play the game. Include a game title, directions, your name, and images and directions needed to explain what the player should do. 189. Add Quit and Play buttons to this room as well. 190. Test play the game. Check that all buttons work properly and that all aspects of the game function as they should. 191. Save your work.

Going Beyond 192. Add a second ball to the game, different from the first ball (like a basketball). 193. Add enemy objects to the game and program this logic statement: IF the player clicks an enemy object, THEN the game ends. 194. Program the ball objects to bounce when colliding with enemy objects. 195. Change your Title sprite to reflect the changes in your game. 196. Rename all rooms in order as Title, Level_1, Level_2, Level_3, and Winner. To rename a room, right-click on it in the resource tree and select Rename from the shortcut menu.

Adding Music Follow the directions below to add background music to each of your rooms. To improve the atmosphere we are going to add background music to the game. Click on the button to add a sound. In the form give the sound an appropriate name and press the Load Sound button. Select the file Snd_music.mp3 This is an mp3 file, which are useful as background music as they are rather small, and many can be found for free on the internet. Press OK to close the sound form. Consider using a different background music file for each of your rooms. Now we need to make sure that the sound will play at the beginning of the game and loop forever. We are going to use an additional object for it. Press the button with the blue ball to add a new object and give it an appropriate name (OBJ_SndBackground1). It does not need a sprite. Click 22

Introduction to Video Game Design

Grade 9 BBT

on the Add Event button and select the Create event. At the right side select the page main1 and drag the Play Sound action into the action list. As a sound select the music and set loop to true. So the music will now play forever after the object is created. Press OK to close the action form and again press OK to close the object form. We still need to add the object to the room, otherwise it won't be created. In the list at the left double click on the room to open its form. Make sure the objects page is visible at the left. Click on the menu icon in the middle to select the music object. Now click somewhere in the room to add an instance of the object. The object has no sprite so a little blue ball with a question mark is shown instead: Be careful to only add one instance of the music object. Press the green checkbox to close the room form. Save the game and run it. You should now hear background music.

Adding Score Watch this video to see how to add score. You may need to pause and watch several times. http://www.youtube.com/watch?v=-u-z27TCvaQ You will need to undo the score settings in order to make this work: In each of the OBJ_Ball objects, in the Create event, set Variable action. (Variable score to 1) Add a Variable Action to Left Pressed (Set variable score to 1) Add a draw event (so the game draws a score on the screen) Note: Draw events render the objects sprites invisible so we need to make a draw sprite action. Add a Draw Sprite Action to the Draw event. Select the SPR_Ball & set to relative. Set the colour of the text for your score. (I used Yellow) Create a Font, name it FNT_1 and make it bold. Then set the font in the Actions column of the Draw event. Next, Drag the Draw Variable action into the Action column and set the variable to score and the x: to 1 and leave the Y: to 0. This will place the score in the top right corner of your room.

Compile to an Executable So far you have test played the game at various points during the game build. It is important to make all final changes to the game before it is compiled into an executable file. The executable file cannot be modified. To make changes to the game after the executable file is created, you must make changes in Game Maker and rebuild the executable file (replacing the existing file). Once the game has been compiled into an executable file, It can be played on any computer without needing to have Game Maker installed. 195. Select File→Create Executable… from the pull-down menu. A standard Windows “save” dialog box is displayed. 196. Navigate to the folder where you want to save the executable (your Game Maker Folder). Click Save. 23

Introduction to Video Game Design

Grade 9 BBT

197. Test play the executable file and enjoy your success.

Game Review Just as a professional Programmer and Game developer would, you will Evaluate the quality of your work using the form below. Have another student play your game, and evaluate it using the form. Make any changes based upon the evaluation results before you submit your work to your teacher.

Game Build Evaluation sheet Criteria Concept: Is the idea well developed? Aesthetics: Do the look and colours fit the game? Sound Effects: Do the sounds play well? Are the music and other sounds appropriate? Functionality: Does everything work? Replay: How likely are you to play this game again?

5

Anything less than 5, include comments for improvement

Score

Clear, includes a title with clear instructions Awesome graphics and theme-based colours Good sound for each item and at good levels Plays perfectly; no bugs, glitches or errors Cannot wait to play this again

Extension Activities Select a tutorial from the tutorial section of Game Maker Complete the instructions, but add some more levels and create an executable in your folder. Review your work before submitting to your teacher.

24