- How can we extract images from spritesheets? by pisceswolf96
- OGA and License FAQ Update/Changes by capbros
- Gardens of Gonzo - 2D Indie MMORPG for the Creative (Attention, Pixel and Sound Artists!) by Rammy
- Resolution for a 2D html5 canvas game? by prozi
- Project Helena (alpha) Turn-based strategy / RPG by eugeneloza
- OGA-BY 3.0 Evangelism by Redshrike
- LPC/General Licensing Question by Calinou
- Project Slowpaced - An Alpha, WIP first-person shooter by xezno
- Re: Troll Mauler by piacenti
- Re: The Village (NES Version) by Sharkou
- Re: Isometric City by cbscribe
- Re: City Pixel Tileset by VividReality
- Re: Kawaii must die by AlbinoDrought
- Re: Puzzle game art by AlbinoDrought
- Re: Sylvan Waltz (standard + looped version) by Otto Halmén
- Re: Pixel UI pack (750 assets) by patvanmackelberg
Popular This Month
Favorite Submitters This Month
Chapter 3: Perspectives
The issue of perspective in 2D games is a question that comes up frequently, and this is probably why so many amateur games have a lot of inconsistencies in this area. In particular, this chapter addresses typical RPG perspectives, so if you're looking for information about side views or first person, you'll want to check elsewhere. It's important to remember that perspective is "the art of representing three dimensional objects on a flat surface (in this case, your screen) as they would appear to the eye of an observer."
Before starting, I would like to thank Lunn, without whom this section would not be what it is today; it is actually an edited version of a conversation I had with him on the subject.
1. Perspectives -- and why the plural?
Because there are several different kinds! If you've read art books or taken classes, you are probably aware that there are 1, 2, and 3 point perspectives. This is not what we're talking about here, so you can forget it for now. =)
In 2D video games, the the simplest perspective used is called 'axonometric'. What is this beast, exactly? In an axonometric representation of space, an object is represented with 3 coordinates (X, Y and Z) which each increase steadily in a particular direction. In particular, this means that two parallel lines in reality are also in axonometric perspective, and an object's size doesn't change no matter how far it is from the observer. Finally, there are an infinite number of axonometric perspectives, since the artist is completely free to place the 3 directional axes in the directions of his choice. We will look at the 3 most commonly used axonometric projections (see image).
This is called the isometric perspective: the Y axis should be tilted 30° to match the definition of the isometric view, but since it is not possible with a simple pixel art, it is represented by a 1:2 line (see previous chapter) and the angle is only 26.5651 ° (I will spare you the calculation that leads to this conclusion). This view is particularly suitable for tactical RPGs, because it can represent a convincing depth and altitude. It is not suitable maps in traditional RPG creation programs (like RPG Maker) because of the shape of tiles.
This is the planometric perspective. This time, the Y axis is tilted 45 degrees from the horizontal and is a straight 1:1. Very few games use this (the best known of these is Boktai), yet it can be interesting and rich in volume. This perspective should be more widespread, and it is up to you to use it!
Finally, the last (and least attractive too) is the famous 3/4 perspective: the Y-axis has turned to the left, confusing it with the Z axis. This is the view that most RPGs use, and we will discuss it in greater detail.
2. Everything about the 3/4 view
In theory I could stop here, but I will assume that you're not very smart and will show you some examples to go with the words.
Let's start with a simple example: a barrel (this element in any city tileset / town / abandoned mine / home / etc.). What is interesting about it? THE COVER IS A CIRCLE. Not an ellipse, as seen more often. It is like this for two reasons:
- It is a circle in the real game (the cover is round, what).
- It is parallel to the ground and thus viewed from above.
From above, there is no bias. You must apply this to all horizontal planes that are seen from above if you want to do 3/4 consisently.
We'll continue with a more comprehensive example, generously provided by Ody. Above all else, notice that the top of the tower is circular. Also, look at the door, walls and windows. They are, they are ... I'll give you a second ... they are? (No they're not ugly) They're 1 to 1. Again the magic of our 3-axis is at work: the vertical planes are represented as seen from the front, the same way the horizontal ones are.
But then, what happens when we want to represent the vertical plane and horizontal planes? Nothing special. The interaction of the two poses no particular problem. Look at the stone walls by Ody, or the stairs (or the cabinet, or walls) and the superb screenshot Bahamut Lagoon on your left to be convinced. To be brief: the horizontal planes are seen from above the vertical planes are seen from the front.
3. Extension possible vanishing points underground
Well, I hope you have understood so far, because this will complicate things a bit. I told you in opening this chapter would not consider point perspectives. Well, now we're going to mix it up a little. One small visual reminder (see left) is probably sufficient for you to put ideas in place with regard to one point perspective. As you can see, there is a point somewhere (not in picture) that all horizontal lines in a region point to (as long as the picture is taken on flat land, from the ground) -- this is called a vanishing point. You do not need to know more than this for the purpose of this article, but if the topic interests you, I advise you to read this course on perspective drawing).
Let us return to our tutorial -- how will we use these vanishing points? To improve our perspectives! In contrast to the image showing a the château de Versailles (did you recognize it?), the vanishing point will attract vertical lines. Ideally, we would like to fix the point somewhere and draw on top of our map, but this is not really compatible with systems used by tile-based RPGs. The solution is to assign an individual vanishing point to each object of our tileset. It's a bit less elegant, but the result is nice! Here are two screenshots of Golden Sun and Golden Sun 2, which are the only two games using this technique that I know. Shin kindly highlighted some vanishing points of these images.
Note that the vanishing points are all located under the objects (since the camera is facing down from above) and all at about the same "depth" (to keep things consistent). A final brief comment for the road: the further down your vanishing points are, the the closer you get to the standard 3/4 perspective, so that placing your vanishing point to "infinity", the closer you get to pure 3/4 (it's magic, huh?).
Now that you know a bit about perspective, you have no excuse to make mistakes, especially since errors aren't too difficult to correct, and you can draw lines (and vanishing points if you try the Golden Sun method) to help you.