Tải bản đầy đủ (.pdf) (30 trang)

Introduction to GameMaker and Programming

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (1.06 MB, 30 trang )

Introduction to GameMaker and Programming: Building
Your First Game!
Before we begin, I want you to understand my philosophy on how to learn. I believe that your very first
time doing something, you should be walked all of the way through it, and then you should be let go
completely and you should learn everything else on your own through researching, tinkering with stuff,
asking questions, and developing. It’s the way I’ve learned and I wouldn’t have it any other way. I will
walk you through what to do with this project, and I will explain my steps in great detail, but will not
explain some things that are not needed for this project. I will however, explain everything you are
doing to build this project in detail. This guide is as long as it is primarily because of the pictures, so
don’t be alarmed by its length. GLHF!
Install Gamemaker Studio: />Open GameMaker Studio
Select New Project
Name it whatever you want and hit next
Screen should look like this after closing the news updates window. (You may have a bar running across
the bottom. Don’t worry about it. You can close it if you’d like.)

The left window is where everything in your game is stored. I repeat, this is where literally EVERYTHING
is stored. Scripts, pictures, music, everything.
What is that stuff on the side bar???:
Sprites – This is a fancy name for pictures. Pictures of stuff you want in your game.


Sounds – This is where you just put all of your sound files. This helps you stay organized.
Backgrounds – This is where you put your background photos. Again, helps you stay organized.
Paths – A much more advanced idea. You can create a path you want some object to follow in
the game. I recommend not worrying about this until you feel you need to. So for now, ignore it.
I’ve never even used it myself.
Scripts – This is an optional folder that you will not use for a while. In game maker you can use
what is called drag and drop (D&D) or you can write code. Writing code is much more powerful,
however, you will find that Drag and Drop is exactly the same as programming, but is a little
easier to get the hang of and still extremely powerful. So, this is just where you would store


code you write.
Fonts – For when you have text in your game, such as a “GAME OVER” appear at the end of your
game, you can store fonts in these files and reference them later when you need it.
Time Lines – I’ve never used these, so I’m not going to define it so I don’t give you wrong
information.
Objects – This is where the magic happens. Most of your game development will be done here.
This is where you create game “objects”. You create an object, and have to tell it everything to
do. For example, this is where you would program the logic of an object moving, having health,
responding to user input, giving it a sprite, making a sound when it hits the edge of the screen
and then changing direction. Things like this!
Rooms – This is where your level design happens. These rooms are what the person who is
playing your game will see.
I’ve never used Included Files, Extensions, or Macros before so I am not aware of what they are. The big
ones to understand are sprites, objects, and rooms. I only wrote these definitions for you to reference.
You’re not going to truly understand what these things are until you take that first step in making
games. Once you make a game or two, you will have a solid understanding of what all of these things
are! The first few games you make, this can be extremely confusing, and that’s something you should
understand about anything in the STEM field. WE’VE ALL BEEN THERE. Things will get frustrating and
difficult to understand, however, there is no feeling more rewarding than completing a project you’ve
started. Not only that, but the more you do it, the more you understand it.

Now that that’s cleared up, let’s get started!
Game concept:
The game will start with an object completely stopped (a red square). When the user clicks the object,
they get 1 point, the object randomly spawns to a new location and gets a little bit faster. Each time, the
user has 5 seconds to click on the object. If they don’t click on the object, the game is over.


LET’S BUILD THE GAME:
1. Create your main object sprite.

a. Right click on the Sprites folder in the menu to the left and click “Create
Sprite”
b. A window should pop up. Where you see the “Name:” box, put
“spr_red_square”.

c. When you make a sprite it’s best to name it “spr_descriptive_name”. This is
totally up to you, but it will make your project much cleaner and much more
organized.
d. Now, click the button that says “Edit Sprite”. A new window should have
popped up that looks like this:


e. Click on the icon next to the green checkmark all the way to the left. If you
hover over this icon, it should say: “Create a new sprite”. A window should
pop up like this:

f. Leave width and height each at 32 and hit OK. This is in pixels in case you are
curious.
g. When you click okay, it should take you back to your sprite editor, which
should now look like this:

h. Double click on image 0. The image editor should come up that looks
something like this:


i.

j.

Don’t worry about what everything here does. Remember that everything is

here as an additional tool. You could technically just use the pencil tool,
select a color and do everything. These tools are here to help you, not
confuse you!
We’re just making a red square so we’re going to use the “fill” tool. This is
the one with the buck pouring over. In the tools section, this is the one that is
in the second column, fourth row. Click on this, select some shade of red to
the right and then just click on the checkerboard thing (it’s actually our sprite
so far, just nothing has been done) to fill the entire image up with red paint.


