Presentation is loading. Please wait.

Presentation is loading. Please wait.

VIDEO GAME PROGRAMMING Video Game Programming Snowball Wars INSTRUCTOR TEACHER’S ASSISTANT.

Similar presentations


Presentation on theme: "VIDEO GAME PROGRAMMING Video Game Programming Snowball Wars INSTRUCTOR TEACHER’S ASSISTANT."— Presentation transcript:

1 VIDEO GAME PROGRAMMING Video Game Programming Snowball Wars INSTRUCTOR TEACHER’S ASSISTANT

2 VIDEO GAME PROGRAMMING PART 1 – Snowball Wars BASICS Objective: –Create the Title Screen and have it display until the user hits to start the game. Step 1 – Create Title Screen Art Step 2 – Rename ‘Level_1’ to ‘Title’ Step 3 – Add Map to ‘Title’ level Step 4 – Build and Run

3 VIDEO GAME PROGRAMMING CONCEPT – File Formats A file format is the way data is encoded for different types of files. Some common file formats are.bmp,.gif,.txt,.doc,.mp3 and.wav Images in FUN are.bmp (Bitmaps) and sounds are.wav (WAVE form audio format).

4 VIDEO GAME PROGRAMMING STEP 1: Create Title Screen Art Open Microsoft Paint. Go to the Image menu and select Attributes. Set Width to 640 and Height to 480. Draw something pretty! Put “Snowball Wars” somewhere on the image. Add text that says “Hit Enter to Start” When you’re done, go to the File menu and select Save As… In the File Name text box, enter “Title”, then save to the Maps folder in Art Assets. Click OK.

5 VIDEO GAME PROGRAMMING Title Screen Art

6 VIDEO GAME PROGRAMMING STEP 2: Rename ‘Level_1’ to ‘Title’ Go back to your Snowball Wars project in FUN. In the Project Resources under Game, right-click on ‘Level_1’. Select Rename. Where it asks you to enter the new name, enter “Title”. Hit OK.

7 VIDEO GAME PROGRAMMING STEP 3: Add the Map to Title Level Under the Title level, right click on Maps. Select Add from the pop-up menu.

8 VIDEO GAME PROGRAMMING STEP 3: Add the Map to Title Level Enter ‘Title’ for Map Name. Where it says Filename, click the button with ‘…’ on it.

9 VIDEO GAME PROGRAMMING STEP 3: Add the Map to Title Level continued… Navigate to the folder containing your game. Find the Maps folder in Art Assets and select the title.bmp that you created earlier. Click Open to load the bitmap. Click OK in the Map Properties.

10 VIDEO GAME PROGRAMMING STEP 4: Build and Run Click the Build and Run button to check out your game!

11 VIDEO GAME PROGRAMMING PART 2 – Adding the Main Level Objective: –Create the main level, using the same method we did for the Title Screen. Step 1 – Create Map Background Art Step 2 – Add a new level to the game. Step 3 – Add Map to ‘Level1’. Step 4 – Build and run.

12 VIDEO GAME PROGRAMMING STEP 1: Create Background Art Open MS Paint. Set the Image Width to 640 and the Image Height to 480. Draw a basic map with NO OBSTACLES! We add those later. Save as bg.bmp in the Maps folder in Art Assets.

13 VIDEO GAME PROGRAMMING Sample Background Art

14 VIDEO GAME PROGRAMMING STEP 2: Add a new level Right click Game in the Project Resources and select Add Level. Rename ‘Level_2’ to ‘Level1’.

15 VIDEO GAME PROGRAMMING STEP 3: Add Map to Level1 Add a new map to Level1. Name the map BG and use your bg.bmp art you created earlier. Make sure you add the new map to Level1 and NOT Title!

16 VIDEO GAME PROGRAMMING STEP 4: Build and Run Click the Build and Run button to check out what you have so far. Try hitting to move on to the next screen like we want it to. What happened? Why?

17 VIDEO GAME PROGRAMMING CONCEPT – Level Behavior Why did your game not move to the next level when you hit ? Because we didn’t tell the game to do it! If we want anything to happen in our game, we have to tell the game what to do and when to do it. Here we can use the idea of Level Behavior.

18 VIDEO GAME PROGRAMMING Concept – Level Behavior continued… We can use Level Behavior to tell our game to do certain things in any particular level. The level can perform actions based on key presses, timers, or other game events.

19 VIDEO GAME PROGRAMMING PART 3 – Adding Level Behavior Objective: –Add the behavior to the Title level that allows us to start the game when we hit. We’re also going to look at some C++ code! Step 1 – Examine the Level Behavior code. Step 2 – Add proper behavior to the Title level. Step 3 – Build and run.

20 VIDEO GAME PROGRAMMING STEP 1: Examine Level Behavior Code Under Game Assets, under Behavior, expand the Object Functions tree. Find the function called KeyboardLevelAdvanceFN and double-click on it.

21 VIDEO GAME PROGRAMMING KeyboardLevelAdvanceFN // If any key is pressed on the keyboard the game // will advance to the next level if (KeyTriggered(DIK_RETURN)) { NextLevel(); }

22 VIDEO GAME PROGRAMMING C++ Concepts: ‘if’ Statements The KeyboardLevelAdvanceFN is a perfect example of an if statement. You can look at if statements exactly like you would if it were a sentence. ie. “If you hit enter, advance to the next level.”

23 VIDEO GAME PROGRAMMING C++ Concepts: ‘if’ Statements continued… An if statement consists of 3 parts. 1.The if keyword. 2.A “Conditional” statement. 3.The code to execute if the Conditional is true.

24 VIDEO GAME PROGRAMMING C++ Concepts: ‘if’ Statements continued… Example: if( something Is True) { do Something; }

