DevDiary #003: Crafting visual Illusions

Welcome back to the Monster Workshop! The character is now modeled, but it's time to simplify it for a smooth in-game performance! Stay tuned as we break down the process of crafting a leaner 3D model while keeping our spirit's soul intact.

In the first part of the monster factory, the character was created three-dimensionally with a high degree of detail. The free sculpting of the character model made it possible to design the character with great attention to detail. However, it now has a very finely meshed and unstructured surface, which is why "re-topology" is necessary.

In short: A less detailed version of the mesh has to be rebuilt with the sculpture as the basis. The actual anatomy of the musculoskeletal system is taken into account in order to be able to represent realistic movements later. The picture shows the low poly mesh in yellow, with the high poly mesh in orange as overlay.

Baking the Normal Map

To maintain a high level of detail without loss of performance, normal mapping is used, a method developed by Krishnamurthy and Leroy in the late 1990s (Source: Stanford Paper as PDF), revolutionary for the look of video games. The detailed high-poly information is transformed into a texture (the normal map) and then projected onto the low-poly mesh.

The Normal Map is then used in the lighting calculations to create the illusion of details. This approach thus sacrifices memory (nowadays inexpensive) for much better runtime performance. Almost every current game uses this method. You can recognize the normal maps by their typical purple coloring.

In the purple image on the right you can see a compilation of different normal maps - among them the one of one of the ghost urns, one of a belt buckle and one of a demon dagger. Below, in the center, you can see the normal map of the veins around the conjurer heart, which can also be seen as a mesh in the picture above.

UV Layout as preparation for Texturing

In order to project the normal map (and later the texturing results) onto the surface of the mesh correctly, a further step is required. The 3D model must be "unwrapped" to create a flat plane. This is easy with a cube - everyone has done this elementary school. For a humanoid body it is logically more complex.

A clean topology helps to find the right places to "cut open". Once the surface is spread out, you can specify how each texel (texture pixel) is to be mapped onto the mesh, using the texture coordinates U and V - creating the "UV layout". The following image is the UV layout of a human character - the head on the left, the body on the right. Areas that are rather irrelevant tend to be rendered smaller, while important areas - such as faces - are comparatively larger.

Perfect Illusion through Texturing

Now the normal map and the color texture can be applied to the mesh. In render mode, the low-poly mesh now looks just as detailed as the sculpted original - however, it's just an illusion. According to the same principle, reflections, roughness etc. can be simulated with further texture maps. The 3D model is complete now.

Our next article will describe how the character is brought to life - among other things this will require a skeleton.

Are you interested in news about our game Soul Helix AR? Follow us on Facebook, Instagram and Twitter and sign up for the newsletter!