k. Click the green checkmark on the image editor, then click the checkmark on
the sprite editor and you should return to the window with the title “Sprite
Properties: spr_red_square” where you should click on the “OK” button and
you’ve officially made your first sprite!


2. Now, do the same exact thing except call this one “spr_blue_wall” and make it a
blue square. You now have the only two sprites we’ll need for this game! Your project
should now look like this:


3. Making our Wall object
a. This object will simply be a wall. When the red square hits it, it will cause the red
square to change direction as you would expect in real life.
b. Right click on the word Objects and select Create Object. A screen should pop up
like this:

c. DON’T QUIT! We’re going to simplify what everyhting here is. You only need to
understand what is necessary for this project (that’s true even in professional
development by the way. Only learn what you need to to accomplish your goals).


d. Where it says name, name your object “obj_blue_wall”.
e. So now we have an object named obj_blue_wall, but what does it actually
look like? This is where sprites come in. We need to tell the obj_blue_wall to
look like the sprite: spr_blue_wall.
f. So, right under Name, there’s a box with the words “<no sprite>” in it. Click
on the box, and a little menu will appear. Select “spr_blue_wall”.
g. You’ve now told the object to take the form of spr_blue_wall.
h. The last thing we need to do is check the box that says “Solid”. We only do
this for objects that do not move as a rule of thumb. This rule of thumb has
never failed me. I don’t recommend doing this with objects that are moving.
i. Click OK. I’m writing this as I’m making the game, and I’m 99% sure we’re
now completely done with obj_blue_wall”. If we come back to it later, I
apologize for telling you otherwise.
j. You’re not really going to understand these things until you actually make a
few games, but here are some things that will help you understand objects:
/>008_defining%20objects.html


4. Creating our first (and only) level
a. Screen should currently look like this:

b. Right click on “Rooms” from the left menu and click “Create Room”. Should
look like this:


c. The first thing we should do is ignore everything we don’t understand (I
expect that to be almost everything).
d. This is literally what your game is going to look like, and this is where the
designing happens.

e. Let’s rename the room to “game” by simply typing “game” in the name field.
We’ll leave the Width, Height, and speed alone for now.
f. Now, where you see the 6 tabs near the top left, (backgrounds, views,
physics, objects, settings, and tiles) click on objects. Should look like this:

g. Now that you’re in the objects tab, go near the bottom of tab and click on
where it says “<undefined>” and select “obj_blue_wall”.
h. We now have our object selected and ready to put into our level. You can
click anywhere in your room to add the objects. But them around the border
of your room. If you hold Ctrl + Shift while holding down the left button on
your mouse, you can actually drag your mouse to create multiple objects at
once.


i.

1. [IMPORTANT NOTE] Your room is only the consistent gray squares,
not the light and dark checkered squares outside of it. There’s no
need to design outside of the room in this game. That is for games
where objects come into the screen from off screen such as a turtle
in the Super Mario Bros series.
Your room should look like this:

j. Click the green checkmark in the corner to save and close your room.
k. Now your project development screen should look like this:


5. Run the game for the first time!
a. There’s a few ways to do this. I’ll teach you the three I know although I
wouldn’t be surprised if there’s more.

b. Way 1: Simply press the F5 key
c. Way 2: On the menu bar all the way on the top, click on “Run” and then
choose “Run normally”
d. Way 3: There’s a green and orange triangle that looks like a play button on
your tool bar. Click the green one and it will run.
e. Your game needs to go through some complicated build process that
thankfully, we will never have to worry about. After a few seconds (about
10), your game should look something like this:

f. Right now, you have technically made your first game! But there is work to
be done.
g. [IMPORTANT NOTE] It’s a good idea that while you’re making this game, you
make very small changes and run the game a lot. If you make 10 changes and
it breaks your game, you’re not going to know which change actually broke
your game. So, make small changes, run your game, repeat.


6. Making the red square object
a. Create a new object and name it “obj_red_square” and assign it the sprite
“spr_red_square”.
b. Now, let’s head on over to the events area. Events are what they sound like.
To see the list of events, click “Add Event”. I’ll go over a few of these, but not
all. These are totally optional to read.
1. Create – This event means, when the object is actually created in
the game. Usually for small games this is as soon as the game starts.
However, you can do things that will allow you to add an object to
the room (called initializing) at any time within the game. This is
done by doing an action called “Create Instance”. This is not
something we’ll need to do for this project. I recommend you tinker
around with these things afterwards however.