25 VIDEO GAME PROGRAMMING C++ Concepts: Comments A Comment in C++ is something in your code that the computer does not compile into machine code. You use comments to make notes in your code like why you did something, when it happens, or what it does.

26 VIDEO GAME PROGRAMMING C++ Concepts: Machine Code So what is machine code exactly? Machine Code is the language of a computer. We use C++ to write code that is easy for humans to understand, and then we use a compiler to translate the C++ code into machine code. Machine code might look something like… 100011011011000111001101010110011

27 VIDEO GAME PROGRAMMING C++ Concepts: Comments continued… A Comment consists of 2 parts: 1.Two slashes like so: // 2.Text Example: // This is a comment. You can also // extend a comment onto multiple // lines like this.

28 VIDEO GAME PROGRAMMING C++ Concepts: Comments continued… // This is a comment… This is not. If you forget the ‘//’, you’ll break your game and it will not build!

29 VIDEO GAME PROGRAMMING STEP 2: Add Level Behavior to Title Right Click the Title level under the Game tree. Select Properties. In the Level Properties menu, in the Behavior tab, click the button with ‘…’ on it.

30 VIDEO GAME PROGRAMMING STEP 2: Add Level Behavior to Title continued… Under Functions, find the KeyboardLevelAdvanceFN function and hit the plus button.

31 VIDEO GAME PROGRAMMING STEP 2: Add Level Behavior to Title continued… Hit OK. Hit OK one more time at the Level Properties menu.

32 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. At the Title screen, try hitting. Now that you’re in the main game level, try hitting. What happened? Why?

33 VIDEO GAME PROGRAMMING PART 4 – Adding the Player and Enemy Actors Objective: –Now we’re going to add the player to the game! Here we’ll focus on adding an animation for the player. We’re going to do almost the exact same thing to add an enemy. Step 1 – Create Player and Enemy art. Step 2 – Add the Player and Enemy actors Step 3 – Add animations to both actors. Step 4 – Build and run.

34 VIDEO GAME PROGRAMMING CONCEPT – Animation An animation is a sequence of one or many frames that visually represent an action such as walking, shooting, etc… In Fun Actors are made up of Animation Sets.

35 VIDEO GAME PROGRAMMING STEP 1: Create Player and Enemy Art Open MS Paint. Set the Image Width to 64 and Image Height to 100. Fill the image with Bright Green. Draw your player character (not in Bright Green). Make sure he/she is facing right! Save as player1.bmp in the Actors folder in your Art Assets.

36 VIDEO GAME PROGRAMMING Example Player Art

37 VIDEO GAME PROGRAMMING STEP 1: Create Player and Enemy Art continued… In MS Paint go to the File menu and select New. Make sure the image width is 64 and the image height is 100. Create art for the enemy. Make sure the enemy is also facing right! Make sure the background is bright green! Save in your Actors folder as enemy1.bmp.

38 VIDEO GAME PROGRAMMING Example Enemy Art

39 VIDEO GAME PROGRAMMING CONCEPT – Actors Actors are the visual representations of the characters in FUN games. Think of an Actor as a cookie cutter. You can make lots of different characters out of one actor.

40 VIDEO GAME PROGRAMMING STEP 2: Add Player and Enemy Actors In FUN, under Game Assets right click on Actors. Select Add. Enter the name PLAYER and hit OK. Do the same thing again only this time name the new actor ENEMY.

41 VIDEO GAME PROGRAMMING STEP 3: Add Animations for Player and Enemy Actors Under Actors now right click on PLAYER and select Add Animation Set. Where it says Name enter Walk. Now we’re going to add a new frame to the animation by clicking on the Add button.

42 VIDEO GAME PROGRAMMING STEP 3: Add Animations for Player and Enemy Actors continued… Navigate to your Actors folder in Art Assets. Select player1.bmp and hit Open. You should see your player art on the film strip now.

43 VIDEO GAME PROGRAMMING It Should Look Something Like This: Finally, check the box next to Horizontal Flip and hit OK.

44 VIDEO GAME PROGRAMMING STEP 3: Add Animations for Player and Enemy Actors continued… Now do the same thing for the ENEMY actor. 1.Add the WALK animation set. 2.Add the single enemy1.bmp frame. 3.Check the Horizontal Flip box.

45 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and run your game. Hit to enter your main game level. What happened? Why?

46 VIDEO GAME PROGRAMMING CONCEPT – Sprites Sprites are considered to be living creatures that live, move and die during the game. Actors only define the shape that Sprites take to be represented in the game.

47 VIDEO GAME PROGRAMMING CONCEPT – Sprites continued… Think of it like this… Let’s look at Super Mario Bro’s. How many Goombas are there in the game? Hundreds? Thousands? Each one of those Goombas is a Sprite, and all of those Goombas share a single Goomba Actor that defines the animation(s) for every Goomba.

48 VIDEO GAME PROGRAMMING CONCEPT – Sprites continued… The reason you didn’t see your Player and Enemy in your game is because you haven’t added them as Sprites! Guess what’s next…

49 VIDEO GAME PROGRAMMING PART 5 – Adding the Player Sprite Objective: –Now we’re ACTUALLY going to add the player to the game. Pay attention because we’re going to use a similar technique to add the enemy. Step 1 – Add the Player Sprite to Level1. Step 2 – Set the Player Sprite Properties. Step 3 – Build and run.

50 VIDEO GAME PROGRAMMING STEP 1: Add Player Sprite to Level1 In the Game tree, under Level1, right-click on Sprites and select Add.

51 VIDEO GAME PROGRAMMING STEP 2: Set Player Sprite Properties Select the General tab. For the name, enter player. Select BG where it says Map.

