Procedural patterns you can use with Tilemaps (Part I)

Many creators have used procedural generation to add some diversity to their game. Some notable mentions include the likes of Minecraft, or more recently, Enter the Gungeon and Descenders. This post explains some of the algorithms you can use with Tilemap, introduced as a 2D feature in Unity 2017.2, and RuleTile.

With procedurally created maps, you can make sure that no two plays of your game are the same. You can use various inputs, such as time or the current level of the player to ensure that the content changes dynamically even after the game has been built.

What is this blog post about?

We’ll take a look at some of the most common methods of creating a procedural world, and a couple of custom variations that I have created.  Here’s an example of what you may be able to create after reading this article. Three algorithms are working together to create one map, using a Tilemap and a RuleTile:

When we’re generating a map with any of the algorithms, we will receive an int array which contains all of the new data. We can then take this data and continue to modify it or render it to a tilemap.

Good to know before you read further:

1. The way we distinguish between what’s a tile and what isn’t is by using binary. 1 being on and 0 being off.
2. We will store all of our maps into a 2D integer array, which is returned to the user at the end of each function (except for when we render).
3. I will use the array function GetUpperBound() to get the height and width of each map so that we have fewer variables going into each function, and cleaner code.
4. I often use Mathf.FloorToInt(), this is because the Tilemap coordinate system starts at the bottom left and using Mathf.FloorToInt() allows us to round the numbers to an integer.
5. All of the code provided in this blog post is in C#.

Generate Array

GenerateArray creates a new int array of the size given to it. We can also say whether the array should be full or empty (1 or 0). Here’s the code:

Render Map

This function is used to render our map to the tilemap. We cycle through the width and height of the map, only placing tiles if the array has a 1 at the location we are checking.

Update Map

This function is used only to update the map, rather than rendering again. This way we can use less resources as we aren’t redrawing every single tile and its tile data.

Perlin Noise

Perlin noise can be used in various ways. The first way we can use it is to create a top layer for our map. This is as simple as just getting a new point using our current x position and a seed.

Simple

This generation takes the simplest form of implementing Perlin Noise into level generation. We can use the Unity function for Perlin Noise to help us, so there is no fancy programming going into it. We are also going to ensure that we have whole numbers for our tilemap by using the function Mathf.FloorToInt().

This is how it looks rendered onto a tilemap:

Smoothed

We can also take this function and smooth it out. Set intervals to record the Perlin height, then smooth between the points. This function ends up being slightly more advanced, as we have to take into account Lists of integers for our intervals.

For the first part of this function, we’re first checking to see if the interval is more than one. If it is, we then generate the noise. We do this at intervals to allow for smoothing. The next part is to work through smoothing the points.

The smoothing happens through the following steps:

1. Get the current position and the last position
2. Get the difference between the two positions, the key information we want is the difference in the y-axis
3. Next, we determine how much we should change the hit by, this is done by dividing the y difference by the interval variable.
4. Now we can start setting the positions. We’ll work our way down to zero
5. When we do hit 0 on the y-axis, we will add the height change to the current height and repeat the process for the next x position
6. Once we have done every position between the last position and the current position, we will move on to the next point

If the interval is less than one, we simply use the previous function to do the work for us.

Let’s see how it looks rendered:

Random Walk

Random Walk Top

The way this algorithm works is by flipping a coin. We then get one of two results. If the result is heads, we move up one block, if the result is tails we instead move down one block. This creates some height to our level by always moving either up or down. The only downside to this algorithm is that it looks very blocky. Let’s take a look at how it works.

This generation gives us more of a smooth height compared to the Perlin noise generation.

Random Walk Top Smoothed

This generation gives us more of a smooth height compared to the Perlin noise generation.

This Random Walk variation allows for a much smoother finish than the previous version. We can do this by adding two new variables to our function:

• The first variable is used to determine how long we have held our current height. This is an integer and is reset when we change the height.

• The second variable is an input for the function and is used as our minimum section width for the height. This will make more sense when you have seen the function

Now we know what we need to add. Let’s have a look at the function:

As you can see from the gif below, the smoothing of the random walk algorithm allows for some nice flat pieces within the level.

Conclusion

I hope this has inspired you to start using some form of procedural generation within your projects. If you want to learn more about procedural generating maps, check out the Procedural Generation Wiki or Roguebasin.com, which are both great resources.

You can look out for the next post in the series to see how we can use procedural generation to create cave systems.

If you make something cool using procedural generation feel free to message me on Twitter or leave a comment below!

2D Procedural Generation at Unite Berlin

Want to hear more about it and get a live demo? I’m also talking about Procedural Patterns to use with Tilemaps at Unite Berlin, in the expo hall mini theater on June 20th. I’ll be around after the talk if you’d like to have a chat in person!