Introduction to Isometrics

Sometimes explaining and understanding a concept is easier with comparisons. With this in mind we will briefly discuss 3D in games in general and then specifically talk about isometrics.

It is rare today to find professionally created games for sale that are not 3D. Even games that are typically only two-dimensional, such as card games, often have some sort of 3D element. As mentioned in Chapter 1, "First Steps," 3D can be applied to a game in many ways. Games like Unreal Tournament use a real 3D engine. A 3D engine can rotate objects and display them correctly onscreen, changing the camera's viewpoint at any time, and uses very detailed z-sorting. Z-sorting is the concept and act of placing one object on top of another to give the appearance of it being in front. (In Flash, the objects we'll work with will be movie clips.) The sequence in which we arrange the objects is called the stacking order. Each object in the stack is at a specific depth assigned by a relative numeric value also known as a z-index. Z-sorting can be applied to several different types of situations including a 3D world (as in this chapter) or the open windows of your operating system.

Courtesy of Epic Games, Inc.

For instance, your keyboard is in front of your monitor, so it has a higher z-sorting number the closer to the game player, the higher the number.) One of the most powerful things about advanced 3D engines, such as the one written for a game like Unreal Tournament, is that they can map bitmaps to shapes. (For instance, the bitmap of a human face can be mapped onto the shape of a head, which is a polygon. When this shape rotates in the 3D world, it appears to be a human head.) With this type of 3D engine, all shapes are rendered (created) onscreen mathematically. There are usually some premade bitmaps, like the human face mentioned above, but for the most part all of the objects are created and moved on the fly. This type of engine is very processor-intensive, and because of the real-time creation of objects, it can limit the game's level of detail.

Early on in the online game world, developers discovered that a 3D world was great for many types of games but that changing camera views wasn't always important. With this in mind, some games were developed with only one camera view an isometric view (the angles of which will be discussed in the next section).

At this point, before we talk more about the isometric view, it is important to note the concept of perspective. Imagine that you are standing on a long, straight road. As you look down this road, its two sides appear to converge far off in the distance. As we all know, the sides of the road do not actually converge way off in the distance. If you were to travel to the end of the road, then you would see that it is just as wide at the end as it is at the beginning. This visual illusion is called perspective. Without perspective, the road would appear to stay the same width, and in fact it would probably be impossible to get a feeling for how long the road is. Perspective helps to give us an idea of an object's dimensions.

Courtesy of Blizzard Entertainment®

The well-known game Diablo II is a good example of a game with an isometric viewpoint.

Games that use an isometric view do not use perspective. Why is this so important? Imagine creating a first-person-view 3D game in Flash. As a car drives by your character, the perspective of the car is constantly changing. New parts of the car are revealed as the car moves by, and eventually it vanishes. As the character with the first-person-view walks down the street, the perspective of every object on the screen is constantly changing. To create a game like that, you would need a true 3D engine. Yes, very limited versions of this can be created in Flash (with highly advanced tricks), but for the most part it should not be considered a realistic possibility not as of this writing, anyway. With an isometric view there is no perspective. This means we can create many different angles of objects, and then place those objects on the screen. For instance, with an isometric view you can create a tree and place it anywhere in the world without having to worry about its size or perspective, since those attributes are never going to change. This is good news for first-time as well as seasoned Flash developers, because it means we can create 3D games without a 3D engine.

A road in an isometric world never converges. But the amazing thing is, it looks great!

There is some controversy over what constitutes a 3D engine. In this chapter I give you equations and functions to handle placing and moving objects in a 3D world and then mapping that onto a 2D screen. To some people this is a 3D engine; to others (usually hard-core programmers) a 3D engine has to be able to handle real-time graphics rendering as well.

Let's recap the main points introduced here:

• An isometric view is a specific camera angle in a 3D world (mathematical specifics are in the next section).

• In an isometric world you don't use perspective. The implication of this is that you can create reusable objects rather than having to render them in real time.

• An isometric view is much less processor-intensive than other 3D views, which makes it more workable in Flash.

Next we will discuss the math, geometry, and trigonometry used to create this view and to display it on a 2D screen (that is, projecting from a 3D to a 2D plane).

I don't mean to discourage anyone reading this chapter from attempting more of a "real" 3D approach in games. With Flash's drawing API and with cool tricks (which you can find on the Web or develop yourself), you can accomplish some amazing things. In fact, I have been working on something of my own a car-racing game that wasn't finished in time for this book. If you are interested in seeing this game, it will probably be on my Web site, Electrotank (www.electrotank.com), sometime in spring 2003.