52 VIDEO GAME PROGRAMMING STEP 2: Set Player Sprite Properties continued… Now select the Animation tab. Where it says Actor, select PLAYER.

53 VIDEO GAME PROGRAMMING STEP 2: Set Player Sprite Properties continued… Select the Position tab and click the button with ‘…’ on it. This will allow you to choose where the player actually is when we start the game.

54 VIDEO GAME PROGRAMMING STEP 2: Set Player Sprite Properties continued… Now, select the Displacement tab. Set the Speed to 5.

55 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run to see what happens. Hit to go into Level1 and see your sprite in action! Try moving the sprite around with W, A, S, and D keys. What happened? Why?

56 VIDEO GAME PROGRAMMING CONCEPT – Sprite Behavior The sprite didn’t move because we never TOLD it to move! Remember level behavior? Well here we’re going to give a Sprite behavior.

57 VIDEO GAME PROGRAMMING CONCEPT – Sprite Behavior continued… We can use Sprite Behavior for things like Player Input and AI. The difference between Sprite Behavior and Level Behavior is that you can have many different sprites on the same level, each having unique behavior.

58 VIDEO GAME PROGRAMMING PART 6 – Adding the Player Sprite Behavior Objective: –Here is where we add the movement behavior for the player sprite using the W, A, S, and D keys. Step 1 – Examine the Sprite Behavior Code. Step 2 – Add the Behavior to the Sprite. Step 3 – Build and run.

59 VIDEO GAME PROGRAMMING STEP 1: Examine the Sprite Behavior Code In the Game Assets tree, under Behavior, again under Object Functions, double-click on the KeyboardWASDMovementFN.

60 VIDEO GAME PROGRAMMING KeyboardWASDMovementFN // x and y directional components int xDir = 0, yDir = 0; // handle left and right movement if (KeyPressed(DIK_D)) { xDir = 1; } if (KeyPressed(DIK_A)) { xDir = -1; }

61 VIDEO GAME PROGRAMMING KeyboardWASDMovementFN continued… // handle up and down movement if (KeyPressed(DIK_W)) { yDir = -1; // remember: to go up on screen //the y gets smaller } if (KeyPressed(DIK_S)) { yDir = 1; // remember: to go down on //screen the y gets bigger }

62 VIDEO GAME PROGRAMMING KeyboardWASDMovementFN continued… // assign the new movement direction to the sprite This->VectorDirection(xDir, yDir); if (xDir == 0 && yDir == 0) { This->Frame(0); }

63 VIDEO GAME PROGRAMMING CONCEPT – Direction Vectors In FUN, a Direction Vector describes which direction a Sprite is going to move. We use Vector Direction and Speed to describe exactly how a Sprite moves.

64 VIDEO GAME PROGRAMMING CONCEPT – Direction Vectors continued… THINGS TO REMEMBER: In FUN, down is up! A Y direction of 1 will move the sprite DOWN, while a Y direction of –1 will move a sprite UP. Moving by (0, 10) is the same thing as moving by (0, 1), the Direction Vector is ONLY a direction,

65 VIDEO GAME PROGRAMMING CONCEPT – Direction Vectors continued…

66 VIDEO GAME PROGRAMMING CONCEPT – User Input User Input is how the Player communicates with the game. This could be a Keyboard, Mouse, Controller, Joystick, etc. These are called Input Devices. What are some other Input Devices?

67 VIDEO GAME PROGRAMMING STEP 2: Add the Behavior to the Sprite In the Game tree, under Sprites, right- click on the player sprite. Select Properties. Click on the Behavior tab. Where it says Functions, find the KeyboardWASDMovementFN and click the ‘+’ button. Click OK.

68 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. Go into Level1 and try moving your sprite around with W, A, S, and D. Try walking off the edge of the level. What happened? Why?

69 VIDEO GAME PROGRAMMING CONCEPT – Collision Detection Whenever we want to know when two things in our game are touching each other, we use the idea of Collision Detection. We use some rather advanced math to determine when two objects in our game hit each other… we won’t get into the math, don’t worry!

70 VIDEO GAME PROGRAMMING CONCEPT – Collision Detection FUN uses THREE types of Collision Detection: 1.Bounding Box – Draws a box around an object that is used for fairly fast, but inaccurate, collision detection. 2.Circular – Defines a circle around an object used for very fast, but inaccurate collision detection. 3.Segment – We draw a bunch of lines around and through our object that we check collision with. This method is accurate, but VERY slow.

71 VIDEO GAME PROGRAMMING CONCEPT – Collision Detection

72 VIDEO GAME PROGRAMMING PART 7 – Adding Collision Data Objective: –Now we’re going to add collision data to the map and player and enemy sprites. This will make it so we won’t walk off the edge of the screen. Step 1 – Add Rectangular Collision to Player actor. Step 2 – Add Rectangular Collision to Enemy actor. Step 3 – Build and run.

73 VIDEO GAME PROGRAMMING STEP 1: Add Rectangular Collision to Player Actor In the Game Assets tree, under Actors, double-click on the Player Actor’s Walk animation set. Click on the Collision Data button.

74 VIDEO GAME PROGRAMMING STEP 1: Add Rectangular Collision to Player Actor continued… Click on the box shaped like a Rectangle. Start from somewhere near the Top- Right corner of your Player Actor and drag to the Bottom-Left corner. Hit the Zoom In button three or four times if you need to.

75 VIDEO GAME PROGRAMMING STEP 1: Add Rectangular Collision to Player Actor continued… If all is done correctly, it should look something like this… Those little lines sticking out the edges of your Bounding Box are called Normals. Make sure your Normals are pointing outward, as shown.

76 VIDEO GAME PROGRAMMING STEP 1: Add Rectangular Collision to Player Actor continued… Now click the Save button and close the Collision Data window. Hit OK on the Animation Set window.

