GameMaker: Studio - Your first game 1: Moving around

alright guys welcome back so there's something I've been wanting to do in my tutorials for a while now and basically I think about my tutorials sometimes I worry that I tackle I tend to tackle very specific subjects you know like I do like inventory tutorial I've done I mean other than my platforming stuff which is kind of a series everything is a bit like you know topic after topic and um but people who are just getting started and trying to build a game and they don't necessarily have their only full idea of what they want to make it or whatever and they just want to start small and make something and like finish it um I want to create a series for beginners just getting into it to take them from absolutely nothing and knowing nothing about game maker to building just a complete something it's going to be very very simple the project I'm going to use for this is I'm going to make a copy I suppose of the classic game asteroids asteroids the classic space shooting game thing where you fly around and you shoot asteroids and you break them apart um I think it's a really great beginning starting point because there's not a lot of like super complicated code that goes into making all the mechanics of asteroids like every time there's a collision for example in again of asteroids like something dies right there's like an immediate kind of simple effect and we don't have to do any pathfinding or any like like wall collisions or gravity or anything like that am i your company like platformer or anything a bit more complicated so we're just going to build asteroids and this tutorial series is basically going to assume next to no knowledge from you guys watching it and it's gonna be aimed at complete beginners so like anyone just standing out can hopefully use this little series to go from knowing nothing to building better stand of you know proper complete game and yeah I hope you guys enjoy it the reason I just want to get that out of the way is because I know some of you will be looking for more advanced content at this point on I'll still be doing that of course but this stuff that I'm doing right here and is aimed at sort of creating something really really solid as a proper starting point for beginners that they can follow along with and give them a actual progression for learning about the software as opposed to just diving in and trying to find out about the specific things that they want you know one after the next which is kind of how I learned game maker but is not how you know um it's not the best method for everybody so all we're going to build in this first this first episode is this what I have on screen here so I have this little arrow spaceship and you can fly around and he moves just like the spaceship from asteroids does so I supposed to like in the side if you've seen some of my early basic movement tutorials on this guy like you press forward and you will fly in that direction he will add like motion in that direction but you can turn independently of the sort of direction that you're moving and then you press forward to move in the direction you're facing and it's kind of like a little bit of Newtonian in that way where you move around like just like it like a spaceship with thrusters right so you push yourself in one direction you point another direction you move there so it feels just feels a lot like on the original asteroids game and that's all we're going to make we're just going to make you able to fly around like this in space so here I am with a completely blank project you should have an option when you start game maker just to create a new project name it whatever you like we have completely blank project and as you can see from our file hierarchy over here there's absolutely nothing in it no sprites no sounds rooms objects or backgrounds or anything like that so the very first thing that we're going to do to create on asteroids game is we're going to create a room so over here in the big list of sort of stuff that's in your game come down to where it says rooms right click on room and click create room ok so this creates rooms are basically the levels or screens of your game so like levels might be rooms or menus might be rooms and so on and so forth this first room is just going to act as our game ok our game screens gonna be here this is the space that we're going to be flying around in it's just big and grey at the moment because that's the default you can press the middle mouse button and drag it around to sort of like move around it or you can like click a in this screen over here to move around the room and when you make a room for the first time you have the Settings tab come up here I'm asking you to give the room a name and decides like its width its height and its speed and I'll get to one that means a second but first I'm just going to name this room RM underscore gain now when you make a new resource and by that I mean making anything over here in this box it's good to give it a good name that makes sense for whatever that type of thing is the convention I generally use for doing this as I give it a two to three letter acronym um because this is the room I've used RM it's like well it's not an acronym just like a shorthand for for room RM for room right and then I put an underscore and then I just give it a name that makes sense to me so this is the game room so I'm just going to call it RM underscore game this is where our games going to go width I'm just going to leave out their defaults of 102 four by 768 um that's just going to be the resolution of our game it's going to be a one or two four by 768 pixel window and speed determines the frame rate of which your game is going to run um 30 is the default I'm just going to okay 260 just so we have that nice smooth fluid 60fps experience okay the only other thing I'm going to do in this room is I'm going to go to backgrounds this tab over here and just change the draw color so at the moment like you can use this to this menu here to setup backgrounds for a room instead of like artwork in the background and stuff like that and scrolling clouds or space or anything like that but we'll get to doing that in probably a later episode right now we're just going to make it black so it's kind of like a bit Spacey you know so I'm going to pick over here where it says color we got a big color chooser or whatever you can find custom clothes I'm just going to pick black just so we have big blank room okay that's it that's that's our remote click this tick here and see when you click that it finishes naming it and doing everything else to it we've got our M underscore game over here we can double click that to reopen it anytime we want but the next thing we're going to do is we're going to create a spaceship the spaceship I showed you at the beginning of this video we're going to create that little triangle thing first of all I'm going to create the sprite for it and a sprite just means the image of your of any of your objects so like your player will have a sprite I guess like if you're making a platformer like your player character will have sprites the enemies will have sprites and things like that so they're just the images and they can contain um frames of animation as well as just being a single image we're just going to make a single image for our run a spaceship is going to be a little triangle right click here I'm going to hit create sprite and sprites menu I'm going to name it s BR underscore player again just using that same naming convention SP are for sprite right sprites SP are and then underscore and then just a sensible name is going to be our player object so I'm just going to call it a SPO and scope lat right makes sense there's nothing in this sprite at the moment so I'm going to click here where it says edit sprite and this brings up the sprite editor this is where you would see all of the different frames of animation of your sprite but we're only going to have a single frame uh and to do that we're just going to click this button this little white sheet in the corner there's also you can also click file and click new I'm just going to click this one where it says create a new sprite and give it'll give you like ask you for the width and height 32 by 32 is fine and you'll see we get a frame of animation appear um like you can have multiples of these and if you click show preview it would show you any animation based on like all these frames animating together but we only want the one so I'm just going to double click on that so that image 0 here I'm just going to double click on that and it's going to open up the image editor and this basically just behaves a bit like mspaint with a few more complicated fancy tools and things um you obviously don't need this to create whatever images you want to use in game maker you could go to file open and you could like load in an image of something else um if you wanted to like if you have sprites or whatever that you want to use you can just load them in um game maker supports like alpha transparency and stuff so you can load in P images of sprites and things like that and there are tools for importing sprite sheets and other things like that into game maker straight away but I'm just going to go ahead and quickly use the basic tools this will draw a quick little sprite I'm just going to draw a little a little triangle spaceship I guess like this and uh fill it in with blank there we go so that can be our spaceship just a little white outline I guess is well just going to look like just like the original asteroids game I guess so that's our that's our character and like I said if I just ctrl C copy that ctrl C paste it and make a second frame and if I like you don't have to follow this bit I'm just demonstrating like if I did this you can see I've now created ikat uu frame animation you can see it flashing over here when show preview is ticked that's just how that way that's just how sort of the sprite editor works I'm going to press Delete on this now to get rid of that because we just want this one frame over here all right and then click the tick now the only other thing we need to do in here is where it says origin down here make sure you click this center button underneath which should set X&Y to 16 and 16 right and you'll see this little cross move into the center of your sprite and that basically represents where the sprite should be drawn whenever you draw it to the game in any capacity so if you have an object that's using this sprite in your room that object will have an x and y position like a horizontal position and a vertical position on the screen and the origin of the sprite tells tells the game where to draw your sprite from so if like the origin was at 0 0 in the top left corner of this sprite as it is by default the object would draw it from the top left to the bottom right wherever you decide to draw but we want to draw for draw at the center point right so think of the origin as the center point of your sprite and it's very important that you get it right okay so the easiest way to do that for most things is just to click this center button on origin you'll see how it works a bit later and you go on go ahead and click OK on that so we've made our sprite go to objects now right click that and hit create object now we've made the sprite that's just an image right it's just a little triangle what we're actually going to do now is make the the game object for our player the game object contains all the logic of our game objects so it's just like all the stuff like when you press the arrow keys do this when you press the spacebar shoot a thing when the game starts do this when the game ends do that when the object dies do this when you run out of lives do that like all of the game logic stuff when this then do this and when this then do that rather like behavior all of that exists inside of your game object so I'm going to make an object for our player so I'm going to call this obj underscore layer and over here in this box where it says sprite and I'll click this little menu and go down to SBR and scope player and that's going to be a because that's the sprite for our plan you can see now in objects over here where it says currently says object 0 it's got the little icon the same as our sprite over that then I go ahead and click OK now you see it like names itself properly object player and if I go into rooms RM underscore game and this opens up I'll be black square again but if I go to the objects tab in this room and you can see it's selected this object by default because it's our only object but we would normally be able to select from the list here of all the objects in our game which ones we want to add to the room but that one selected by default while the object tab is open you can just click anywhere in your room to add that object and you can see I've just added this this player into the room I can click and add more if I wanted to but obviously we only want one player objects I'm going to right click and hit delete on those so now just to demonstrate our game will actually run at this point but this player won't do anything so we haven't set it up to do anything yet so this is our game at the moment it's a big blank square and with this little triangle in the middle press the arrow keys but it doesn't do anything ok so now what we're going to do is we're going to set up some very very simple game logic to actually move the I'll get the round so go ahead and open up that object again obj underscore player then we're clicking it and you should be presented with this screen again now the way objects work and way all game logic in game maker essentially works is it operates on what's called events and actions okay so events are things that happen in your game like the user presses a key on the keyboard I click their mouse a number changes into another number your score reaches a certain value or you'll run out of lives or you gained a life or the object just got made or the object just got destroyed you know things that can happen or right events right that's what the word means okay that's what events are and when those happen you set up those particular events like when a thing happens so when the hour the user presses the spacebar and then you associate those events with actions so that when those events happen certain actions are carried out and all the stuff over here happens when these events go on so to demonstrate I'm just going to set up a very very simple action so simple event sorry I'm going to click add event at the bottom here it brings up this little menu and says I choose the event to add and I'm going to go down to here where it says keyboard and then I click that and just select left yeah okay so this event here is the left arrow key event okay refers to the left arrow key on your keyboard um so in this event when the left arrow key is pressed any actions over here that are associated with this event will happen in your game now what we want to happen is we want to turn the object around right now there's a lot of actions over here that you can simply drag into this box to do certain things like there's move actions as jump action creating new objects as changing your sprite as moving between levels changing scores and lies and all sorts of sort of very basic stuff yeah but when the best way to work with game maker is to honestly do everything via more or less just this one action over here which is code execute code it's in the control tab over here and it's just this little paper icon and you hover over it it says execute code not long with the arrow next to it just the blank paper icon and if you drag that into actions it opens this code editor okay now all you're doing when you create code for game maker is you're essentially um creating a custom version of one of these actions okay and you can see the sanctions appeared over here it says execute a piece of code right because it can just do any arbitrary thing and by using code you have access to all of Gamemakers functionality you just have to know how to be able to write the code but that's what these tutorials are going to aim to teach you the reason I jump straight into teaching people how to use code is because it's honestly the best way to learn right um I honestly don't know too much about all the drag-and-drop actions in game maker because I've never used them like I start out using code and I more or less only used code okay there are a bunch of useful things like these can save you time sometimes like if you just want to destroy an object for example is a good action for that destroy instance or if you want to do something very simple that would only be like one line of code anyway like you can save yourself some time by just dragging in one of these actions but for the most part the only action we ever need is this one here in control code which is execute code okay so at the moment we know the left arrow key is being pressed and we want to set up what should happen when that key is pressed so if I double click on this execute piece of code then we get this a code editor window right now what we're going to do is we're going to change a property of our object we're going to change the angle at which the image is being drawn to the screen okay the moment we're just drawing it at image angle zero which is assuming that it's like facing to the to the right those by default this is very important by the way when you drew your sprite you'll notice I drew my facing to the right because that's the default direction okay game maker assumes a zero is right 90 inch like 360 degrees so that 90 is up 180 is left 270 is down and then 360 or zero is right again okay and so we want to turn left a when wet pressing left right that means we want to add to our image angle from zero like up to two up to four and so on so forth and like spin around in a circle so what I'm going to write in here is image underscore angle and you can see it turns red because I was the text itself turns red when I finish writing angle like that it turns red and that's because game maker recognizes the thing I've written as a variable that controls something to do with this object okay there's various ones like these if I write speed like you see that turns red if I type gravity okay it's a built-in variable for this object now I'm going to say with image angles I'm going to say it's going to equal its self plus two okay and this is a lot of what code is it's just about doing maths and moving numbers around which make things happen in your games you can change your coordinates to be certain things based on pressing buttons you can oppress write to increase your x coordinate by a bit by saying x equals itself plus 4 or so on so forth okay but here we just want to rotate so by saying image angle equals its itself so it starts at 0 so it's going to equal itself plus 2 by pressing the left arrow key our image angle is going to become 2 but it's going to continue to happen while we're holding the left arrow key because this event is so she ate with this action and while holding the left arrow key our image angle is going to continue to increase by - constantly meaning our object should spin around so if I run the game now by clicking that little little green arrow or by pressing f5 if you want to do and if I press the left arrow key now you can see our object spins around if I just tap it spins by like two pixels at a time if I hold it spins around on the spot like that okay perfect now the nice part about this is I get to basically repeat the same thing that I just did for the right arrow key so if I lost you at any point in there now you can see me do the whole process again for the right arrow key and hopefully sort of you know be able to follow along so in events over here go down for spurn versus add event and click that and again presented with this list of different events all sorts of things I create destroy Mouse and like there's loads of these that all do various different things but what we're going for now is keyboard event for right that's the right arrow key and as you can see now there's no actions associated with right and when we click left we see that code action we made we click right we don't see anything yet okay these are the actions that are associated with this event so once again I'm just going to drag in the execute code action again we don't need to worry about any of these other actions just in the control tab code execute code and draggin that and it will bring up our code editor again now what do we want to associate with the right arrow key we want to turn to the right so we're going to do exactly the same thing we did with the left arrow key and then I say image and this for angle turns red so we know we've got the right word equals image underscore angle - - okay I've ended the line with a semicolon there as well that's just good coding practice it's not something you need to do is not an essential thing it's just good coding practice because it tells generally in programming it tells tells the game or the program where that line of code ends like strictly okay so the computer knows but gaming will let you not enter that so I mean just to demonstrate I cannot put that in and it will work in just the same way so go ahead and click OK to save your changes to that like okay and then if I run the game now by just pressed f5 to run it pressing left and right my spaceship now turns around smoothly sort it now at this point you might be wondering or how did I even know to write that piece of code okay how do i how do I even learn that in the first place I mean sure it's oh well good when you tell me right image underscore angle equals image Ernest Cline or +2 but how do i how do I know that by two in order to turn my object I have to change its image angle how was I supposed to know image underscore angles weird thing right well if you press f1 it opens what's going to be your best friend on when you're learning how to write code which is the the game maker manual okay and if you go into reference over here um you can see this book called the GM a language overview and absolutely everything about writing code and stuff is all explained really really well um in this manual okay like there's all sorts of like really long very detailed overviews about stuff and like what all the different commands and functions and stuff that you can use in game maker actually are so like if you're looking for something to do with like moving around for example um there's a section down here it says movement and collisions you can click in that go to movement and then there's a whole section that shows you all the different things involved in moving around like setting the speed setting horizontal speed changing gravity and so and so forth and you can click on any one of these I'll show you a detailed explanation of how that particular function works and really there's nothing to it other than just learning over time to learn by looking at example so by using tutorials and really by reading the help menus not really much else to it than that you just have to learn the syntax over time and it'll sink in and it's not nearly as intimidating as you think because more you learn the more things you'll find it right evil debt able to easily do as everything has more than one way we used the image angle is just a property of your object that controls which way that object points at any given time so just by adding 2 to it every time we press a left or a subtracting 2 to from it every time we press right we turn on our object around but the next thing we need to do here is make it so our object actually moves forward when we press the up arrow key I'm going to add another event in here now it's going to be the by i just right-clicked in events then go to add event you can also click the add event button at the bottom as we did before I'm going to go to the keyboard section again and just select up this time okay so now we have the open then right key does that the left key does that book key doesn't do anything yet so again in the control time just dragging the execute code action to bring up our code editor again this time we're actually going to write two lines of code crazy right so the first line of code we're going to write is going to add a motion to our object in the direction that it's facing normally we could do something like just saying speed like we could say like our speed equals speed plus one to increase our speed right and that would cause the object to move faster in that direction a number of pixels per frame based on whatever our speed is so if it were to we've moved two pixels a frame in our current direction but we don't want to be moving in our current direction because we want to be able to change direction without actually turning the object in that direction speed wise you know so we don't want to turn in like a we don't want to turn like a car would turn we want to turn like a floating spaceship would turn independent of our current line direction of motion so instead I'm just going to add a motion to our direction that's independent from that stays independent rather from the direction that we're currently facing so I'm going to use the line motion under store ad and you see it turns yellow because that's a it's a function that gained make it recognizes okay while red stuff is a built-in variable that the object recognizes yellow is a built-in function that GameMaker recognized okay and whenever you do a function generally you have to open and close a pair of brackets after afterwards now sometimes you don't need to put anything in those brackets but generally what those brackets are there for is to pass what's called arguments to that function basically it's stuff that the function needs to know in order to work so in order for us to add any kind of motion to our object it needs to know what direction to have that motion in and how much motion so what speed and what direction the direction is going to be our image underscore angle right so our current direction the current way of which our object is pointing yeah which is what we're changing by pressing the left and right arrow keys okay so whichever way we're currently facing if we press up we want to take that direction and add some speed to it now just press the out of comma in here just a separate we just separate out the variables that we put into into the function with commas and if you look down here at the bottom of the screen where it says motion add in brackets it tells you the two things that we need to put in dir for direction and then comma speed for speed okay so we put in our direction next thing we need to know is the speed at which we want link we want to add this motion I'm going to say nor point two which means for every frame we're holding up we're going to increase our speed in the direction that we're currently facing by naught point two pixels okay no point two pixels our frame so eventually like if we keep holding that we would end up at like six and seven and ten like infinity we'll just keep keep climbing we would get faster and faster and faster and we can actually test that now like if I just run the game now and I press if I just tap up you can see I start moving like that if I'd like turn around and tap up you can see like it starts to apply the motion in this direction instead I've flown off the top of the screen but the problem with this at the moment is you'll see if I hold up I go faster and faster and faster and I get really really fast faster than we want to be able to move and the speed just keeps climbing so it needs a maximum okay and so in order to set a maximum I'm going to say I'm going to check to see if our speed is currently greater than five and if it is greater than five I'm going to reduce it back to five okay and that's going to keep our speed clamped at that value and so basically we do this just by asking asking a question in code and how we ask a question in code is we use the line if okay so I type F and you can see that's turned yellow but this again it's a function that GameMaker recognizes then open a pair of brackets as we just did before and now how it works is we inside the brackets we give the game a condition and the game will analyze that condition and see whether or not it's true or its false if it's true then game maker will do anything that you write immediately after the if statement if it's false it will skip that line of code and will not do that okay so I'm going to say if and inside the brackets speed greater than with a greater than symbol five and I'm going to close the bracket so all this line is doing is it's saying if our current speed which has been added to by motion add is greater than five in any direction okay then I'm going to write speed equals five and put semicolon at the end of both of those lines just good practice so again making those weather line of code ends okay so now game maker will analyze this this expression in this bracket it's going to analyze speed greater than five and it's going to work out whether or not that is true whenever we're pressing up okay and if it is true then it's going to do whatever we do after whatever we wrote after this if they know which we wrote speed equals five okay so the speed is greater than 5 and that come back comes back true we set speed to five so if we were currently moving at like a 4.6 pixels a second to the right and we pressed up it would add naught point two to that speed bringing our speed to four point eight pixels per second and we would say if speed is greater than five which it's not I don't do anything because the speed wasn't greater than five but if we were moving we were currently moving at five pixels uh five pixels of frame to the right and we pressed up we would try and add that motion so we would increase the speed by not point to bringing us to five point two pixels uh pixels the frame to the right and then we will say if speed is greater than five which it is set the speed back to five so it goes back to fly so there's no way to go above five in that direction okay and then we can go well before I test that I'm going to do one more thing okay I'm going to add a new event this event say is where's little diamond is that says other go ahead and click that and click outside room okay so this is an event for whenever this object leaves our room because so you notice before I just like flew out of the room and went outside in asteroids what happens when if you go out the screen is you you wrap around the screen and you end up on the other side of screen now there is a line of code for this which is like a wrap or something like I can't actually remember what the function is for those very useful just drag and drop tool that all let's do this you go to the the move section of drag and drop here and you'll find this little icon that's like two little like a white double ended arrow and I overlapping a green double ended arrow and it's called wrap screen go ahead and drag that action in here and where it says Direction down here when this little box comes up click that and just click in both directions and click OK okay that just saves us writing writing the actual code to wrappers around the room because there's a very simple action that does exactly the same thing and the whole point of writing code really is to write on customized versions of these actions but there's no need to do that if there's a simple action that just does everything for us okay so there we have it so if I run that now we should find that I move around with a limit to my speeds you can see I can't go over five pixels a frame in one direction now I'm holding up at the moment right so I'm not getting any faster now because it's capping as at five and whenever I go outside the screen I just wrap around and end up on the other side of the screen so if I turn around and slow down by holding up and then push up to go in that direction you can see it's working perfectly and now I can spin around while I'm moving and it doesn't affect doesn't affect my speed because acts like we're actually kind of like in space you know there's no the force acting on this spaceship and then I can move around a thrust about just like glue or using like thrusters just like how asteroids works we move around the screen like that okay so there you have it that's the very basics of making sort of the the basic movement of asteroids in the next episode we'll be looking at making this a little bit fancier and learning how to make our object shoot that stuff so I hope you enjoyed that thanks for watching and I'll catch you guys next time you

Channel: Shaun Spalding

Views: 681,187

Keywords: Game Maker (Video Game Engine), Game Development, Games, Tutorial, Learning, Tutorial Series, Game Maker Studio, Making Games, How to make games, Basics, GameMaker: Studio (Video Game Engine), First Video Game

Id: 7XDcSXVUGsE

Length: 34min 23sec (2063 seconds)

Published: Fri Feb 27 2015