Note the two different styles of isometric tiles. They both have the same horizontal skew, but the edges are different. The second style is to compensate and simplify game development woes in the engineering department for systems using 2d hardware, supporting tiles in multiples of 8. The 32x24 "half blocks" shown below are the standard "unit" for tactical rpg games, and all measurements of height and width are used from this standardized unit. Note the right handed lighting source, giving the left and right walls great contrast, to remove confusion of depth and perspective.

• First, let us consider the basic tile. There are more than one ways to draw an isometric tile. The first style is the most famous style around the net, and is pretty much the basis for all "fad-iso" going on around the net these days. The actual tile is 32 pixels in width, and is 17 pixels tall. The 4 corners are built so that the top and bottom vertices are 2 pixel wide edges, while the left/right vertices are 1 pixel points. This particular style is very useful for illustrations.

The second style is a slight variation from the first, and is built in such a way to make the actual tile more desirable for video game development. Its dimensions are 32 pixels by 16 tall, with rather odd looking edges. It has 4 pixel, flat vertices on the top and bottom and a solid square of outline pixels for its left/right vertices which are 2 pixels tall/wide. Most isometric artist would not really think to draw a tile in this manner, but it is mathematically sound and perfectly suitable for tilesizes in multiples of 8.

Note that if you did use style 1 for game devleopment, your total vertical height would always be 1 pixel taller than an even multiple of 8, so even though it would not affect the map creation terribly, there may have to be a special tile at the top or bottom of your map which is cropped. To the casual game designer with many resources available to him/her, this really isnt anything more than a style/comfort decision, but for those of you who are crunching as much filesize as humanly possible, for example a mobile phone game, stick with style 2.