77 VIDEO GAME PROGRAMMING STEP 2: Add Rectangular Collision to Enemy Actor Open the Walk Animation Set for the Enemy Actor. Open the Collision Data window. Click the Rectangle button and draw a box around the enemy. Hit save and close the Collision Data window. Hit OK at the Animation Set window.

78 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. Now try moving to the edge of the screen. What happened? Why?

79 VIDEO GAME PROGRAMMING PART 7.1 – Adding Map Collision Data Objective: –The reason your character went off the edge of the screen is because, while the character has collision data, the map doesn’t. That’s what we’re doing here. Step 1 – Add Collision Data to the Level1 Map. Step 2 – Build and run.

80 VIDEO GAME PROGRAMMING STEP 1: Add Map Collision Data In the Game tree, under Maps, double- click on the bg map. In the General tab, click on the Collision Data button. Click the Rectangle shaped button. Start from the top-left corner and drag to the lower-right corner. Save and close the window. If done correctly, it’ll look a little like…

81 VIDEO GAME PROGRAMMING STEP 1: Add Map Collision Data continued…

82 VIDEO GAME PROGRAMMING STEP 2: Build and Run Build and Run your game. Now try moving to the edge of the level. What happened? Why?

83 VIDEO GAME PROGRAMMING PART 7.2 – Enabling Sprite Collision Objective: –Now, to get collision to work correctly, we have to tell the Sprites how to do the collision checking. Step 1 – Setup Sprite collision properties. Step 2 – Build and run.

84 VIDEO GAME PROGRAMMING STEP 1: Setup Sprite Collision Properties In the Game tree, under Level1, again under Sprites, double-click on the player sprite. Click the Collision tab.

85 VIDEO GAME PROGRAMMING STEP 1: Setup Sprite Collision Properties continued… Click the Precise Collision bubble. Now check the Activate Sprite Collision, Check With Sprites, and Check Collision With Map boxes. Hit OK.

86 VIDEO GAME PROGRAMMING STEP 2: Build and Run Build and Run your game. Now try running into the edge of the map. If all is well, you should be colliding with the map! If not, let us know!

87 VIDEO GAME PROGRAMMING PART 8 – Adding Enemy Sprite Objective: –Now that we have the player sprite in the game, let’s add the enemy sprite. Step 1 – Add the Enemy Sprite. Step 2 – Setup the Enemy Sprite Properties. Step 3 – Build and run.

88 VIDEO GAME PROGRAMMING STEP 1: Add the Enemy Sprite Add a new sprite to Level1. Name it “enemy”.

89 VIDEO GAME PROGRAMMING STEP 2: Setup Enemy Sprite Properties Set the actor to ENEMY. Choose a starting position. Activate collision by setting Precise Collision. Activate Sprite Collision and check Collision With Map. Set Speed to 5.

90 VIDEO GAME PROGRAMMING STEP 2: Setup Enemy Sprite Properties continued… This time, we’re going to do something a little different… In the Sprite Properties window, click the General tab. Now, where it says Display List, enter 1.

91 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. Try running into your enemy. What happened? Why?

92 VIDEO GAME PROGRAMMING PART 9 – Adding Enemy Sprite Behavior Objective: –Now that we have the enemy in the game, let’s get him moving around. Step 1 – Examine the SpriteMovementRandomFN function. Step 2 – Add the SpriteMovementRandomFN function to the Enemy sprite. Step 3 – Build and run.

93 VIDEO GAME PROGRAMMING STEP 1: Examine the SpriteMovementRandomFN function This->VectorAngle(RandInt(360));

94 VIDEO GAME PROGRAMMING CONCEPT – Random Numbers Random Numbers speak for themselves… they’re numbers… and they’re random! The RandInt() function you saw is how FUN generates a random number, you just specify the maximum number you want. Let’s say you use RandInt(20). This will give you a number between 0 and 19.

95 VIDEO GAME PROGRAMMING CONCEPT – Timer Functions When you only want something to happen every so often in your game, instead of happening constantly, you use a Timer Function. Timer Functions only run when the time that you specify runs out. For instance, if you click on the clock icon in Function Properties, you will see that our random move function only runs once every 60 game loops.

96 VIDEO GAME PROGRAMMING STEP 2: Add the SpriteMovementRandomFN function to the Enemy Sprite Open the Sprite Properties for the Enemy sprite. Click the Behavior tab. Add the SpriteMovementRandomFN using the ‘+’ button. Hit OK.

97 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. If all is well, your enemy should be moving around, changing directions about once every second. You should also be able to run into your enemy and stop them temporarily. If something is wrong, let us know.

98 VIDEO GAME PROGRAMMING PART 10 – Adding the Snowball Actor Objective: –Here we’re going to add the Snowball Actor. Step 1 – Create the Snowball art. Step 2 – Add the Snowball actor. Step 3 – Build and run.

99 VIDEO GAME PROGRAMMING STEP 1: Create the Snowball Art Open MS Paint. Create a new 32 x 32 image. Fill it with the green color. Draw a snowball. Save in your Actors folder as snowball.bmp.

100 VIDEO GAME PROGRAMMING STEP 2: Add the Snowball Actor Create a new Actor. Name the new actor SNOWBALL. Give that actor a new Animation Set named DEFAULT. Add your snowball.bmp to the DEFAULT animation set. Give the snowball some collision data.

101 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. Try left-clicking to throw a snowball. What happened? Why?

102 VIDEO GAME PROGRAMMING PART 11 – Adding the enemyShot Sprite Objective: –Now that we have some art for our snowball, let’s add some Sprites. Step 1 – Create the enemyShot sprite. Step 2 – Set the enemyShot properties. Step 3 – Build and run.

