We'll start this section of the Quick Start Guide by looking at sprites which are generally one of the first things you'll need when making any project in GameMaker Studio 2. As explained in the section on Resources, a sprite is an image that can be animated (although it doesn't have to be) and then drawn to the screen. In general a sprite will be associated with an object, but you can draw sprites on their own, either from code or in the room editor Asset Layer (more on this later). You can also create a sprite to be used as a tile set, but we'll explore that option later too.
When you create
a new project from the Start Page,
your resource tree will only contain empty folders for the
resources you may need, so you need to right-click
on the sprite resource folder and
then select the option Create. This will create a new sprite
and open the sprite editor for you (if the sprite editor does not
open, simply double-click
on the new resource): ![]()
As you can probably see, the top left of the window has a field for the "Name" of the sprite. All sprites (and all other resources) must have a name given to them so that you (and GameMaker Studio 2) can identify them easily, although you should note that this name is really just a variable which holds an ID value that "points" to the resource, in this case a sprite. It's best to give each sprite a descriptive name so that you can identify at a glance whether a particular resource is a sprite or an object or anything else, and many people do this by prefixing or suffixing the resource with the letters "spr" - for example, "spr_Ball". Note that resource names are limited to using only letters, digits and the underscore symbol "_" in a name of a sprite (and any other resource) all resources must start with a letter, not a number.
The other features
of the sprite editor we'll discuss at the end of this section, but
first we need to explain how to draw a sprite. This is done in the
Image Editor. The image editor is a very powerful tool for
creating the graphics in your game and is opened by clicking the
Edit Image button.
We won't go into too much
depth about the tools available here - for that we have the
Image
Editor section of the manual - but briefly you have:
- At the top left, the frame view - this shows the frame(s) of your sprite and can be resized using the magnifying glass icons.
- In the centre we have the drawing canvas - this shows the currently selected frame ready for drawing and you can use the middle mouse button
to pan around and the mouse wheel
to zoom in and out
- At the top right we have the basic brushes - here you can pick the brush for drawing, and any custom brushes will also be added here
- At the middle right we have the colour picker - here we can choose the colour to use for the left and/or right mouse button, since you can draw on the canvas with one or the other buttons at the same time
- Just below the colour picker we have our tools - these are the different drawing tools, including the brush, flood fill, masking and shape tools. Note that some of the tools are split diagonally and will draw either outlined or filled shapes depending on which side of the line you click on to select them
- At the bottom right we have the layers view - like many other drawing tools out there, you can create different layers to draw onto, permitting you to experiment with position and colour etc... without having to worry about destroying what's underneath
Draw something into the image editor and take some time to play with the options, then when you are ready close the workspace (which will save the image) to take you back to the workspace with the sprite editor in it. We'll discuss a few other features of the sprite editor that are important to know when just getting started...
The first thing you need know is how to set the origin
for the sprite. The origin is simply the point that will be used to
"anchor" our sprite within the room, and in this case we want to
set it to the centre. So we click
on the
from down menu for setting the origin and select "middle centre":
You'll see the origin cross-hair in the preview image move to the
centre of the sprite. Note that you can place the origin anywhere
you wish by simply clicking
on the preview image, and you can
also manually input the origin position by adding values into the
x/y fields at the top.
Another important thing to do know is how to set the
collision mask for the sprite. The collision mask is the
area that GameMaker Studio 2 will check to see if there has
been a collision, and by default this is set to rectangle
(which is also the fastest to resolve). Note that you can set the
detection mode for the bounding box to be either automatic (the
default value) or manual. If you choose manual you will be able to
set the bounding box values left, right, top and bottom.
![]()
Any type of collision mask other than rectangle will be slower to resolve, but when making a small, simple game it's not usually an issue. You can close the sprite editor now as we are going to move on to discuss Tile Sets.