Below the flat tile examples, you will see what a "half block" looks like. The isometric rectangles are 32x24, in both cases (note the side wall structures had to compensate for the height variance in the "style 1" case. A whole block would be a 32x32 block, or basically double the vertical height of the current block (from 8 pixels tall, to 16 pixels tall). This half-block tile is the most common "unit" of dimension for all tactical rpg type games that have 2d mapping systems. if you ever noted the height systems in these type of tactical rpg's, this is most commonly considered as "1h", or height value of 1.

Okai! this is fun so far, isnt it? ^_^. Ok check out the shading on the half-blocks. It is ultimately your decision where to make your light source come from, but the most commonly used lighting source is actually a side source, coming in from the right hand of the screen. All of the walls faced to the right are the most illuminated tiles on the screen, this includes flat ground tiles, which only get a moderate amount of lighting in comparison. The walls with left facings are our darkest regoins and contrast ever so nicely with the right side walls. also note that the same team of guys made most of the 2d tactical rpg's out there, so take it at face value ^_^. whos to say you cant have lighting from the left? Interestingly enough, if you use a topdown lighting source, you might notice that some of the distinction between left and right facing walls can be lost. Ok i think ive covered everything that needed to be said at this point, lets move on.

Style 2 grid is superior to style 1 grid for game development purposes, due to its mathematically sound nature. Dont dwell too much on how the outlines overlap, because when you skin each tile, there will be no black area left unedited ^_^.

• Right, now lets look at how the basic tile overlaps to create a tiled area of flat land. The first tile "style 1" fits together very cleanly when assembled. Each tile has a 1 pixel vertical and 0 pixel horizontal offset when you assemble them. even with this 1 pixel offset, your total tiled area size is 64x33, which is a bit troublesome for breaking into tiles, but due to the nature of the offset, you could make this chain of tiles N amount of tiles tall, and the pixel height would always remain (N*16)+1 pixels tall in total height. Therefore, it will not significantly affect your unique tile count, save maybe the very top most tiles or the very bottom most (arbitrary), as a portion of the outline would be cut off at the edge, due to its odd height. This can also make overlapping walls a complicated issue, at least more complicated than it has to be, and makes it a bit hard to keep track of your overlays for when you wish to easily cut up your map into tiles.

The second style is perfect in a technical aspect. You do not have to overlap any pixels whatsoever while constructing your surface area, which means that you will have no trouble keeping track (in an engineering or an art mockup sense) of possible overlapping outlines. The tile placement is very clear and drycut. This particular assembly is perfect in width and height, maintaining a 64x32 canvas area, with the perfect 2:1 ratio, reflectng the nature of the slope of our isometric angles. There are no extraneous outlines that will have to be compensated for at the end, and therefore, this is the most memory efficient way to assemble tiles. This also happens to be the exact method that FFTA used for their battle maps, and most likely Tactics Ogre as well. I havent studied Onimusha tactics much, st0vie just picked it up in sept 2004, so we shall be able to study that now as well to see if capcom studied well, or came up with their own mathematical anomaly ^_^.

Top left - A simple isometric tile broken into 4 meta tile regions. Each meta tile is 16x8 and is the basis for all basic map building tiles. Note that hardware might require this be further broken down into 8x8, but that is a coding issue.

Top right - A full isometric block broken into meta tiles. B and D are transition tiles and would require unique tiles to represent the blending of two unique textures. This could become quite expensive if you used unique tiles for every case, so consider building your map with certain limitations in mind if you are so inclined. tile C can be tiled ontop of itself to vary wall height as needed.

Bottom - How flat floor textures blend together, and where to cut each unique tile. Notice how it takes twice as many (4) unique meta tiles to transition two tiles, as opposed to only 2 unique meta tiles to tile a texture with itself.

• Great, now that we know how superior the second style was over the first mathematically, we will be using that style from here on out. Lets take a look on how to break apart an isometric tile into usable rectangular tiles (remember a square is a rectangle).

Because our isometric angle creates a horizontal normal with a slope of 1/2, and the dimension ratio of horizontal to vertical size is 2:1, it should not be surprising that breaking our image into 16x8 base tile sizes, maintaining that same 2:1 ratio, is an appropriate solution. The first image illustrates how an isometric tile can be broken into 4 equal parts, using 16x8 quarter sections. However the problem remains that there is empty space on the edges of this isometric tile. Our solution? First, you have to lay down a specific pattern of blocks and appropriately cut up that image into specific sections, which will be represented as "meta tiles".

Lets look at the full isometric block on the upper left. Each section can be divided into a 16x8 tile, in such a way where those tiles could undoubtedly be repeated in other similar circumstances. The only tiles that would have a lower rate of recycling might be the transition tiles from a flat surface to an edge. Tile types B and D are perfect examples of this. Because your wall tile could merge into a numerous amount of different types of ground textures, shown in example D (or vice versa shown in tile B), you would need a unique tile to represent each transition from every wall texture into every ground texture, UNLESS, you have the luxury of layers, in which case you can keep the data of the floor texture transparent, in tile D, while texturing the wall portion of that tile. Then overlap that tile with a different tile skinned only with the floor portion, and the wall data is left transparent. When overlayed together in game, they will appear to merge as if it were a single tile. This is more of an engineering issue for conservation of memory but i thought i would at least point it out in case there were any engineers snoopin around this joint ^_^. Check out tile C. This is a special wall tile that, if made correctly, could make your wall any height variability you wish, just repeating tile C ontop of itself until the desired wall height is reached. This would only work for a simple flat wall with little to no variation in texture within that wall.

Now check out the bottom image. This is a mockup of instances where one ground texture might meet the next. Note the white bounding box in the middle of the image. This 32x8 tile area is the absolute minimum amount of canvas space necessary to tile a single unique isometric tile, that does not tile with itself when vertically/horizontally flipped upon their lines of symmetry. Notice how each of the four peices of the upper left hand isometric tile peice together in a nice rectangle, which can be split up into two of our 16x8 meta tiles. Note however that you would have to offset each of those tiles by 8 horizontal pixels while tiling to maintain the isometric perspective. Stacking these two meta tiles side by side would certainly disrupt the isometric angle, and would cease their tesselation properties (basically rendering the tiles useless by definition), so make sure that you offset when tiling! Now note the 4 blue, 16x8 meta tiles at the corners of the bottom image. These are the 4 instances where a single floor texture can meet a different floor texture. So in a basic case, texture A meets only texture B on a map, the tileset would require 4 unique meta tiles to blend those two textures together at any corner edge of the isometric tile, yet it would only require 2 unique meta tiles to make each texture tesselate with themselves. All of this is only relevant if the isometric tile textures are tilable with themselves, and this tutorial assumes that they can. Also note that if you use alternating layers to display alternating textures, you can use the same technique in the previous paragraph, using transparency of the unknown area of tesselation to minimize the amount of unique "transition" tiles you would have to make otherwise. This will be explained more in the map building tutorial, but for now, all of the technical issues have been covered ^_^. Hope you've learned as much as i have while reading this!