103 VIDEO GAME PROGRAMMING STEP 1: Create the enemyShot Sprite Create a new sprite for Level1. Name it enemyShot.

104 VIDEO GAME PROGRAMMING STEP 2: Set the enemyShot Properties Set Map to bg. Change Display List to 1. Where it says Local Data, select ShotData. Now click the Animation tab.

105 VIDEO GAME PROGRAMMING STEP 2: Set the enemyShot Properties continued… Set Actor to Snowball. Make sure the Initial Animation is DEFAULT and the Initial Frame is your snowball. Now click the Collision tab.

106 VIDEO GAME PROGRAMMING STEP 2: Set the enemyShot Properties continued… Set Precise Collision. Next, activate Sprite Collision. Make sure and set Check With Sprites. Now, click the Displacement tab and set the Speed to 7.

107 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. Is your enemy throwing snowballs? Why?

108 VIDEO GAME PROGRAMMING PART 12 – Adding Enemy and enemyShot Sprite Behavior Objective: –OK, now we’re going to make it so the enemy can nail you with snowballs! Step 1 – Add Proper Behavior to Enemy Sprite. Step 2 – Add Proper Behavior to enemyShot Sprite. Step 3 – Build and run.

109 VIDEO GAME PROGRAMMING STEP 1: Add Proper Behavior to Enemy Sprite Add the EnemyShootAtPlayerFN to the Enemy sprite.

110 VIDEO GAME PROGRAMMING CONCEPT – Hot Spots Hot Spots are used to define special or interesting spots on sprites. For instance, if we had a sprite with a rocket-launcher, we would use a Hot Spot to define where the rocket will appear when the sprite shoots.

111 VIDEO GAME PROGRAMMING CONCEPT – Hot Spots continued… If we put a Hot Spot somewhere near the Sprite’s hand, then when you throw a snowball we can make it appear near that spot.

112 VIDEO GAME PROGRAMMING STEP 2: Add Proper Behavior to enemyShot Sprite Add both the ShotDeleteOnSpriteCollisionFN and SpriteDeleteOutOfViewportFN to the enemyShot sprite. One last thing… In the enemyShot sprite properties in the General tab, set Unused to true.

113 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. Is the enemy throwing snowballs at you? If not, let us know!

114 VIDEO GAME PROGRAMMING PART 13 – Adding Enemy and enemyShot Sprite Behavior Objective: –Now that the enemy can throw snowballs at you, let’s make it so you can shoot back! Step 1 – Add playerShot Sprite. Step 2 – Add Proper Behavior to playerShot Sprite. Step 3 – Build and run.

115 VIDEO GAME PROGRAMMING STEP 1: Add playerShot Sprite OK, so I lied, we’re not really going to add a new sprite, set up the properties, and do all that stuff. Instead, we’re going to make a copy of the enemyShot sprite! Right-click on the enemyShot sprite and select Insert Copy.

116 VIDEO GAME PROGRAMMING STEP 1: Add playerShot Sprite continued… Enter playerShot for the name. Hit OK. Now, go into the Sprite Properties for playerShot and change Display List to 0.

117 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. Try left-clicking to throw snowballs. What happened? Why?

118 VIDEO GAME PROGRAMMING PART 14 – Adding a Cursor Objective: –The reason you couldn’t throw snowballs is that the game doesn’t know where to throw snowballs. Now we’re going to add a Cursor so the game knows where to throw the snowballs. Step 1 – Create Cursor Art. Step 2 – Add Cursor Actor. Step 3 – Add Cursor Sprite. Step 4 – Build and run.

119 VIDEO GAME PROGRAMMING STEP 1: Create Cursor Art Open MS Paint. Draw a 32x32 cursor. Save it as cursor.bmp in your Actors folder.

120 VIDEO GAME PROGRAMMING STEP 2: Add Cursor Actor Create a new Actor named CURSOR. Add a new Animation Set named DEFAULT to CURSOR. Add your cursor.bmp art to the DEFAULT animation set.

121 VIDEO GAME PROGRAMMING STEP 3: Add Cursor Sprite Add a new sprite to Level1. Name it cursor. Set Map to bg. Change Display List to 4. Set the Animation properties to use the CURSOR actor. Set the Position to the center of the screen.

122 VIDEO GAME PROGRAMMING STEP 4: Build and Run Build and Run your game. Try moving the mouse and shooting some snowballs. What happened? Why?

123 VIDEO GAME PROGRAMMING PART 15 – Adding Movement Behavior to Cursor Objective: –OK, now we’re actually going to make the cursor move. We do this by adding behavior to the Cursor sprite. Step 1 – Add Behavior to Cursor Sprite. Step 2 – Build and run.

124 VIDEO GAME PROGRAMMING STEP 1: Add Behavior to Cursor Sprite Add the MouseCursorMoveFN function to the Cursor sprite.

125 VIDEO GAME PROGRAMMING STEP 2: Build and Run Build and Run your game. Now try moving the cursor around and left-clicking to shoot snowballs. What happened? Why?

126 VIDEO GAME PROGRAMMING PART 16 – Adding Shooting Behavior to Player Sprite Objective: –OK, so we have our cursor now, let’s FINALLY make it so you can shoot snowballs! Step 1 – Examine the PlayerShootMouseFN Function. Step 2 – Add Shooting Behavior to Player Sprite. Step 3 – Build and run.

127 VIDEO GAME PROGRAMMING STEP 1: Examine the PlayerShootMouseFN Function Open the PlayerShootMouseFN function.

128 VIDEO GAME PROGRAMMING STEP 1: Examine the PlayerShootMouseFN Function continued… static int shootingDelay = 0; if (++shootingDelay < PlayerThrowDelay) return; This is the only part of the code we’re really worried about.

