As usual, I will use Graphicsgale and Gimp for this Tutorial, but feel free to use whatever graphics editor you are comfortable with!

Step 1: Choose a cliff you want to edit

Usually the cliffs will be in a A4 tilesheet, so this is the format I’ll focus on in this tutorial. Our result will not be in that format though, it has to be placed either on A5 or B/C/D/E.

This cliff is our starting point, and I already switched on the 24*24px grid we’ll need in the first step.

By copy and paste we will just map the shape we need to proceed:

The tile on the top right is not needed anymore. Copy and paste all of the large shapes tiles but the very left 24px column and paste it in with a 48px offset to get the right width.

Separate the corners of the corner set and move them to separate tiles in the appropriate corners.

Repeat the copy and paste two times to get the correct height and use the center tile of the top to get a background for the corner tiles.

You now have a good base to start.

Step 2: The top

Use a dark color and roughly draw a quarter circle corner that follows the structure of the rocks. Erase everything that is past that line, it does not have to be done perfectly, we’ll clean the border in a second anyways.

Use the surrounding parts as reference to clean up the curve.

Repeat for the right top corner and do the lower two corners without the cleaning part:

Step 3: The bottom

The middle part can stay as it is, but a lot of people tend to start bending the shape here.

This will lead to the piece having a wrong perspective, so we will help ourselves with some pixel tricks.

With some copy and paste we make the structure wider, and as already said, the middle part stays untouched in this part of the process.

Let’s take a look at the left cliff side:

The cliff is separated into 3 pieces. The one on the very right, close to the middle, stays untouched. The wide middle part is narrowed by 16 pixels, and the one on the left is narrowed by 8 pixels.

We will repeat on the other side and put the parts together:

Without any further edits, this already looks much more round that it did before.

Now we will use a combination of box selecting and copy and paste to make the bottom and top seamless. You work from the center part to the edges and piece by piece the gap will close.

As you can see, the bottom area is now not perfectly smooth, since it is the same as the one we created for the top.

With this result we could start mapping, but there are several steps left we can do to improve the overall result!

Step 4: Remove the straight lines

The straight borders on the bottom and the sides and the top look pretty unnatural and there is a lot we can do about that.

By simply erasing some pixels at the top, we get a more natural line. Be sure that the tile still loops and the border is still visible!

For the side you do something similar by making the line slightly less straight and then fill up the holes with dark pixels to show that you see parts of the wall through the gaps.

We continue to rework all the lines besides the ones on the side. While you can technically have them have gaps, this will lead to more mess when mapping and I prefer it this way.

Now we have to copy our curved cave walls and tops into three different layers (this will require a graphics editor that supports layers!)

Make a layer with the regular image and then make a lighter “highlights” and a darker “shadows” layer. To achieve the different variations, I used the curve option, but Gimp has many ways to solve this part and you can use the one you are most comfortable with.

Now give both layers a black color mask, which makes them completely invisible.

Now use a bilinear white to black to white color graduation to mark the relevant parts in the masks.

Your mask for Highlights should look like this:

Be sure to have the gradient part only in the first column of 48*48 tiles, so the looping middle part is not affected in any way. Use the brush and black to mask the top part of your tiles so it is not affected as well.

For the shadow layer, create a gradient like this...

...and then mask out the top part of the tiles again with the brush.

Merged together, out resulting tile will look like this:

Don’t forget about the corner parts for the top we made right at the start!

You can paste this in any A5 or B sheet and use as you wish.

Step 5 (Optional): Additional Edits

Some specific things might need further edits.

A good example are the one tile wide side or the top with a curve:

If you just use the 24 px of the very outer columns and rows you can kinda create them, but they are not very pleasing as is.

To fix that issue, we will use the same techniques as above.

For the horizontal piece, we just use the middle part that is already perfect and cut new shapes out of it, fix the border on the top and copy it onto the not working tile we had, done!

For the vertical part, you can fix the shape with a part of unedited rocks in the middle and just need some smoothing out by pushing some pixels.

Additionally, You might need more than the 4 edge parts we have, I solved this issue by keeping a backgroundless version as well on the sheet:

Since we have 4 layers, we can puzzle any  combination we need together in the editor!

I’ll do the same with the middle tile of the top part: separate it into the 4 corner pieces and keep them ready on the top map. This will be really helpful, trust me.

Now let’s have a look at the final set and the difference it makes!

This is also a good example why we need these separated tiles:

To get the top part right, we need the turquoise tile on layer 1, the matching corner on layer 2 and to cover the last border we don’t need the separate part of the normal middle tile.

It might take a bit to convert your cliffs and cave walls and get used to a bit more complicated mapping, but trust me, it is so much worth it!

‍