Introduction
Oftentimes when a videogame has a skewed, overhead point of view, we call it isometric. That’s rarely the accurate term, though, and it’s not just pointless semantics.
Projection basically means taking a three dimensional object and displaying it on a 2D plane (i.e., a screen). There are various ways of accomplishing this, and each technique has a deep impact on a game’s look and mechanics. The advent of 3D games and free-floating cameras somewhat lessened this role, but being aware of the pros and cons of each projection type is still applicable to both 2D and 3D titles.
So what exactly are these projection types? Well, let’s take a look.
1. Orthographic Projection
Orthographic projection relies on a lack of perspective and a consistent relationship between its axes. What this basically means is that things don’t recede (i.e., get smaller) as they get closer to the horizon because, well, there is no real horizon. Also, the ratios with which the axes (x, y, and z) are foreshortened and rotated are consistent across the board.
A side-view Orthographic projection is often simulated in platforming games, showing a scene as viewed through the player’s eyes. Moving the “camera” up a little and slightly pointing it down gives us the top-down view, and moving it all the way over the player character’s head results in a bird’s eye view.
These views are pretty prevalent in 2D games, especially since so many of them rely on blocky tiles, but they usually end up breaking a few projection rules. This is done in order to add variety and the illusion of depth without the use of scaling (a computationally expensive process by which sprites are shrunk or enlarged).
It could be argued that a top-down view is 3D, but its height (y-axis) and depth (z-axis) occupy the same space. This type of view also fails to fully display three sides of a box, which can be easily accomplished by rotating the camera to the side and creating an Axonometric projection.
Axonometric projections are pictorials, which basically means that they try to show all three dimensions of an object. There are three basic types of Axonometric projection, and the easiest way to tell them apart is to draw a circle around the corner of a cube where the three axes meet. This will give us the three angles between the axes, which, in turn, can be used to identify the projection type.
Axonometric projections is not how a human eye functions, though, which is why using it presents a few issues. Namely, the depth and elevation of a landscape can blend together. Still, any rough edges can be smoothed over — art/level design can prevent architecture from wrapping around on itself — and the end result is often fairly intuitive.
In a way, these workarounds are almost a shame as Axonometric projections allow for the creation of layouts that could not possibly exist in real life, but only a handful of videogames have taken advantage of this concept. Ironically, games often strive for a unique style and hook, so it’s surprising that so few of them have tried to emulate M. C. Escher’s paintings for aesthetic and gameplay purposes, but I digress.
Here’s an overview of the three types of Axonometric projection:
-
Isometric
In an Isometric view, the scale of all three dimensions — x, y and z — is identical, and the angle between each axis is 120 degrees. A cube projected isometrically will retain its proportions, meaning that its width, height and length will be of identical size. Also, all three faces of the cube will contain the same surface area.
This is actually a lot harder to do on a computer than one might think. Raster-based screen displays tend to use square pixels, but only rectangular ones are inherently suitable for drawing angles that are multiples of 30 degress. A line drawn at a 30 degree angle has a 2:1 ratio between its width and height. However, drawing this line pixel by pixel, 2 pixels to the right and 1 pixel up, will not result in a 30 degree angle. High resolutions and anti-aliasing overcome this limitation by slightly distorting the line, but older games didn’t have that luxury. Instead, they used Dimetric projection.
-
Dimetric
A Dimetric view is very similar to an isometric one, except it’s a bit more loose with its restrictions. Only two axes must be proportionally foreshortened and result in an identical angle (doesn’t really matter what the value of this angle is), while the third one is simply based on the remainder. This is the projection type that’s most often used in videogames and pixel art.
Although Dimetric projection allows for various combinations of angles, the most common one is, roughly, 26.5 degrees from the horizontal plane. The reason for this is that it represents a neat 2:1 ratio — for every two horizontal pixels, we draw a vertical one. This makes it very easy to keep track of proportions and align objects.
-
Trimetric
A Trimetric view retains the sense of symmetry found in Isometric and Dimetric projections, but it’s a bit more stylized. The angles between all three axes are different, and, as a result, each axis is also foreshortened by a different amount. This results in a pretty distinct look that has a clear angular bias, e.g., a building “pointing” up-left will look quite a bit different from a building “pointing” up-right even if the two structures are identical.
The advantages of Trimetric projection were clearly kept in mind by Maxis when the team was creating SimCity 4, and Paul Pedriana wrote a nice little article about it.
As an interesting side-note, all Orthographic projections follow a strict set of rules, making them very easy to do in 3D games (provided that the camera is locked at a specific angle).
2. Oblique Projection
Oblique projections are actually very similar to their Orthographic counterparts. Both techniques utilize parallel rays, but with one small difference: Orthographic rays hits the “canvas” at perpendicular angles, i.e., 90 degrees, whereas Oblique rays hit the canvas at angle between 0 and 180 that’s not 90 degrees. This results in completely arbitrary scaling of dimensions and angle proportions. Simply put, Oblique projections are not sticklers for rules, and the resulting images often appear distorted, e.g., a sphere projected obliquely will appear as an oval.
Due to this “stretching out” effect, Oblique projection hasn’t been very popular in games. It has all the disadvantages of Orthographic projection, and it tends to generally look more awkward. Still, an Oblique projection can create a unique appearance, and one if its sub-types, Cabinet projection, has enjoyed some success in videogames.
Cabinet projection relies on first drawing one side of an object as it would appear looking directly at it (without any scaling or rotation). Once the “full” side is rendered, the other two sides are extended away from it in any direction, usually at a 45 degree angle. The lengths of these sides are also cut in half to help simulate a sense of depth. It’s a fairly simple approach that uses a simple, easy to remember ruleset. It was also first popularized in furniture illustrations, hence the name.
3. Perspective Projection
Unlike the above two projection types, Perspective projection relies on the concept of a focal point. The camera’s angle and position don’t really matter as the entire scene recedes out into the distance (the horizon when looking straight out, the earth’s core in a bird’s eye view, etc.). This is how actual cameras work, which, in turn, are designed to emulate the functionality of the human eye.
In art, there are various ways of doing Perspective projection via vanishing points (visit Scott McDaniel’s site for a pretty thorough overview). These are somewhat artificial, though, as they rely on approximations where straight lines are not available.
Early 2D adventure games followed this approach by using Perspective illustrations for their backgrounds. These were usually all drawn using the same point of view, which made the scaling of characters a lot easier to estimate, i.e., the characters usually got smaller at the top of the screen, and larger at its bottom. Now this technique can easily create some visual oddities, but the low resolutions and consistent scaling factors kept ’em to a minimum.
Games like Grim Fandango and Resident Evil eventually took static views to another level with the implementation of fixed 3D. In fixed 3D, the backgrounds could represent an area viewed from any vantage point, and the entities it contained would be scaled according to its geometry.
Older vector-based games like Battlezone also used Perspective projection, but these were visually quite simplistic. It wasn’t until the advent of 3D games that Perspective projection became popular. These days a large proportion of games are 3D, and nearly all of them employ this technique. Of course all games use drastically different models, textures, shaders, etc., but various aspects of Perspective projection can still play a role in their overall look (namely the field of view, which I’ve mentioned before).
As a final point, despite its prevalence, Perspective projection is still just a projection, and, as such, is subject to certain flaws.
Conclusion
Although all 3D games use some type of projection, shoehorning 2D games into these definitions is is a bit trickier. For starters, 2D games are rarely based on actual projections of three dimensional areas. Instead, they’re artistic renditions, and as such are subject to artistic interpretation. Bird’s eye view games tend to fake perspective — especially on characters — to add detail and personality, while side-scrollers often use an Orthographic projection for the foregrounds and Perspective illustrations for the backgrounds (much like a certain M. C. Escher print).
Following strict rules of projection isn’t necessary for making a good looking game, but it helps. It can also inspire some integral gameplay elements, e.g., Crush or Super Paper Mario.
The well isn’t even close to being dry, either. Some types of projection like Reverse Perspective and Anamorphic haven’t been used in games yet (at least not to my knowledge), and there are plenty of optical illusions and curiosities that could form the basis of some very interesting gameplay elements. It’s a field that’s still largely unexplored in videogames, and it’s ripe for plundering.
What game is the “mile02” screenshot from the first set of examples taken from?
Oh, that’s Phantasy Star IV on the Sega Genesis. It was the last entry in the main non-online, non-gaiden series, and pretty much the system’s crowning JRPG.
An impressive article. Well written and informative. Thanks a bunch. I’ll have to check out the rest of your blog now.
Thanks, glad you liked it.
Fun article! One other game worth mentioning is the classic Zaxxon, from 1982, which took its name from (and was the first game to use) axonometric projection.
simcity is my all time favorite game, my dad even played that game
Thank you for the impressive post about video games and projection. Your post delivered a bunch of fascinating points that I have not considered. I am looking forward to reading more of your website in the future.
Thanks, this article is very clear and informative!
A big thanks for a fun piece of game info.
A bit late, but this was pretty interesting! Top is crystal castle, with the descending slope in the front, genius, – wonder why 10 years newer games didn’t make use of the technique, it looks so dynamic. Axillary perspective often looks veru static and boring
Thank you for keeping this article up all this time, very informative. I remember playing battlezone as a young teenager…I guess that makes me old ;) .