Height Maps not only provide a superior visual result on terrain but on mesh objects too. Compare the following brick wall which includes both a Height Map and a Normal Map, with the same wall using only a Normal Map:
In the above video you can clearly see that the Parallax effect provides a superior sense of depth as compared to the Normal Map-only version.
A Height Map is a single additional texture channel (typically the alpha channel of the Normal Map texture) which determines how far each texel is displaced into the geometry. For parallax on a mesh, pure white (1.0) leaves the geometry unchanged, while any other value pushes into the surface, causing a parallax effect. The closer to black (0.0) the heightmap value gets, the further it is pushed in. Take the following brick texture example:
The reason the bricks look like they are sticking so far out from the wall (or the mortar is pushed so far in) is because we actually have most of the brick pushed forward as far as possible (1.0) and then we push all the mortar back into the polygon (<1.0). There are some limitations to the parallax effect that you will need to work with, and also certain best practices you should employ to get the best results.
Limitations
1. Parallax will get progressively weaker as the angle approaches directly side-on to the camera. In this next video, if you look closely you can see a warping artefact on the top of the brick wall.
2. With a smoothed model, it depends how far the fragment normals deviate from the face normal. When polygons meet at large angles to each other and the geometry is smoothed, the normals (which should face directly outward from the polygons) are still correct near the center of the polygon, but begin to warp noticeably as they approach the edges in order to provide the smooth interpolation. The parallax effect follows the normals, meaning that if the distortion is significant the parallax effect can provide results which differ substantially from the underlying geometry. This is always undesirable.
The simple fix is to avoid smoothing such geometry, however if smoothing is required for other reasons then the parallax outcomes can be improved by further subdividing the geometry to reduce the change of angle at each join.
3. Try to avoid geometry that has a large angle between the two faces as the parallax effect will have a hard time blending between the two.
4. The parallax effect increases the amount of “texture bleed” on untiled textures, even at high-detail mip levels. See the best practices (below) for strategies on avoiding this limitation.
5. The parallax effect distorts significantly if the texels are not mapped “square”. This is easy to maintain for a static model or a rigid animation, but precludes the use of parallax on most skinned animations. UV mapping must be configured such that the width and height of each texel is the same. More on texel ratios here.
Best Practices
• We recommend using parallax on everything… yes everything. You do not save on performance by leaving the height at 1.0. You can make the height map as intense or as subtle as you like but it’s definitely worth applying it to all your assets.
• If you have a large flat surface that could use some depth, more often than not this surface will be perfect for parallax (a height map + a normal map)!
• Tiled textures usually make working with parallax easier. This is due to the parallax effect on the polygon edge wrapping around and not blending onto another part of the texture.
• If making a section of your texture parallax and the rest not then you’ll want to get your depth correct. Anything pure white (1.0) is not parallax. As you fade from just off-white to black, the more depth that part of the texture will have. A little change in color can go a long way so test your grayscale image regularly to get the correct depth you want.
• Use high resolution textures for your parallax effect. (This is also true for normal maps.) Use plenty of texture detail and let the engine deal with texture LOD. Don’t go overboard by using a 2048×2048 texture on a single bolt, but equally don’t make the result look terrible by using a 128×128 texture on a large wall.
click for larger image
• If you have several different parts of your texture being used on different parts of your mesh, for example the texture includes the roof and also the brick for the walls, then you’ll need to make sure to leave gaps in the texture between each “sub-texture” to avoid the parallax effect bleeding into the next part of the texture. You will want to use a padding approach with a distinct inner and outer padding section, and ensure that your UV mapping does not cross into the padding areas.
The outer padding should have an upward gradient and should reach full height (1.0) before the outer edge. This gradient should go all the way round your texture in the outer padding only.
At regular angles, the inner padding is revealed by the parallax effect, but because it’s textured and height-mapped as normal, everything looks fine. At extreme angles the outer padding shows – in theory this means that the viewer may notice the change in height, however at extreme angles, not much meaningful detail is visible anyway. The outer gradient helps avoid the parallax effect bleeding through into the next texture in our atlas, which would be much more noticeable. In the following image, we have colorised the padding to make it visible; this isn’t something that you’d do in your own textures:
Think Outside the Box
If you are having edge warping issues that you just can’t solve, or if you want to ensure that an object’s silhouette maintains the same high detail that is visible in the parallax map, but your actual geometry doesn’t have that much detail, then you may want to just cover up the edge with a few extra polygons. This way you can rely on the superior depth effect of the parallax material for the majority of your model, while avoiding the limitations. Take this for example:
Using actual polygons at the corners of any larger parallax-mapped geometry means that if you see the object from non-facing angles, you’ll
(i) not see any parallax artefacts, because they’re covered, and
(ii) still see a nice silhouette yet you’re only paying a polygon cost at the corners, which is a tiny fraction of the cost of modelling the whole wall in the detail parallax offers.
Software
There are plenty of software solutions out there to generate height maps but one that is free is AwesomeBump. Worth a look if you plan on getting into parallax and PBR materials alike.
Animating steam loco driving wheels bogie