129 VIDEO GAME PROGRAMMING CONCEPT – Variables A Variable is something that holds a value that we’re interested in. For instance, look at the part in the code that says: if (++shootingDelay < PlayerThrowDelay)

130 VIDEO GAME PROGRAMMING CONCEPT – Variables continued… The PlayerThrowDelay is a Global Variable in our game. This means that we can use this data in any part of our game. If you open PlayerThrowDelay and examine it, you’ll see that Initial Value is set to 30. This means that the game waits 30 Frames before the player can shoot.

131 VIDEO GAME PROGRAMMING STEP 2: Add Shooting Behavior to Player Sprite Add the PlayerShootMouseFN function to the Player sprite.

132 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. Now try left-clicking to shoot at your enemy. If it didn’t work, let us know! Also, try shooting one of the enemies snowballs. What happened? Why?

133 VIDEO GAME PROGRAMMING CONCEPT – Ghost Collision To fix the little problem of snowballs colliding, go into both enemyShot and playerShot and, under the Collision tab, check the box next to Ghost Collision. Ghost Collision basically makes it so that if two objects collide, they don’t stop or reflect, but the collision is still recognized.

134 VIDEO GAME PROGRAMMING PART 17 – Adding Player and Enemy Scores Objective: –Now that we can hit our enemy with snowballs, and they can hit us, let’s keep track of all this by adding a score. Step 1 – Add New Text Objects. Step 2 – Set Text Properties. Step 3 – Build and run.

135 VIDEO GAME PROGRAMMING CONCEPT – Text Objects Text Objects in FUN are how you display text in your game. There are 2 types of Text Objects 1.Text 2.Numbers

136 VIDEO GAME PROGRAMMING CONCEPT – Text Objects continued… Text is where you write things like “Player Score:” or “Enemy Score:”. Numbers are where you actually display the score, ie. “10” or “5.4”. Text Objects belong to levels just like sprites, so if we want the same text in every level, we have to add it to each level.

137 VIDEO GAME PROGRAMMING STEP 1: Add New Text Objects Under Level1, right-click on Text Objects and select Add. In the General tab, set the Name to PlayerScoreNumber. Set Type to Number.

138 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties Under the Format tab, change the Font Color to Red. Set the Font Size to 24. Set Initial Value to 0.

139 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties continued… Now select the Position tab. Set the following properties: Left: 100 Top: 0 Right: 150 Bottom: 50

140 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. Try hitting the enemy with a couple snowballs. What happens? Why?

141 VIDEO GAME PROGRAMMING SIDE NOTE – Increasing Score To get your score to actually increase, you need to add the SpriteIncreaseScoreOnCollisionF N function to the playerShot sprite.

142 VIDEO GAME PROGRAMMING PART 17.1 – Adding Player and Enemy Scores Objective: –We’re continuing our quest for player and enemy scores. Step 1 – Add New Text Objects. Step 2 – Set Text Properties. Step 3 – Build and run.

143 VIDEO GAME PROGRAMMING STEP 1: Add New Text Objects Under Level1, right-click on Text Objects and select Add. In the General tab, set the Name to PlayerScoreText. Set Type to Text.

144 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties Under the Format tab, change the Font Color to Red. Set the Font Size to 24. Set Initial Value to “Score”.

145 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties continued… Now select the Position tab. Set the following properties: Left: 0 Top: 0 Right: 100 Bottom: 50

146 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. Again, try hitting the enemy with a couple snowballs. What happens? Why?

147 VIDEO GAME PROGRAMMING PART 17.2 – Adding Player and Enemy Scores Objective: –Now that the player has a working score, let’s add an enemy score. Step 1 – Add New Text Objects. Step 2 – Set Text Properties. Step 3 – Build and run.

148 VIDEO GAME PROGRAMMING STEP 1: Add New Text Objects Under Level1, right-click on the PlayerScoreNumber text object and select Insert Copy. Set the Name to EnemyScoreNumber and hit OK. Open the properties for the new text object and, in the General Tab, set Type to Number.

149 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties Under the Format tab, change the Font Color to Blue. Set the Font Size to 24. Set Initial Value to 0.

150 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties continued… Now select the Position tab. Set the following properties: Left: 600 Top: 440 Right: 640 Bottom: 480

151 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. This time, let your enemy hit you with a few snowballs. What happens? Why?

152 VIDEO GAME PROGRAMMING SIDE NOTE – Increasing Score To get the enemies score to actually increase, you need to add the SpriteIncreaseScoreOnCollisionF N function to the enemyShot sprite.

153 VIDEO GAME PROGRAMMING PART 17.3 – Adding Player and Enemy Scores Objective: –Now let’s finish up the enemy score. Step 1 – Add New Text Objects. Step 2 – Set Text Properties. Step 3 – Build and run.

154 VIDEO GAME PROGRAMMING STEP 1: Add New Text Objects Under Level1, right-click on the PlayerScoreText text object and select Insert Copy. Set the Name to EnemyScoreText and hit OK. Open the properties for the new text object and, in the General Tab, set Type to Text.

155 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties Under the Format tab, change the Font Color to Blue. Set the Font Size to 24. Set Initial Value to “Score”.

156 VIDEO GAME PROGRAMMING STEP 2: Set Text Object Properties continued… Now select the Position tab. Set the following properties: Left: 500 Top: 440 Right: 600 Bottom: 480

157 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. Again, let your enemy hit you with a few snowballs. What happens? Why?

158 VIDEO GAME PROGRAMMING PART 18 – Adding an Ending Screen Objective: –Now we’re going to add a You Win and You Lose screen and display them when the player either wins or loses. Step 1 – Create Screens Art. Step 2 – Add Ending Level. Step 3 – Set Level Properties. Step 4 – Build and run.

