What is a 3x3 Block?

A 3 by 3 block is the simplest way to begin designing a tileset. It consists of 9 segments that make up a single, coherent block.

This allows new tileset ideas to follow a unified palette, style, and design.

It also is the first step in creating an auto-tileset.

Follow these three steps to properly design a 3x3 Block

1. Find the purpose
2. Use purpose to define style
3. Style leads the palette design

1. Draw within a set Grid
2. Sketch out perspective using 1 color with multiple shades.
3. Add another layer of color on top
4. Refine shapes and Color
5. Define texture by adding Shade

Draw within a set Grid size

2D Pixel-Art games exist within a set grid size -most commonly, 16x16 and 32x32 sized blocks.

So before you start any sketching, ensure your tileset is drawn within these parameters.

Create a boundary

There are various ways to draw within a grid boundary.

Most art software allows grids to be displayed.

For example, Aseprite has a setting in … to display grids.

The grid size can be adjusted.

Sketch out Perspective using 1 Color

Establish the foundation of the tileset by laying out its perspective and silhouette.

This is best done using a single base color with multiple shades.

It’s ideal to use mid-tone colors and shades because luminosity can be added/removed. So the mid-tone acts as a foundation to work from.

Do not worry about details or texturing.

Add colors on Top

Additional colors are added to establish

Define Texture

Texture is created by refining existing colors and shades. Textures have varying color patterns and shape patterns.

Refer to the texture template for in-depth explanation and examples.

Add the necessary colors that match the texture

Then shade according to match the perspective of the tileset

Refine to Define

Fix any stray shapes or colors to polish the final sprite.

Here are a few tips to follow during this polishing process:

1. Keep colors at a minimum. Complexity does not directly equal to better quality.
2. Add extreme highlights and shadows
3. Shapes must remain consistent.

There you have it, a complete tileset design!

If you wish to take it a step further and use this in your game-dev projects, proceed to the next tutorial: How to create a 16 Block Auto-Tiler