If you have read this far, your theoretical knowledge in Pixel-Art is now almost complete. However, you are probably disappointed that I did not answer your most pressing concerns, such as "How do I make a grass tile", "How do I make my hero?", "How do I avoid making my trees ugly?", or "Where can I find a new girlfriend? " . In fact, you already know enough to do all this (except for the girlfriend, and in that case you're probably better off without my advice, I suspect). Without practice, we never get anywhere, and if you're asking these questions, you need to practice.

But for now, we'll go through a graphical history of RPG pixel art and review some of the basic elements that aspiring pixel artists have trouble with.

1. The fear of Pixel-artist: the GRASS TILE (* cries and cries *)

a. Like the pros!

The problem with representing grass is the same as for fur in the previous chapter: the grass is too fine to be represented individually in Pixel-Art. We'll need to use a strategy similar to that of the tufts of hair ... I call this strategy tufts of grass.

What follows is in no way encouragement to copy; it is a collection of screenshots containing grass tiles that I suggest you observe closely (save and zoom as much as possible) by asking technical questions: how many colors are used? what patterns shape the colors? which way are the clumps oriented? The results here are very convincing. Without further delay, This is the collection in question:

These images are screenshots of the following games: Alcahest, Bahamut Lagoon, Chrono trigger, Rudora no Hihou, Seiken Densetsu 3, Sword of Mana, Terranigma, Star Ocean

--

Since I'm nice, I'll stop for a bit and work with you to dissect the tile grass Rudora no Hihou. This is the grass tile in question.

It is imperative to note that tile is not created "randomly" by placing random pixels of the 4 colors (remember how we do our textures!). The blocks of the same color are mostly vertical or slightly inclined, and that is roughly the direction of the tufts of grass. In addition, there is virtually no anti-aliasing (only a few highlights below) because there is not really a place or a need to do (the colors are similar enough not to clash violently).

Just look at the palette -- a little history to know what you're talking about: the artist has used 4 shades of green to create the tile of grass, namely one for the highlights, one for the shadows, and two shades close to the median as a basis. The highlights are used to represent the tops of the tufts of grass, while the shadows are the most depressed and close to the ground.

The management of contrast is essential to make a tile of grass: the less contrast you use, the flatter your tile will look; conversely, the more contrast you use, the more more tile will show the volume and richness of local flora (thick layer of grass). We must strike a balance between a pattern of flat ground and "volume", because it can complicate the readability of the screen and draw unnecessary attention. Your grass tile shouldn't drown out more important things like houses, trees, and characters. For example, compare the original screenshot of Rudora no Hihou (left) with a modified version (with darker shadows and brighter highlights). On the right, there is more volume but less readability.

b. Tips and Tricks

Here are two tips to help you better your grass tile (the latter also applies to non-grass tiles as well):

--

First, it is very advantageous not to use just one grass tile, but rather several grass tiles! If you examine the screenshots provided above you, probably noticed that every game uses several different tiles in order to have variations in soil texture. This allows you to limit the effect of the grid repeating the same pattern over large surface.

Most games use 4 tiles of grass (a square 32 * 32), and variety of tall grass and flowers of different tiles. In addition, developers in general try not to have large grassy fields (even full of variation) and fill their maps with cliffs and trees to get rid of the problem once and for all.

--

Secondly, it is possible to eliminate the grid effect by correcting small, repetitive details by hand. Consider if you will the tile (32 * 32 pixels, therefore 4 tiles) to your left (made specifically for this tutorial). It's not too bad, but I highlighted some obviously repetitive areas between some red lines. By addressing these areas, I can make my tiles a bit more uniform.

The diagonal problem tufts lie in the upper right of the tile, so it is enough to adjust some of the tufts to correct the problem. On the other hand, the horizontal lines are straddling the top and bottom of my tile (which loop and are therefore therefore evil) and it requires a small trick to fix them. The trick is to glue together a second tile using the top and bottom halves of your tile (with the top on the bottom, and the bottom on the top) so you can see the seam. Then, correct the seam, and put the top and bottom pieces back in their original positions. Now you have a tile that patterns correctly. The result isn't perfect, but it's already a lot more convincing.

2. Trees

Well, now that you have the grass, it's time to make a tree. I am not going to insult you by explaining that a tree consists of branches and leaves, and these are usually green. I begin by letting you watch a parade of successful tree screenshots (or not! Chrono Trigger is not an example to follow in this case) to observe, the explanations are below. As before, it would be very good for you to spend time to analyze and dissect these screenshots in detail.

The games are represented here: Alcahest, Bahamut Lagoon, Chrono Trigger, Chrono Trigger encore, Rudora No Hihou, Seiken Densetsu 3, Sword of Mana, Tales of Phantasia

--

As you can see, there are many ways to represent trees, from the very realistic Tales of Phantasia to the exotic and stylized Sword of Mana. Here are some important tips to help you create a good tree:

The first is that the roots of a tree are embedded in the ground and we tend to forget this and make endless filaments running between the twigs. Trees are planted in the ground; take a walk outside and observe this.

As long as you are outside, take the opportunity to take a look at the foliage around you -- that's what is most important on a tree. There are two mistakes to be avoided on the leaves: the first is making a leaf flat, like a slice of cardboard. One should bear in mind that the foliage is an object in 3 dimensions, which means it is subject to the rules on light and shadow that have been mentioned previously. The second trap is to think about this too much and reduce the tree to an illumated sphere. We must not forget that the foliage is made up of branches and leaves, which do not form a perfect sphere, but more often a pile of twisted or incomplete areas on which the leaves are fighting to receive the light passing one before the other. Look at the tree of Seiken Densetsu 3: it consists of 4 levels which are drawn on the leaves.

--

Let's look at a small example:

I begin by roughly drawing the shape of leaves (stage 1), before devoting 5 steps to creating the volumes of foliage. My source of light is to the left, and I add color after color of shadows and lights. Step 3 is where the process appears most clearly. With this done, I draw an outline of the trunk and found that my tree too much like a giant mushroom. I decide to cut some foliage off the top (and yes, a bit of work was done for nothing). I detailed the trunk and many leaves (that is VERY VERY VERY VERY long and boring. Be patient and concentrate) for the second to last stage.

Finally, I cut off the trunk to avoid the problem of "root tentacles" and plant my tree into the ground, and I adjust form of the foliage that the tree is less deformed (but not perfectly symmetrical so far), I change the palette of the trunk into something darker and more green (to fit better with the foliage), and I don't forget the foliage because of the shade to the trunk. I pasted one of my tiles herbs below to test how the colors work together, but I was too lazy to make the shadow of leaves on the grass (look at the screenshot Rudora no Hihou, they do it better than me anyway).

A final remark: here I am allowed work separately on the foliage and trunk because I had a very dense foliage that completely obscured the branges. Logic would dictate that you first draw on all the branches of a tree (its "skeleton") before adding the leaves, and this is what to do if your trees are bare.

3. Going to the beach!

Let's look now at some sunny tiles, starting with a sand tile. Keep the same approach as before look closely at the images below:

The games present this time are: Alcahest, Bahamut Lagoon, Rudora No Hihou, Seiken densetsu 3, Star Ocean, Sword of Mana

--

If your observations were successful, you will have noticed that the sand tile is much easier to achieve than the previous ones, and that most of the tips given for the tile of grass are also valid here (use multiple tiles, be careful to break the grid, and find a compromise between size and readability). Most of the tiles (especially the most successful, particularly those of Seiken Densetsu 3 and Sword of Mana) are mostly made of a solid one color, with small undulating dunes. Also note that small dithering patterns are fashionable for sand tiles to give a grainy texture.
As for palette, we must be careful to avoid retina-wrenching yellow, and not hesitate to use tons of creams (Seiken Densetsu 3) or brown (Rudora no Hihou). If you soften the reds in your paletter, you get a nice sand lit by the sun.

4. Sea, Sex And Sun!

We'll conclude our short list with water tiles. There are lots of ways to deal with them (well, more than grass anyway) so you'll have a big job if you want to analyze them all. For me, I'll try and touch on the important parts. These are the images:

The games are represented here: Alcahest, Bahamut Lagoon, Chrono Trigger, Rudora no Hihou (2 times), Terranigma, Star Ocean, Sword of Mana, Tales of Phantasia.

--

The tiles and Sword of Mana Tales of Phantasia are the most minimalist of the lot. They make little use of color, and illustrate perfectly the first point I want you to notice: water almost transparent, generally the same color as the other objects in the scene. Let me explain: look at this picture of Lake Fabregas (in the Pyrenees). The surface of the lake primarily just reflects the mountain. You see a mountain's face down on the ground, so you conclude that there is a body of water where the mountain is reflected. Although it is difficult to reach such extremes in a map tile (although it should be tried), I think you understand the idea, seeing that water is Tales of Phantasia a blue one which spreads out the colors of the overhanging branges. Similarly, Sword of Mana has a whole range of different depths, by playing with the palette used. The more dark and opaque the water is, the greater the distance between the bottom and the surface. Finally, looking a little the other screenshots, you will notice that it is not uncommon to see reflections of cliffs, especially in Rudora no Hihou.

--

The tiles of Chrono Trigger and Bahamut Lagoon are the least successful of the lot, and are not examples of what not to do (except for the waterfalls). Their textures are weak on color and limited to smearing edge information, so that if the Bahamut Lagoon water was not blue, it would be very difficult to guess that it's water at all (your textures should be recognizable in black and white).

In contrast, Alcahest, Terranigma and Rudora no Hihou (the one in the cave) are far more evocative textures, with soft, rounded, antialiased patterns. Look at this detail of screenshot Rudora no Hihou and watch how the curves of the texture undulate on the surface of the water.

I saved the best and the hardest part for last: sea water and waves. It is common to represent sea tiles using one or two very bright colors to draw the crests of the waves, forming a sort of framework that defines surface of the water. Then we must fill this frame using the darkest color, and do not forget to choose a light source (the waves are anything but flat!). Below, my personal attempt after an observation session. I tried to keep the system of discrete peaks, but I think the final result lacks some personality. The opposite extreme is Zelda: Wind Waker, in which the sea is limited to just this grid system (but the result is excellent!).

5. The great secret of life and death

We have now finished with the tiles, and this course is nearing completion. I hope it has been helpful to you, and your games will now be a little more beautiful.

I would like to conclude by giving you one last piece of advice, and is undoubtedly the most important that you find in these 8 chapters: learning as you progress. Pixel-art is an area where you can become very good without any kind of talent and without being a very gifted artist with more traditional media (drawing, painting ...).

Perseverance and hard work are a winning combination every time, if you think a little and apply yourself. Laziness and inattention, on the other hand, are a losing combination. Only by doing tileset after tileset and character after character will you excel in this field. Do not expect miracles over night; it's a slow and organic process, but eventually you'll notice that your recent work is better than the work you did several weeks or months before.

For proof, I will leave you with a picture illustrating my own progress between 2006 and 2008. Practice is the key!

Table of Contents