159 VIDEO GAME PROGRAMMING STEP 1: Create Screen Art Open MS Paint and create 2 different images, both 640x480. Save the Win Screen in your Maps folder as win.bmp and the Lose Screen in your maps folder as lose.bmp.

160 VIDEO GAME PROGRAMMING STEP 2: Add Ending Level Add a new level to the game. Rename the new level (level_3) to “ending”.

161 VIDEO GAME PROGRAMMING STEP 3: Set Level Properties Add a new map to ending level. Name the new map “win”. Set Filename to use your win.bmp. Uncheck the box next to Visible. NOTE: Doing this means the map will not initially be visible when the game starts. We make it visible with a special function.

162 VIDEO GAME PROGRAMMING STEP 3: Set Level Properties continued… Add a new map to ending level. Name the new map “lose”. Set Filename to use your lose.bmp. Uncheck the box next to Visible.

163 VIDEO GAME PROGRAMMING STEP 4: Build and Run Now Build and Run your game. Try hitting your enemy until he dies. Also, try letting your enemy hit you until you die. What happens? Why?

164 VIDEO GAME PROGRAMMING PART 19 – Adding an Ending Screen Behavior Objective: –Now that we have our Ending Screen, lets tell the game to get there! Step 1 – Add Level Behavior. Step 2 – Tweak Win/Lose Condition. Step 3 – Build and run.

165 VIDEO GAME PROGRAMMING STEP 1: Add Level Behavior Add the LevelEndingScreenFN and KeyboardFirstLevelFN functions to the ending level. Add the LevelWinningScoreFN function to the level1 level.

166 VIDEO GAME PROGRAMMING STEP 2: Tweak Win/Lose Condition In the Game Assets tree, under Global Data, double-click on EndScore. This is what determines how many hits you need to win the game. Change the Initial Value to whatever you feel it should be. Be reasonable, setting this to 0 might break your game, setting it to 100000 might make it too hard to win!

167 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. You should have a real, working game right now! Try getting the winning score. Did it display the winning screen? Try letting your enemy get the winning score. Did it display the losing screen? If not, raise your hand and ask for help.

168 VIDEO GAME PROGRAMMING PART 20 – Adding Walk Animation to Actors Objective: –Now that we have a working game, let’s add some more animations to our player and enemy actors. Step 1 – Create New Artwork. Step 2 – Add New Frames to WALK Animation Set. Step 3 – Build and run.

169 VIDEO GAME PROGRAMMING STEP 1: Create New Artwork Open MS Paint. Create 3 new frames of walk animation for your player sprite (64x100). Save them as player2.bmp, player3.bmp, and player4.bmp in your Actors folder.

170 VIDEO GAME PROGRAMMING STEP 1: Create New Artwork continued… Create 3 new frames of walk animation for your enemy sprite (64x100). Save them as enemy2.bmp, enemy3.bmp, and enemy4.bmp in your Actors folder.

171 VIDEO GAME PROGRAMMING STEP 2: Add New Frames to Walk Animation Set Open the WALK animation set for your PLAYER actor. Add the 3 new animation frames you created (in the order player2.bmp, player 3.bmp, player4.bmp)

172 VIDEO GAME PROGRAMMING STEP 2: Add New Frames to Walk Animation Set continued… Now click on the first frame. Change Frame Delay to 10. Click the Apply to All button to apply all attributes from the first frame to the new frames. Hit OK.

173 VIDEO GAME PROGRAMMING STEP 2: Add New Frames to Walk Animation Set Open the WALK animation set for your ENEMY actor. Add the 3 new animation frames you created (in the order enemy2.bmp, enemy3.bmp, enemy4.bmp)

174 VIDEO GAME PROGRAMMING STEP 2: Add New Frames to Walk Animation Set continued… Now click on the first frame. Change Frame Delay to 10. Click the Apply to All button. Hit OK.

175 VIDEO GAME PROGRAMMING STEP 3: Build and Run Now Build and Run your game. Do you see the new animations?

176 VIDEO GAME PROGRAMMING PART 21 – Adding Snowball Splat Animation Objective: –Now that we have our characters animated, let’s add some animation to our snowballs. Step 1 – Create New Artwork. Step 2 – Add New Animation Set. Step 3 – Change ShotDeleteOnSpriteCollisionFN Function. Step 4 – Build and run.

177 VIDEO GAME PROGRAMMING STEP 1: Create New Artwork Open MS Paint. Create 3 new frames of splat animation for your snowball actor (64x100). Save them as splat1.bmp, splat2.bmp, and splat3.bmp in your Actors folder.

178 VIDEO GAME PROGRAMMING STEP 2: Add New Animation Set Add a new Animation Set to the SNOWBALL Actor. Name it SPLAT.

179 VIDEO GAME PROGRAMMING STEP 2: Add New Animation Set continued… Open the SPLAT animation set. Add the 3 frames of animation you created (in order splat1.bmp, splat2.bmp, splat3.bmp). Click on the first frame and set Frame Delay to 5. Click Apply to All.

180 VIDEO GAME PROGRAMMING STEP 3: Change ShotDeleteOnSpriteCollisionFN Function Open the ShotDeleteOnSpriteCollisionFN function. Find the code that says: This->Animation(0); Change it to: This->Animation(SNOWBALL_SPLAT);

181 VIDEO GAME PROGRAMMING STEP 3: Build and Run Build and Run your game. Throw some snowballs. Do you see your splat animation?

182 VIDEO GAME PROGRAMMING CONCEPT – Level Design Now we’ve come to the point where we want to add some obstacles into the game to spice up the level design a bit. What makes a good/bad level design?

