September 5, 2014 at 11:483D mode in Diablo 2
- Transfer
This is a translation of the Don't Starve, Diablo - Parallax 7 post from Simon Schreibt's February 25, 2014 blog post.
Caution, heavy gifs.
In the 90s, games began to move from 2D to 3D. If a UFO then visited the earth, the aliens would have decided that the low-poly models used at that time without any filtering were not needed by anyone, and would have destroyed the Earth.
Over time, of course, they would learn what made people special: even in the 2D era, they had an incredible desire to render in 3D, even though it was simply impossible then! It all started with the implementation of the parallax effect (depending on the "distance", some elements moved faster than others). This parallax effect blew people’s brain back in 1982:
Game: Moon Patrol source: YouTube
Indeed, it is interesting that several planes moving in different ways create such an impressive effect. But it looks a little flat, right? A promising camera above the surface of the earth would have looked better, but this can not be done without the use of "real" 3D? Ok, we’ll use the time machine and move into the SNES era:
Game: Moon Patrol source: YouTube
It looks like 3D, but it's not 3D! This is SNES technology called “ Mode 7 ”. To visualize it, Nintendo manipulated textures (decreasing height in favor of depth) using some kind of programming magic. Here are the words of someone who knows how to use it (he talks about Gameboy Advance , but as far as I know, the recipe is also suitable for SNES):
By the way, even today, some people are crazy about Mode 7 and use it for projects with RPG Maker . Impressive!
Today, you can render each resource in "real" 3D to give volume, but there are examples where this is simply not necessary. In fact, it is sometimes even better to use an old school:
Source: Don't Starve
All bushes, trees and enemies in Don't starve are flat. I think it looks cool!
For me, Diablo 2 (2D ARPG 2000) was the first game that combined the parallax effect from Moon Patrol and something similar to the Mode 7. approach.
Let's look at the game with the standard settings. Pure 2D. No prospect. No parallax:
Source: Diablo 2
But the game had "Perspective Mode." Let's turn it on! Note that the pegs cover different pixels on the ground at different times:
Looks like Don't Starve, but remember: Diablo 2 is a 2D game! There was no official information about this mode. Everything you read now has become known thanks to the excellent tools / documentation of Tom Amigo and Paul Simari . Special thanks to Paul for answering all my questions and supporting me in many ways.
It might seem that Blizzard programmers just somehow moved the sprites, but if you compare the game with the perspective mode turned on and off, and you don’t have to move around, it will become noticeable that they, in fact, shifted everything relative to the horizon.
If you replace the earth texture with a beautiful chess texture, you can see even better: I
mean, think about this: each resource in the scene had to be transformed in some way so that it looked promising without gaps at the borders of the sprite. Especially considering the number of sprites in the scene (the chance to get gaps was great enough ...):
In this case, the game code should not have been too confusing! So please keep in mind that Blizzard divided sprites into 32x32px pieces . Download only those parts of the picture that are necessary - it looks like optimization. Plus, it becomes useful when you need to apply a transformation. See how sprites are divided in the game:
Source: D1 format by Paul Simary
I drew lines on the transparent texture every 32px to show a false grid. The result exceeded my expectations! As the vertical lines show, the sprite has a “real” vanishing point deep in the ground (what you could expect from a perspective):
However, I don't know why the bottom edge is so curved. This is not necessary for the prospect (there is a scene from 3ds Max below, showing that if the camera does not rotate around its axis, then the horizontal lines remain straight):
In any case, the Blizzard wizards know why they did it. Maybe it doesn’t cost anything, but such a deformation depends on the “angle” at which you look at the sprite (player / camera position). See how the bottom edge straightens:
Here is a screenshot for those who are interested in distorting the checkerboard texture:
If you think that this is all interesting enough, then read on and think about it. Paul writes that sprites may have some sort of orientation value. Depending on this value, sprites are distorted in different ways (yes ... even harder)! Here's an example: the wall has directions (Left edge, upper edge, left lower edge, etc.)
Source: DT1 format by Paul Siramy
Let me demonstrate how (in my opinion) this is done. The following image shows a standard ISO view. Below are the steps that I took to make the sprites “promising”. I had to move them, scale them and double deform them to achieve this effect.
As you can see, the transformation in my mind is a bit confusing. Let's see how this is actually done in the game:
This sprite is oriented differently than in the example that I mentioned earlier. Look, the deformation is completely different! The upper and lower boundaries do not bend anymore, instead they seem to “look” at the vanishing point on the left. Again, let's look at an example of how it looks in 3ds Max:
Apparently, the game exaggerates distortions to avoid gaps between sprites and it seems to me pretty successful, because each sprite of the fence works great. Please note that the direction of the faces (upper and lower) varies depending on their location:
The following example shows how important the orientation value of sprites is. If you just say to the game: “this is not the left wall, but the right one”, the time for cracks comes:
This mode could only be activated in full-screen mode with D3D (Diablo 2 also supported Glide and Software Acceleration modes), which made me try to deal with the old DirectX documentation without success.
So ... our journey ends here, and I hope you are impressed with this example of a thirst to make 2D look like 3D just like me. The lack of official information and the lack of official statements on this subject (look at the government website, there is nothing on the topic “Perspective mode in Diablo 2”) led me to the inevitable conclusion:
These are all alien technologies!
Tools used:
Thanks to Hans Wurst for this wonderful article on image distortion, it almost looks like Diablo 2 (with perspective mode enabled). I don’t know, maybe the D2 programmers used this information, but it looks very familiar.
Caution, heavy gifs.
In the 90s, games began to move from 2D to 3D. If a UFO then visited the earth, the aliens would have decided that the low-poly models used at that time without any filtering were not needed by anyone, and would have destroyed the Earth.
Over time, of course, they would learn what made people special: even in the 2D era, they had an incredible desire to render in 3D, even though it was simply impossible then! It all started with the implementation of the parallax effect (depending on the "distance", some elements moved faster than others). This parallax effect blew people’s brain back in 1982:
Game: Moon Patrol source: YouTube
Indeed, it is interesting that several planes moving in different ways create such an impressive effect. But it looks a little flat, right? A promising camera above the surface of the earth would have looked better, but this can not be done without the use of "real" 3D? Ok, we’ll use the time machine and move into the SNES era:
Game: Moon Patrol source: YouTube
It looks like 3D, but it's not 3D! This is SNES technology called “ Mode 7 ”. To visualize it, Nintendo manipulated textures (decreasing height in favor of depth) using some kind of programming magic. Here are the words of someone who knows how to use it (he talks about Gameboy Advance , but as far as I know, the recipe is also suitable for SNES):
“The GBA has no hardware capabilities to render 3D, but you can fake it if you intelligently control the scale and transitions of REG_BGxX-REG_BGxPD for each line,” Cearn
By the way, even today, some people are crazy about Mode 7 and use it for projects with RPG Maker . Impressive!
Today, you can render each resource in "real" 3D to give volume, but there are examples where this is simply not necessary. In fact, it is sometimes even better to use an old school:
Source: Don't Starve
All bushes, trees and enemies in Don't starve are flat. I think it looks cool!
For me, Diablo 2 (2D ARPG 2000) was the first game that combined the parallax effect from Moon Patrol and something similar to the Mode 7. approach.
Let's look at the game with the standard settings. Pure 2D. No prospect. No parallax:
Source: Diablo 2
But the game had "Perspective Mode." Let's turn it on! Note that the pegs cover different pixels on the ground at different times:
Looks like Don't Starve, but remember: Diablo 2 is a 2D game! There was no official information about this mode. Everything you read now has become known thanks to the excellent tools / documentation of Tom Amigo and Paul Simari . Special thanks to Paul for answering all my questions and supporting me in many ways.
It might seem that Blizzard programmers just somehow moved the sprites, but if you compare the game with the perspective mode turned on and off, and you don’t have to move around, it will become noticeable that they, in fact, shifted everything relative to the horizon.
If you replace the earth texture with a beautiful chess texture, you can see even better: I
mean, think about this: each resource in the scene had to be transformed in some way so that it looked promising without gaps at the borders of the sprite. Especially considering the number of sprites in the scene (the chance to get gaps was great enough ...):
In this case, the game code should not have been too confusing! So please keep in mind that Blizzard divided sprites into 32x32px pieces . Download only those parts of the picture that are necessary - it looks like optimization. Plus, it becomes useful when you need to apply a transformation. See how sprites are divided in the game:
Source: D1 format by Paul Simary
I drew lines on the transparent texture every 32px to show a false grid. The result exceeded my expectations! As the vertical lines show, the sprite has a “real” vanishing point deep in the ground (what you could expect from a perspective):
However, I don't know why the bottom edge is so curved. This is not necessary for the prospect (there is a scene from 3ds Max below, showing that if the camera does not rotate around its axis, then the horizontal lines remain straight):
In any case, the Blizzard wizards know why they did it. Maybe it doesn’t cost anything, but such a deformation depends on the “angle” at which you look at the sprite (player / camera position). See how the bottom edge straightens:
Here is a screenshot for those who are interested in distorting the checkerboard texture:
If you think that this is all interesting enough, then read on and think about it. Paul writes that sprites may have some sort of orientation value. Depending on this value, sprites are distorted in different ways (yes ... even harder)! Here's an example: the wall has directions (Left edge, upper edge, left lower edge, etc.)
Source: DT1 format by Paul Siramy
Let me demonstrate how (in my opinion) this is done. The following image shows a standard ISO view. Below are the steps that I took to make the sprites “promising”. I had to move them, scale them and double deform them to achieve this effect.
As you can see, the transformation in my mind is a bit confusing. Let's see how this is actually done in the game:
This sprite is oriented differently than in the example that I mentioned earlier. Look, the deformation is completely different! The upper and lower boundaries do not bend anymore, instead they seem to “look” at the vanishing point on the left. Again, let's look at an example of how it looks in 3ds Max:
Apparently, the game exaggerates distortions to avoid gaps between sprites and it seems to me pretty successful, because each sprite of the fence works great. Please note that the direction of the faces (upper and lower) varies depending on their location:
The following example shows how important the orientation value of sprites is. If you just say to the game: “this is not the left wall, but the right one”, the time for cracks comes:
This mode could only be activated in full-screen mode with D3D (Diablo 2 also supported Glide and Software Acceleration modes), which made me try to deal with the old DirectX documentation without success.
So ... our journey ends here, and I hope you are impressed with this example of a thirst to make 2D look like 3D just like me. The lack of official information and the lack of official statements on this subject (look at the government website, there is nothing on the topic “Perspective mode in Diablo 2”) led me to the inevitable conclusion:
These are all alien technologies!
Tools used:
- MPQ Editor (to extract DT1 files from MPQ) by Tom Amigo
- DT1 Tools (to extract PCX files from DT1) by Paul Simary
- DT1 Tutorial (for understanding the DT1 format) by Paul Simary
- GIMP (for editing / saving PCX files)
- Diablo 2 Map Editor (for understanding D2 maps) by Paul Simary
Thanks to Hans Wurst for this wonderful article on image distortion, it almost looks like Diablo 2 (with perspective mode enabled). I don’t know, maybe the D2 programmers used this information, but it looks very familiar.