Our Rendering Engine - Shaders and Materials

This week I want to share a few details about the technologies driving our games. We rely heavily on multiple open-source technologies, most notably on the Scala language and on the three.js rendering engine. Today I want to talk about the latter.

Three.js

Our rendering engine is based on three.js, which we have ported to Scala using ScalaFromJS. We previously tried using a different Java rendering engine, but it was quickly aging and receiving almost no updates compared to Three.js. The initial port took several weeks, but porting individual releases is usually a matter of a day or two.

We are very pleased with this decision. Three.js is highly mature, feature-rich, and easy to extend or customize. I want to commend its developers for their outstanding work, and I am proud to have contributed several minor fixes to the library, particularly in the areas of lighting, cascade shadows, and TypeScript definition files.

One particular area I would like to mention is our shaders, as their development in three.js was really an enjoyable experience.

Wood shaders

After some experimentation with various possible wood shaders, we decided to base our work on one particular wood shader by Chris Brown.

One of our first early screenshots based on this shader is this:

Combined with three.js MeshPhysicalMaterial capabilities and environment mapping, this eventually led to the look you can see in our screenshots and videos today. We are able to adjust paint layer properties to represent various kinds of wood finishes, including various degrees of lacquering and polish.

Terrain shaders

Our terrain shaders are based on sandpaper variant of this GRAPROG Finals shader.

This was later combined with normal and displacement maps. A few development screenshots show various experiments made during the shader development:

I guess this is enough about shaders. In some of the next installments I would like to dive into the details of how we use Scala in our development process. Stay tuned!

We would love to hear your feedback on our forums, you can find the link in the footer below.