2. Mouse – If you click on this one, a list of things that can happen
with the mouse will come up. These are the events that the object
will “listen” for as most developers would put it.
3. Destroy – When an object is destroyed, sometimes you want to do
things like increment the player’s score or you want to tell the
player they lost the game. Stuff like this.
4. Step – This is one of the most important ones and it took me a very
long time to wrap my head around it, and looking back, I really
don’t know what I found so confusing. Recall that when we were
creating our room, there was something called “Speed” that is by
default set to 30. This means that the step event will be called 30
times per second for every object in the room. A lot of your
development for future projects will be done here.
5. Collision – When the object collides with some other object that
you define. If you click on this, you’ll see a list of all of your game
objects. In our case there are only two, but we will use this.
6. We’ll also use the alarm event later, but that will be easier to
understand once we get there.
c. For now, our goal is to get this square to just move around inside of the
room. So the first thing we should do is tell the square that it should begin
moving at some speed in a random direction as soon as it’s created. So here’s
how we do that
1. Under Events: click on “Add Event” and select “Create”.
2. Now, where we move on over into the meat of the game. The
actions menu. First I’ll show you how to do this with drag and drop,
and then I’ll show you how to do all of this with code.


3. There are 7 tabs on the right that are sideways (move, main1,
main2, control, score, extra, and draw). Make sure you are on the

Move tab. Should look like this:

4. Now that you are in the Move tab, let’s choose how we want our
object to move. In our case, we want our object to move in a
random direction at some speed.
5. In the “move” tab, there’s a subcategory called “Move” inside of
the move tab that has 3 rows and 3 columns of images that
represent actions. I’ll walk you through all of them as if you were
reading. (Left to Right and Top to Bottom)
a. Move Fixed – Allows you to define a speed and choose a
direction (Left, Right, Up, Down, Up-Left, Up-Right etc…) to
move your object in.
b. Move Free – A more advanced version of Move Fixed. This
allows you to define a speed and choose a direction in degrees
to move your object.
c. Move Towards – Move towards a specific x and y coordinate.
We won’t be using this for this project, but this is useful to
know if you want to make a game where enemies will move
straight towards your player, shoot bullets that move towards
the player, or the player shoots a homing missile at an enemy.
With programming, you can do whatever you want. You’re in
control.
d. Speed Horizontal – The horizontal speed of your object.
e. Speed Vertical – The vertical speed of your object.


f. Set Gravity – Gravity on Earth pulls you towards the center of
the Earth. In games, you can pull your player wherever you
want. If you set gravity the opposite direction on Earth, we’d
all fly off into space, enjoy the few remaining moments of our

lives flying, and die. In games, you can set the gravity to
whatever direction you want.
g. Reverse Horizontal – Used for changing the direction of your
object. We will use this when the player collides with a wall.
h. Reverse Vertical – Used also for changing direction of your
object. We will also use this for when the player collides with a
wall.
i. Set Friction – The best way to learn this one is to just use it
one time. You just set friction to some value, and it will slow
your object down. The higher the friction, the faster it slows
your object down.
6. So, we’re going to use the Move Free action since we want a
random direction. So, click on the move free icon (the grey one with
8 arrows pointing outwards) and drag it over into the actions menu.
A pop up should come up that looks like this:

7. We should decide on a starting value for speed. I’m going to go with
5, although you can really do whatever you want.
8. For direction, we will use our first function called
random_range(n1,n2) which takes two parameters - parameters are


values that are required for a function to work - n1 and n2 and will
generate a random number between n1 and n2. Because direction
is measured in degrees, we want the direction to be a random value
between 0 and 360. In practice, we must set direction equal to:
random_range(0,360). All this function does is give us a random
value between 0 and 360. For further clarification, if we wanted a
random number between 10 and 20, we would do
random_range(10,20). Don’t worry about anything else we haven’t

talked about that is on this screen. These things will make more
sense after you get a feel for how game development works. Your
screen should look like this:

9. Now Click OK. Your Object Properties window should look like this:


10. If all looks good, click OK to save and close the Object Properties
window.
d. Now that the square has the logic programmed into it, all we have to do is
add the red square object to the room. Do you remember how? Your screen
should look like this when you’re done:

e. Where exactly your red square is doesn’t matter. You can start it wherever
you please.


f. Now, run the game and observe what happens. Your shape should begin
moving in a random direction, but your object goes right through the wall!
Let’s fix this.
g. Go back to the obj_red_square and add the step event. For a description of
what the step event is, see above where I described it in detail. Now, still in
the move tab, under the “Jump” section there is an action called “bounce”
that is the second column and third row. It looks like an arrow bouncing off
of a wall. Drag that into the actions menu. You should have a screen that
looks like:

h. You can leave everything at their defaults. It’s worth noting that we want to
only bounce off of other solid objects. So if there were other red squares in
the game they wouldn’t bounce off of each other because they aren’t solid

