2.5D in GameMaker using Sprite-Stacking
There’s an age-old question among GameMaker users who’ve chosen the tool for its simplicity. How do I make a 3D game in GameMaker? Then you find out you need to know quite a lot of maths and how to draw primitives and vertices and you ask yourself the next question. How do I make a sort of 3D game in GameMaker, but like, easily?
One method of making games look a bit more 3D is to use sprite-stacking. This method is already used in games like Nium by Moppin, and our own Project Jackdaw, among others.
Does Sprite-Stacking Look 3D?
The answer is yes, sort of! Sprite-stacking is a great way to make characters and scenery in your game appear to rotate smoothly in a three dimensional way. Because of how it works, it almost always has to be done with low resolution pixel art, resulting in this kind of “low-poly” 3D effect you see in the video above.
How does it work?
Sprite-stacking works by drawing several frames one on top of the other and rotating them to give a 3D appearance. Each image from of the sprite is a cross-section through the character or piece of scenery. For example, the frames of the sprite for our Jackdaw character look like this:
See how the Jackdaw’s shadow, feet, body, and head are all cut into separate layers? We draw these one on top of the other, separated by a pixel at a time. They’re rotated based on the direction the character is facing. Here’s the code in its simplest form:
for (var i=0; i<image_number; i++) {
draw_sprite_ext(sprite_index, i, x, y-i, 1, 1, image_angle, image_blend, image_alpha);
}The Code Breakdown
- We create a for loop with the same number of iterations as the number of images so we can draw the layers one-by-one.
- Notice the image index we’re drawing “i” is the next in the sprite, from the bottom-up.
- Notice the y position is also decreased by “i“. This offsets the sprite 1 pixel at a time, building up a taller “model”.
- And finally, note the image_angle for the sprite’s direction, allowing it to turn and look 3D.
This is the most basic version of the effect. In our Jackdaw project above, we actually draw the feet separately so that we can make them animated like the character is walking.
You can do this by drawing an animated sprite underneath the others and rotating it with the model, or you can use a little bit of maths like we did.
You also probably want to replace image_angle with a variable of your own for tracking the character’s angle, in case your sprite has a mask that you don’t want to rotate.
But that’s it! In its most basic form, this one code snippet will help you to make your own 2.5D game in GameMaker. Enjoy!
