Game Maker: Scrolling Shooter Tutorial - Part 1
Welcome to my first tutorial! Here I'll be showing you how to use Game Maker to make a Scrolling Shooter game like Galaga or Gradius. This tutorial is for people unfamiliar with Game Maker. Let's have fun learning how to make a game!
To follow this tutorial you'll need to download...
Game Maker Studio which you can download for free
here.
Alternatively you can also use an older version of Game Maker if you prefer.
You'll also need to download
these sprites.
Alright once Gamer Maker is fully installed boot it up and let's get going. Select the 'New' tab at the top, choose where you want to save your project, and give it a cool name like DivineSpace_Tut01.
To start off let me tell you about sprites. In simple terms sprites are pictures. To be more detailed sprites are the images we use to display objects in the game world. Most objects in games need a sprite. For an obvious example, if you were to make a scrolling shooter you would need a sprite to display the player.
Let's do that shall we? Click on the green Pac-man looking logo at the top-left of the program or right click the folder titled 'Sprites' and click 'Create Sprite'.
A new window will open in the center. This is what we'll use to load up a sprite for the player. Click in the name box and rename our new sprite
spr_player.
The 'spr' in the beginning of the name stands for sprite of course. As you'll be working with sprites and objects it's usually a good policy to add a prefix like 'spr' to your sprites. Now just under the name is the button 'Load Sprite'. When you click on that a new window will open and allow us to browse through the computer to find our sprite. Make you way to the 'Divine Space' folder you downloaded at the beginning of this tutorial. Open that folder and select the png file 'redShip'. Now quickly click the 'Center' box, I'll explain what exactly this does later. Hit the 'OK' button to successfully finish making your sprite.
Now we need to create an object for the player. While a sprite displays what the player's ship looks like, an object tells the player's ship what it can or can not do. To create an object you can either click on the green circle at the top of the screen or right click on the 'Objects folder' and click 'Create Object'.
Let's rename our object
obj_player. Now just under the name box we can assign a sprite to our object. Seeing as there is only one sprite available I think we should select that one. Click OK at the bottom and bam! We have created our first object.
Now that we've learned to create sprites and objects I think it is time we created a room. Rooms are where we pack all of our objects. Basically you can think of them as levels or stages. To create a room click on the white square icon right next to the object icon at the top of the screen. In this new window I want you to click on the 'objects' tab. You'll see our player object highlighted on the left and the newly created room to the right.
I'm not really digging the gray look we have going currently. Above the highlighted player object you should see some tabs. Click on the 'backgrounds' tab and click on the color. Since the game we're making is taking place in space I think it's a pretty good idea to use black for our background color. Once you've selected the color hit OK. Now let's return to the 'objects' tab. Since we only have one object, our ship, the window is showing us that object. Let's add it to the room. Move your cursor over to our black room and click somewhere in middle.
Now our player is in the room! If you accidentally created more than one player ship just right click on it and choose 'delete'.
Let's test run our game now shall we? Click on the green arrow at the top of the screen(not the one next to a page). The program will take a second to load our game. But now you should see our lone ship alone in the vastness of space! Don't bother pressing the keys and trying to make the ship move yet. We haven't told our ship that it can move! Close that window and return to the Game Maker project. Click the green check mark at the top left to close the room and temporarily save the progress you've made.
Alright let's add some interactivity into our game. Reopen
obj_player by double clicking it. Now this time I'd like to point out the two sections to the right: Events and Actions.
An event is a chain of actions that can be triggered.
An action is a command that is performed when a certain event is transpiring.
Click 'Add Event' on the bottom and choose 'Keyboard'. A lot of keys to choose from will pop up. For now we'll start with < Left >.
We have successfully created an event. Now let's tell the game to perform an action when the left arrow key is pressed. To the right of the Actions section you'll see a bunch of icons and tabs. The move tab should be selected by default. Look at the icon listed under -Jump- and choose the first one.
The 'Jump To Position' Action.
Drag it into the actions section and a new box will appear. There will be three options at the top: Self, Other, and Object. Leave 'Self' selected as that would be our player ship which is what we're trying to get moving. Next you'll see two boxes that are set to 0. One for the horizontal axis x and one for the vertical axis y.
If you've ever worked with grids before this should be very simple. If not please carefully examine the Mario picture.
With Game Maker, when ever you're moving something to the left or right you're working along the x-axis. Thus in order to move something to the right you add 1 to that object's x position. Conversely to move something to the left you subtract 1 from the object's x position.
Now armed with this knowledge let's put it into motion. In the x field I want you to enter '-1'. Make sure the 'Relative' box is checked and then hit the 'Okay' button. We should check to see if everything works. Press the 'green arrow' at the top of the screen and load up the game. If you did everything correctly the player should now be able to move to the left when you press the left arrow key. Though it might be a bit slow. Feel free to change the number from a 1 to something slightly higher.
Did something go wrong? If not go ahead and skip this paragraph. If your ship teleported to the top-left part of the screen that would be because you forgot to 'check' the relative box in the 'Jump to Position' action. Simply return to the action we just made and check the box. Did the ship move to the right instead of the left? Well that would be because you entered a positive 1 into the x field instead of -1. Simply go back and put a minus sign in front of your number.
Now that we can move to the left I'd like you to add an event for the rest of the arrow keys. Make sure each arrow key has its own 'Jump to Position' action. Also when you're doing the 'up' and 'down' arrows its important to note that positive numbers go down while negative numbers go up along the y-axis. Once you're finished with all four arrow keys test your game again and make sure everything works.
Let's create a new sprite by clicking on that green pacman at the top of the screen like we did before. Let's give this sprite its own unique name so we don't mix it up with our other sprite. Let's name this sprite
spr_enemy.
Next click the Load Sprite and let's choose a sprite to use for our enemy. For this enemy I'd like to use the Kamekazi sprite. Once you've selected that click on the center box to set the origin for this sprite. Basically when ever we do anything with a object using this sprite we'll consider the center of the sprite our starting point. It'll make positioning a lot easier. Click the 'OK' button to finish this sprite.
Now create a new object with the name
obj_enemy and assign it to the correct sprite. We'll have this enemy start at the top of the screen and fly recklessly downwards. It'll be up to the player to skillfully dodge out of the way(we'll worry about implementing shooting later).
Add an event to our enemy. This time instead of selecting 'Keyboard' I want you to select 'Step' and out of the next three options choose 'Step' again. Basically this event is triggered every single 'Step' of the game. Think of a 'Step' as something that happens thirty times as one second passes. So what ever action we assign to this 'Step' event will be repeated over and over again.
We're going to use the same action as we did for the player. Drag the 'Jump To Position' action into the actions section. Now we want this enemy ship to fly from the top of the screen all the way down to the bottom.
Do you remember what number to add to which field in order to move a object downwards? Well hopefully you do because I'm not gonna spell it out for you. I want you to think while you do this tutorial and not just copy everything I say. You won't learn much that way. Anyways even if you don't remember just plug some numbers in there anyway and you'll soon see if it'll work or not.
So we can see this bad boy in action we need to re-open the room we made earlier. This time add the enemy ship somewhere near the top of the screen. If you're not too happy with how its positioned on the grid right click on the enemy and choose 'Change Position...' Once you've done that hit the green arrow on the top left and lets see what we've got.
Huzzah! If all went well than we now have a enemy ship that oh so brazenly flies downwards without a care in its mind for how it effects others. Unfortunately it doesn't actually effect others. Even if the player flies into the enemy ship the game currently isn't checking for collision. This is something we need to fix.
So what do we want to happen when the player's ship crashes into the enemy? Since we're not making a car insurance simulation I think we should leave out the drivers exchanging information. Instead I think we need a nice, shiny explosion! Channel the spirit of Michael Bay and create a new sprite. We'll name this one
spr_explosion and of course load the explosion sprite from the Divine Space folder. Make sure to center the sprite then hit 'okay'.
Now we need a container for our sprite. To keep things simple let's create an
obj_explosion and assign it to the correct sprite. Right now the sprite is going to animate too fast so we should slow it down. Add a create event (the light bulb icon) and click on the 'control' tab on the actions side. Drag over the 'Execute Code' icon that looks like a simple piece of paper. Double click on that and a code window will open. No worries we're not going to be doing anything crazy.
Write down:
image_speed = 0.65; As you can probably guess this slows down the image speed. It'll run at 65% of the speed it would have normally run at. If image_speed was set to 1 it would run at full speed. And trust me that's just a little too fast for the explosion animation we're using.
Now instead of putting this explosion into the room like we did with other objects, we're going to create it dynamically. To do this I want you to open up
obj_player. Add a new event under the 'Collision' category. Of course since we're going to make the player's ship crash into the enemy you should choose the collision event that says
obj_enemy.
Now for the actions. This time I want you to click on the tab titled 'main1'. Drag over the 'Destroy Instance' icon which looks like a recycling bin. A window will pop up and ask you what the action applies to. Let's choose 'Self'. But the player isn't going down all by himself. He's taking the enemy down with him! Drag another 'Destroy Instance' action over and assign this one to 'Other'. Great now they will both be destroyed when they collide. To finish this all up I want you to drag over the 'Create Instance' action that looks like a light bulb. In the object field choose
obj_explosion and make sure to check the relative box. Hit 'okay' for everything and then click the green arrow at top.
If everything went smoothly then both ships should now blow up, but it seems the explosion goes on indefinitely. We need to sort that out. Open up
obj_explosion and click on the 'main2' tab. Inside our create event drag a 'Set Alarm' action (which looks like a clock) next to our 'Execute Code' action. Enter the number 13 into the 'number of steps' field and hit okay. Basically this means that after 13 steps an alarm event will go off. So let's make that alarm event now shall we?
Click add event and choose Alarm, Alarm 0. For our action go to the 'main1' tab and drag over the 'Destroy Instance' action. Now our explosion will only stay on screen for about 13 frames and then dissipate. Hit the green arrow to try it out for yourself.
If the timing seems off feel free to tweak the animation's image_speed or how many steps it takes to destroy the
obj_explosion. Heck you could also give both the enemy and the player their own explosions rather than just using the one. Though make sure to use the x and y fields to move the explosions where you want them so they're not just right on top of each other.
Now let's wrap up this section of the shooter tutorial by making what we have thus far into a small game. First off we need add more enemy ships, but we want them to be created dynamically. Open up the room and right click on the enemy ship to delete it. We are going to create an infinite amount of ships and well they aren't all gonna fit in the room at the same time.
Create a new object named
obj_enemySpawner. As the title implies we'll be using this to create our infinite enemy ships. This time don't assign a sprite to our object. This object is something that will just be executing actions in the background that the player shouldn't be able to see or interact with. Make a Create Event and give it a 'Set Alarm' action. Set Alarm 0 to 50 steps.
Now add the Alarm 0 Event. First add the 'Create Instance' action and set the object to obj_enemy.
In the x field enter:
random(room_width-64)+32 What this does is generate a random number. The random number will be somewhere between 0 and 576. This is because we take the room_width which is 640 and subtract 64 from it. Once we have our random number the game adds 32 to it. Basically this means the number our enemy ship can spawn on is between 32 and 608. Remember the room's left border starts at 0 and the right border ends at 640. By having a number between 32 and 608 our enemy ship can't spawn half way inside of a border. That would probably look pretty weird.
The next action you need to add is another 'Set Alarm' 0 to 50. If we don't reset the alarm then it will only go off once, but now because this action goes off inside of the Alarm 0 Event it will always reset itself every time it goes off.
Now that we have an object that can spawn an infinite amount of ships its pretty important we make sure we don't overwork your game. Keeping track of millions of ships can be incredibly overbearing for Game Maker. There's no reason to keep track of enemy ships that have left the game's screen so lets get rid of them. Open up obj_enemy and lets add two more actions to the Step Event.
Go to the 'control' tab and locate the 'Test Variable' action which resembles a gray octagon with the word 'VAR' written on it. Drag 'Test Variable' into our actions and its window will open up.
For the variable enter:
yFor the value enter:
room_height+14For the operation enter:
greater than Now what this action does is check if our enemy is a bit lower than the room's height. However it doesn't actually do anything to our enemy ship. It's only comparing its y position with the room's height. Now if we add a new action just under our 'Test Variable' action it will only be activated if the enemy ship has left the screen. Add a 'Destroy Instance' under the 'Test Variable' action and we now get rid of all those pesky ships we don't need to keep track of anymore.
We can't actually tell if our code is running correctly or not because it's impossible to see the enemy ship when it leaves. In order for all our changes to take place make sure to add a single
obj_enemySpawner into the game's room. Without it none of the enemies will ever spawn! Hit the green arrow and try out your avoider game!
If you would like to see if the enemy ships are actually being destroyed or not try changing the value for
obj_enemy's 'Test Variable' to a number like 200. That should show you that everything is working correctly. Once you've done that feel free to fix it back to room_height+14.
If you find avoiding the enemies is too easy why don't you try tweaking some numbers around? Increase or decrease the player ship's speed. Increase the speed of the enemy ships! Though be careful to not make it so high they travel faster than the eye can see. You can also make the number of steps in the
obj_enemySpawner's Alarm 0 is set to even smaller so that enemies spawn faster. Experiment and have fun!
You can get the full source files for this part of the tutorial
here.
That wraps it up for this part of the tutorial. Come back later to learn how to add shooting to the game and a scoring system! Feel free to post any questions or suggestions you have in the comments below!
As always I'll be updating this thread with the successive parts of this tutorial. Alternatively you can visit my game development website
Berathen Games.