Each of my game’s levels are built mostly using bitmap slices. They’re basically vertical slices that can be stitched together to create a surface area for our little monkey hero to run along. The image below shows a single platform slice being used repeatedly to create the ground from my Jungle levels.
One slice repeated.
As you can easily see, things are a bit repetitive and there’s a distinct pattern running along the cross-section of each slice that gives things a very artificial look. Of course we could get around that issue by simply creating a shedload of different bitmap slices each with its own look and feel. However doing that would quickly exhaust memory and also likely impact GPU performance.
So how do we make our level look more natural and also ensure we don’t run out of memory in the process? Well, you need to be clever and use lots of little tricks. For Dare the Monkey I created a small set of slices that could be re-used to create fairly natural environments. Let’s walk through a few of the tricks I used.
Currently I only have one slice but I can get a little extra mileage from it by simply flipping it horizontally. This effectively gives me two slices that I can now randomly distribute across my level. Take a look.
The same slice but flipped to create a second.
It has certainly added some variety but you won’t get away with this for long before the user starts to notice the repetition. So let’s add a second bitmap slice that is a slight variation on the first one. We’ll also randomly flip each slice now and again to give the illusion of there being 4 physical slices rather than just 2.
Two slices plus horizontal flipping to effectively create four.
To break thinks up further I’ve added a third slice that contains a large hole punched into the side. This slice looks quite different from the others so it needs to be used sparingly or it’ll stick out like a sore thumb during play. And once again, we can employ flipping to add more variety.
Three slices.
My slices are all the same width but there’s nothing stopping me horizontally stretching or shrinking them. This little technique helps get rid of any obvious repeating patterns and it’s now possible to get a massive amount of variety from a very small number of slices.
Horizontally stretching and shrinking slices to create more variety.
Things can look dull when your game world has the same elevation throughout. With vertical slices I can simply change the y-position of each to add some height. Two additional slices are also required to help us ramp up and down between slices. This allows us the option of adding hills and dips. As with all the other slices we can also flip, squash, or stretch these new tiles.
Adding elevation to the level.
Finally you can distract the user’s eye by adding some hanging vines next to some of the slices. The same flipping and scaling tricks can also be applied to the vines to further break up the visuals.
Adding some detail over the slices.
So there you have it. With a very small number of tiles it’s possible to build a massive amount of variety into each of your game worlds. Most experienced developers will find all this stuff trivial but if you’re new to game development then these techniques can really help you minimise the amount of artwork required for your game while helping to maximise the look of each level.
Hope that was helpful and let me know if you found these tips useful.