because they are moving. Click OK and OK again to save and close the object
properties window. If you run your game, your square should bounce off of
the walls.


7. Responding to user input
a. In order to understand what I’m about to show you as best as possible you
need to know about some built in variables every object automatically has in
GameMaker Studio. The ones we will be using are: x, y, speed, and direction.
Variables are simply values that every object has. Every object has an x value,
y value, speed, and direction. We can change these values as much as we
please. In fact, we already have! Remember when you gave the object a
speed and a random direction between 0 and 360? You were setting the
object’s variable.
b. Open back up the red square object and add the event Mouse and select Left
Button from the list. Your screen should look like this:

c. Still in the move tab, under jump select “Jump to Random” which is found
under the jump tab in the first row 3rd column. It’s the box with an arrow
pointing to the question mark. Leave everything at the defaults and hit OK.
d. Now, run your game and click on the red square. It should jump to a random
location when you click on it. Well now the game is a little harder, but it stays
moving in the same direction and the speed is always the same. Let’s fix that.
e. Go back to the object properties and go to the actions menu under Left
Button. This should be your screen at the moment:


f. The first thing we need to do is set the direction to a new random value and
then we need to increment the speed by 1. The easiest way to do this is to go
to the “control” actions tab. This screen:


g. All the way at the bottom, there is a section called variables. Remember how
I said we have built in values? This is where we’re going to set them. You can
see what each box actually is by hovering over them. The first one says “set
variable”, the second says, “test variable”, and the third says “draw variable”.
Well we’re trying to set direction to a random value so we should drag the
first one over into the actions menu. A screen like this should appear:


h. Where it says variable, that is what we’re going to change. Case matters
here! You must write exactly direction. DIRECTION or Direction will not work.
Now, we want a random value for direction, so we’ll once again use
GameMaker’s built in function random_range(n1,n2). So we should set the
value at random_range(0,360). It should look like this:


i.

Run your game a couple of times and make sure it works well. If it does, then
continue. Now we need to set the speed to increase by some value. For now,
we’ll only set the speed to increase by 1.
j. To do this, again, drag the “Set Variable” action and type “speed” where it says
variable. Again, SPEED and Speed will not work. Set the value to “speed + 1”.
The computer reads this as “set the speed to speed + 1”. Run your game. The
red square should get faster and faster every time you click on it. There’s a
cleaner way to do this however.
k. Go back into the Left Button event inside of the red square object and double
click on the action: Set variable speed to speed + 1. Now, delete speed+1 and
replace it with just 1 and check the relative box at the bottom. It should look
like this:


l.

Click OK and OK again and run your game. You should notice that your game
runs the same way it did just a minute ago. The key here is that relative
checkbox. When you check that it automatically adds whatever value you put
to the variable. The first way and the second way are literally identical, it’s
just another way to do it. In programming, there’s always more than 1 way to
do something, and that’s part of the fun.


8. Creating a score system:
a. Go to the Left Button Even inside of obj_red_square once again. The reason
this is where we are doing the programming of the score is because every
time the left button clicks on the square, we want the score to go up by one.
b. There’s a tab dedicated to score you’ll notice. It’s the 5th one down. Right
next to the control tab we just worked in. Click on that tab to see the score
actions.
c. There are three sections, score, lives, and health. Currently we only are
setting up a score system, so we should drag the set score action into the
action menu. Again, we want the score to increase by 1 every time, so we
want to set the new score to 1 and check the box that says Relative. It should
look like this:

d. Now let’s set up the score to always be drawn on the screen. To do this, we
have to create a draw event. Click on “Add Event” and click Draw then click
Draw again. Your screen should look like this:


e. So now, we have to tell the computer to draw the score. Let’s do that. In

order to draw the score, you must go to the “score” tab. Once you’re there,
you need to drag the action “draw score” into the draw event. You should
get a pop up window that looks like this:

f. It’s up to you what x and y coordinate you have set up. If you want to draw it
exactly in the middle of the screen you will have to set x to room_width/2
and y to room_height/2. These are both built-in variables and you can use
them however you wish. I have mine set up this way:


g. Now, if you run your game, the score is there, but there’s a problem! Where
did the red square go?! So here’s what happened: We took control over what
to draw to the screen. As soon as we create a draw event, GameMaker no
longer assumes you want that object drawn to the screen, so we just have to
tell GameMaker to draw the red square again. The way we do this is in the
draw event, we go to the “draw” tab and select “Draw Self”. This action is
represented by the icon of a person with their arms straight out. It’s in the
drawing section. First row and first column so all the way on the top left of
that section. Drag that in, run your game, and everything should be good!
h. That’s it! The score system is set up.


×