183 VIDEO GAME PROGRAMMING CONCEPT – Level Design continued… One way to make a bad level design is to have WAY too many obstacles. If you put in too many obstacles you may not be able to even hit your enemy, or they may not be able to hit you. On the other hand, too few obstacles may make it too easy to be hit or too easy to hit your enemy.

184 VIDEO GAME PROGRAMMING CONCEPT – Level Design continued… So what makes a good level design? Trial and error! Try something, if it doesn’t feel or work right, change it and try again.

185 VIDEO GAME PROGRAMMING CONCEPT – Level Design continued… Another thing to consider… If you have multiple levels (we might add more later if we have time) you want to make them progressively more difficult. You don’t want Level1 to be twice as hard as Level2, that just doesn’t make sense!

186 VIDEO GAME PROGRAMMING CONCEPT – Level Design continued… Just a suggestion… You might want to make Level1 have an equal number of obstacles on your side and on the enemies side. Then, for Level2, have fewer obstacles on your side. Finally, for Level3, you might not want to have any obstacles on your side. Remember, trial and error!

187 VIDEO GAME PROGRAMMING PART 22 – Adding Obstacles Objective: –We basically have a complete game here, so let’s make some interesting level designs. Step 1 – Create New Artwork for Obstacles. Step 2 – Add a New Actor and Animation Set(s). Step 3 – Add Obstacle Sprite. Step 4 – Build and run.

188 VIDEO GAME PROGRAMMING STEP 1: Create New Artwork for Obstacles Open MS Paint. Create some new artwork of any height and any width (height and width should be less than 100). Save obstacle art as obstacle1.bmp in your Actors folder. If you create more than one obstacle, save them as obstacle2.bmp, obstacle3.bmp, and so on…

189 VIDEO GAME PROGRAMMING STEP 2: Add a new Actor and Animation Set(s) Add a new Actor to Level1 named OBSTACLE. Add a new Animation Set named ONE. For this animation set, add the obstacle1.bmp art and give it some collision data. Add a new Animation Set for each obstacle. Name the new animation sets TWO, THREE, FOUR and so on. Make sure and give them all collision data!

190 VIDEO GAME PROGRAMMING STEP 3: Add Obstacle Sprite Add a new Sprite to Level1. In the General Tab, set the Name to obstacle. Set Map to bg. Set Display List to 3.

191 VIDEO GAME PROGRAMMING STEP 3: Add Obstacle Sprite continued… In the Animation tab, choose the OBSTACLE actor. Choose any one of the Animation Sets that you created for this actor (basically choosing which type of obstacle it is).

192 VIDEO GAME PROGRAMMING STEP 3: Add Obstacle Sprite continued… In the Collision Tab, set Precise collision. Make sure the Activate Sprite Collision and Check With Sprites boxes are checked.

193 VIDEO GAME PROGRAMMING STEP 3: Add Obstacle Sprite continued… In the Position Tab, place the sprite anywhere on the map and VOILA! You now have an obstacle in your game!

194 VIDEO GAME PROGRAMMING STEP 4: Build and Run Now Build and Run your game. Is your obstacle in Level1? Do you collide with it? Do your snowballs collide with it? Do your enemies snowballs collide with it?

195 VIDEO GAME PROGRAMMING SIDE NOTE – Adding More Obstacles To add more obstacles to your level, right-click on the obstacle sprite and select Insert Copy. Name the new obstacle obstacle2. Go into the Sprite Properties for obstacle2, in the Position Tab and change the position of the obstacle.

196 VIDEO GAME PROGRAMMING SIDE NOTE – Adding More Obstacles continued… You can add as many obstacles as you want but remember, you have to RENAME the new obstacles and CHANGE THEIR STARTING POSITION.

197 VIDEO GAME PROGRAMMING SIDE NOTE – Adding More Obstacles continued… You can reposition any sprites’ starting position by using the Level Preview feature. To do this, right-click on Level1 and select Preview. Click and drag the sprites around until you get something you like. Remember: Trial and Error. Keep playing the level until you’re satisfied.

198 VIDEO GAME PROGRAMMING CONGRADULATIONS! You’ve just completed Snowball Wars.

199 VIDEO GAME PROGRAMMING Tweaking the Game If you want to change the game around a bit, here are some suggestions…

200 VIDEO GAME PROGRAMMING Suggestions… 1: Change the following Global Data: PlayerThrowDelay PlayerThrowDelay2 EndScore HitDamage1 HitDamage2

201 VIDEO GAME PROGRAMMING Suggestions… 2: Add a second frame of animation to some obstacles. You can create some neat effects by adding multiple animation frames to your obstacles and give each frame different collision data. Make the Frame Delay something more than 60. Be careful as this may be kind of buggy…

202 VIDEO GAME PROGRAMMING Suggestions… 3: Add a secondary shot for the player. You can add a secondary power shot the player can use by right-clicking.

203 VIDEO GAME PROGRAMMING Adding Power Shot Create the 32x32 art in MS Paint. Save it as snowball2.bmp in your Actors folder. Add a new Animation Set to the SNOWBALL actor called SECONDARY. Remember to give it Collision Data.

204 VIDEO GAME PROGRAMMING Adding Power Shot continued… Add a new sprite to each level by making a copy of playerShot. Name it playerShot2. Change the Display List to 0. Change the sprite’s Animation Set to SECONDARY.

205 VIDEO GAME PROGRAMMING Adding Power Shot continued… Add the PlayerShootMouse2FN function to the Player sprite. Add the SpriteIncreaseScoreOnCollisionFN function to the playerShot2.


Download ppt "VIDEO GAME PROGRAMMING Video Game Programming Snowball Wars INSTRUCTOR TEACHER’S ASSISTANT."

Similar presentations


Ads by Google