The Indiepinion

It’s …. it’s …. so retro!

I’m working on an isometric tile engine during my leave. Mainly for doing something on my own, digging deeper into XNA 3.0. I’ve never worked on an isometric engine and to my surprise it was fairly easy to draw the tiles correctly. All the data structures and most algorithms still work as if it were a flat tile engine. It’s actually a very clever approach. Imagine that if you take a regular rectangular 2D tilemap and rotate it about 60 degrees. You still render the tiles in order, starting from 0,0 and drawing them row by row – the only real difference is that you draw each tile of a row not just a little to the right but also a bit down. That’s basically it. You get the overdraw effect for free! That means your actors can actually stand behind walls and they will be partially concealed by the wall in front of them.

If you want to learn more about Isometric engines, check these links:

Gamedev.net – Isometric and Tile-based Games

Isometric Projection (reload the page a few times if you, like me, are having trouble getting all the images displayed)

Lingo Workshop – Isometric Game: Part 1 Part 2

YoYo Games – Isometric Game Programming

Isometric Coordinate Calculation (last time i checked the site was down)

And if you want to know where i got these cool tiles from … look here. Most of these tiles were created by David E. Gervais (additional ISO tiles by Henk Brouwer) and are free for non commercial use as far as i understand it. If you want to get more of these tiles, check out the Rogue-style games like Angband, Silmar, TOME, etc. (notice there are often several versions of each, try them all). Don’t be afraid to download them and browse their assets for tile graphics. These are great for getting your tile-based game an initial cool look. Wether you can actually keep these tiles once you publish the game depends on who owns the copyright to these files, so better check with the creator before publishing your game with them.

Of course, once you get the pictures in your engine you’ll probably notice that these tiles are like 32×32 pixels and don’t really scale up on modern 1920×1200 displays. But there’s a solution for that, too. I can recommend the following tools for scaling pixel art up – they were specially created to keep the retro pixel-look without blurring the image but making it look as if it were pixeled in a higher resolution to begin with.

I’ve found that Scale2X gives the best results:

But hq2x also gives nice results:

There are more algorithms but these are the two i found the most practical – simply because they come with a precompiled Windows binary (that is an EXE file for all you non-programmers). You might want to check the Wikipedia page on scaling pixel art for more algorithms and some background. You should also know that these algorithms are made to primarily scale images up by a factor of two or four. So don’t expect these tools to scale your pixel art to widescreen 16:10 format or something like that.