Sprite Art 101 - Brick Wall I

I love brick walls. Not because they are easy to sprite, but because there is so much you can learn from them. In fact, there's so much you can learn from brick walls that this is a three part series. In this tutorial, you're going to learn how to make a perfect, black and white brick wall. In the next tutorial in this series you will learn to color it, and finally, in the last part, how to take a hammer and make it look beat to hell.

Before we get started, here's an example of the abused brick wall I did earlier.

sprite_bricks_tutorial_1.png

At the end of this series, you will be able to do this and much more.

Previous Sprite Art Tutorials

Stop! Hold on a second. This tutorial is the first in the Brick Wall series, but the third in the Sprite Art 101 series. If you haven't read those two tutorials, you may want to take a moment and do so. This tutorial builds on things already explained there.

The Brick Wall Framework - Putting in The Mortar

We start exactly where bricklayers don't. With the mortar. You know, that stuff between the bricks that holds it all together. We're going to make the mortar and then slip in our bricks. The mortar is extremely important. It helps us make the brick wall tile to, well, tile properly. Let's take a look at the above example and see how it tiles.

beaten_brick_tiled.png

As you can see it tiles pretty well. After being repeated four times, all the sides get a chance to match up with the other sides. All the bricks fit together nicely.

Drawing The Mortar

Our mortar is black because we assume it to be back far enough that the light doesn't hit it. Here's what it looks like :

mortar_single.png

This may not, at first, look like a complete tile. However, the mortar has been arranged in such a way that when it is tiled, each brick that has a missing part matches up with another brick that has a matching part. Here's what it looks like tiled.

mortar_tiled.png

Wow, like magic. Well, not really. To see exactly how this works, I've numbered each brick and traced a blue line around the edge. Here's what it looks like by itself.

mortar_single_2.png

And here it is tiled again :

mortar_tiled_2.png

The Perfect Brick Wall Tile

At the beginning of this tutorial I said we'd be making the perfect brick wall. By perfect, I don't mean "the best brick wall tile ever made". I mean spotless. We get to poke holes in it in the third tutorial of this series.

By using the same principles of highlight and shadow discussed in the previous two tutorials you can easily give the wall depth. Here's what it looks like :

brick_wall_single_perfect.png

And here it is again, but really big so you can take a good look at it:

brick_wall_single_perfect.png

See, it's just the raised blocks you learned about before. I know, I know, it's in black and white and the first example is color. Well, that's in the next tutorial. For now, take a look at the perfect brick wall tiled :

brick_wall_tiled_perfect.png

Conclusion

You now can apply what you've learned to making black and white brick wall tiles. But, more imporantly, you now understand how tiles, well, tile. In the next tutorial, you will learn how to pick colors for shadow and highlight colors and bring color to your brick wall.

What Next?

Something Easier?

Add a New Comment
or Sign in as Wikidot user
(will not be published)
- +
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution 2.5 License.