Last week, we looked at how autotiles go together from a technical perspective. This is useful, but this week, we’re instead going to walk through making one from start to finish, using a process that will create perfectly tiled autotiles every time.

Ok, so maybe I lied. I’m not going to make an autotile myself. I’m a terrible artist. So I’m going to take one from the RTP, and then walk you through a foolproof process on how to construct that autotile to properly tile.

Trust me, we’re better off this way.

So the first thing you want to do is to make a base tile. This tile will be what the autotile looks like when it is completely surrounded by itself in the editor. It will need to tile properly itself, meaning its top and bottom patterns and left and right patterns match up.

Note: Again as with the last tutorial, for ease of viewing in this blog post, all of the images are blown up to 2x their normal size.

Now, copy and paste that base tile across all 6 sections of the autotile.

If your base tile isn’t looking right at this point, your initial pattern is not tiling correctly: you need to edit it until it does!

Next, let’s create the editor image for the tile. You may think this seems a bit out of order, but it will let you create the 4 inside corners of your autotile so that you KNOW they match up. So, working in the top 48×48 pixels, draw a border around the edges. Make sure that you keep each corner inside it’s 24×24 quarter tile.

Now that we have that done, let’s copy the 24×24 pixel sections of the corners into the inside corner sections in the lower 4 sections of the autotile.

By doing it in this order, we GUARANTEE that the corners will match up with one another, which as we learned in the last tutorial, is necessary for the autotiles to work properly.

Our next step is to fill in the rest of the border on the lower 4 sections of the autotile. Make sure to keep all of the border within the 24 pixels around the edge! If any of your autotile edge bleeds into the 48×48 portion in the center of those 4 sections, it will make your autotile fail to tile properly.

An important thing to check at this stage though is that the straight edges tile properly as well. Because of how they connect to the corners they should already match up correctly, but its generally a good idea to make sure. Take each straight edge (48 pixels worth of distance, starting 24 pixels from the edge of each corner of the lower 4 autotile sections, and copy paste it in a line to make sure it tiles.

Repeat this for all four edges, and you will know for certain that every part of your autotile you have created so far will autotile correctly! The only thing left is the outside corners.

First, to do the outside corners, let’s rearrange our pieces in another file. You want to do this because it is the easiest way to make sure they match up with what they need to match up with. First, put the top right section into the center of your workspace. Then, take the straight edges and place them around it. Now, take the 24×24 sections around each corner and switch them diagonally, making a cross like path. It is important that you make sure you are using the correct straight edge piece for each side. watch the image below CAREFULLY! Now you can fill in the outside corners, and move that piece back into the autotiles upper right section!

And that’s it! You know have a completed autotile. This order and process will ensure that every portion of your autotile that should match up, will match up!

Hopefully this has made things a bit easier for you to understand!