Drawing retro-style floor tiles

Previously:

(I use Paint.Net to make these examples, but two open source programs, GIMP and Pinta, work just as well.)

(I also turn on the pixel grid. In Paint.Net and Pinta, it’s under View->Pixel Grid.)

Between ground, building, door, and wall (brick) tiles, we have enough to make most of the outside tiles we would ever need. By mixing up the patterns and colors, we can cover different locations and their associated styles pretty easily. However, the one thing not covered yet is floor tiles. For those, we combine some of the techniques brought up in the other posts. Notably, tessellations and repeating patterns.

Making a new 16 x 16 image, we can fill it with black.

Selecting a 8 x 8 rectangle starting from the top-left corner, we can create the first instance of a new tessellation pattern by drawing a grey (#7C7C7C) 7 x 7 square inside that.

By adding an outline to the top- and left-most sides of the grey square in a lighter shade (#BCBCBC), we can finish this first instance.

Now, we copy and paste the 8 x 8 pattern three times so that there are two rows of two instances each with a single row or column of black between them.

Ta-da! A tiled, well, tile for the inside of buildings.

Using the template of a 8 x 8 pattern tessellated, we can build other variations too.

For example, to make a more science-y looking tile of a grated floor, we can draw a grey checkered 7 x 7 pattern within a 8 x 8 (with the bottom- and right-most side left black) square.

And then fill the image with the pattern.

We can even create a marble looking floor tile the same way.

First, with a new 16 x 16 image, we fill it with grey (#7C7C7C) this time.

Then, with a 8 x 8 selected rectangle, we can draw random pixels of black and the lighter grey (#BCBCBC), making sure to have at least one pixel on each side of the selected space.

And then, we repeat this new pattern to fill the image to create the effect of “noise” within the image the way marble might form naturally.

Of course, not all floors have marble or simple grey blocks either. Some have large, ornate patterns.

Or even simply one color.

However, all buildings of the same general style or within the same geographical region generally have same the color scheme. So, varying the colors dramatically from one building to another within the same village, for example, can often be distracting to the player.

This doesn’t each house within that same example village can’t have slight variations though. Maybe the direction of the inner tiles points another way from house to house. Or the floor tiles could be upside down or reversed too.

Share this:

Like this: