Tutorial
Heading
Feb 25, 2020

Tomb Chaser 1 - Showcase

In this article, I’ll detail how we initiated the projectand progressed towards the final model presented in Decentraland

The mission

Recently, there was the grand opening of Decentraland, where we had the opportunity to participate by contructing some of the lands there.

One of the projects we worked on was Tomb Chaser, a maze where players must follow a ghost to reach the treasure room.

In this article, I’ll detail how we initiated the projectand progressed towards the final model presented in Decentraland.

Resources

  • Decentraland

Tomb Chaser dark preview from inside

The idea

When we began conceptualizing this project, our aim was to recreate an arcade-style game—easy to play yet challenging to win. To achieve this, we drew inspiration from classic games like Zelda and Super Mario.

Ultimately, we drew particular inspiration from the labyrinth design in games such as The Legend of Zelda: Majora's Mask. After closely studying videos of these games, we noted several details that we found intriguing and aimed to replicate:

  • Repetetive textures on the walls to disorientate the player and create a sense of being lost in the labyrinth.
  • The ghost, which serves as a point of reference to indicate player’s location. If the player moves too far from the ghost, they risk losing the game.
  • Using the space to create new rooms, incorporating both enclosed spaces and more open areas to add variety and challenge to the gameplay.

Decentraland limitations

In other articles, we have previously discussed the limitations of Decentraland. When structures are not very complex or when creating scenes with models, there is usually no problem.

However, in Tomb Chaser, we aimed to build a significanylt large structure to allow for more precise manipulation of space. To ahieve this, we incorporated several steps into our pipeline to expedite the process.

For Decentraland, we used Unity to assemble the scene and used a plugin to export it locally for testing. The advantage of using Unity is that its illumination system closely resembles that of Decentraland, allowing us to preview the scene within a game engine.

To speed up the process, we create prefabs that were already prepared with the collider of Decentraland. Throughout this proccess, we gained valuable insights into GLTFs and the Decentraland engine.

For instance, we learned that GLTFs shouldn’t occupy too much space, as the software doesn't handle them very well. Additionally, ambient light penetrates through everything and illuminates the scene uniformly, so creating dark environments requires some creative workarounds.

Floors design

Designing a Labyrinth isn’t complicated; you just need to consider the starting point and the finish line, and then fill in the rest. One of the advantages of Decentraland is that you have a lot of vertical space to work with. You can calculate how much height you have on your land using the formula:

Height in meters = log2(n+1) x 20

Where n represents the number of parcels. Additionally, you can check this Excel sheet for a clearer breakdown for designers: Decentraland Scene Limitations.

For example, with a land size of 25 parcels, we had 94 meters to work with. By dividing the space into different floors, we created different storeys, which later helped in designing the open space rooms.

Exterior of first floor without the exterior
Interior open space first floor

Additionally, we decided to dedicate each floor to a specific theme or set of traps. This approach allowed us to test different abilities of the player on each floor. For example, on the first floor, we focused on testing player’s speed, while on the second floor, we emphasized testing their reflexes.

Textures creation

Once we had the design finalized, it was time to consider the textures. This posed one of the biggest limitations on the platform. Not only is there a limited number of textures available for each scene, but we also had to take into account their size. The maximum size allowed for textures is 512KB.

Pixelated example

To address this constraint, we employed two technique that are the highly beneficial for environment design and greatly aid in optimization: Trim Textures and tileable textures.

A tileable textures is one that seamlessly repeats when placed side by side, without creating noticeable boundaries between multiple copies of the image. This type of texture can be tileable from one, two, or all sides. It is particularly effective for floors and walls. However, if you do not use these textures on large surfaces, you run the risk of having pixelated images. This is problematic because pixelation can quickly degrade the quality of the environment.

With these textures, you don't encounter this problem because you can reduce the texture size without being noticeable. The only thing you have to be careful is creating patterns. If you add something that is not typical (like the sand mountains below), the pattern is easy to spot. One way to bypass this is to make it completely random, which helps conceal it.

Same plane, different size texture

Trim textures are similar to tileable textures, but with a different approach. While with tileable textures, you just have to enlarge the UV sets and you are ready to go, with trim textures, you divide the texture set into smaller textures, tipically squares or rectangles. This makes it easier to scale and manipulate. With trim textures, we can create the small parts of the dungeon without overusing textures.

Example of trim texture to create a column
Example of the trim texture used on the interior assets

Illuminating without light: transparent planes

3D Torch in Decentraland

Before, we have talked about the limitations in triangles, textures and materials. For that reason, one of the most useful things to save on that is to create planes and add transparent textures to them.

This works, for example, with flames, grass, spider webs, among other examples. To use transparent materials in Decentraland from Unity, you have to put the standard material in fade.

Also, I would recommend that the texture be in .png or .tiff format, and to isolate the transparent textures in one texture.

Also, take into account that if your export your textures, Decentraland only accepts .JPG, so it will covert your formats and moreover rotate them 180º.

If you mix the textures, for example columns with flames, and mark the material as a fade, it makes the columns transparent too, and doesn’t look good. So if you are going to add transparencies, annotate them and prepare them in a single texture.

Dark environment in broad daylight

Previously, I mentioned that Decentraland does not currently allow you to place custom lights in your scene. However, we can work around this limitation by using emissive materials.

In this scenario, we aim to create a dark dungeon. To achieve this, first we need to darken the textures. One method is to apply a multiply layer in Photoshop with a dark color. This allows you to paint the model normally and then control the degree of darkness using the multiply layer.

Additionally, since light travels through inverted faces (interior models like walls), we need to create a cover for them to prevent  sunlight from entering the dungeon.

Walls without cover / with cover

Finally, it’s time to add some light. We used emissive maps, but with low intensity. Emissive lighting has the particularity that when intensity is high, it can overpower the surroundings and obscure the models below.

I would also recommend using an emissive map to define where the emissive effect is applied, as we want complete control over our "lights". Additionally, you can add movement to the planes through animation. I would recommend doing this in Unity thought because you have more control over waht you animate, and bones are not neccesary as in other pipelines where you need to rig the mesh for animation.

Dark hallway in Tomb Chaser

Conclusion

All in all, this is a compendium of tips that we have learned while working with the platform. It has been an interesting experience because the limitations pushed us to look for workarounds and tricks to recreate what we wanted to express.

It’s been a wonderfull experience that I can't wait to repeat.

Art
Decentraland
Laura Usón
Creative Art Director

Passionate about videogames, movies and creatures. Artist by day and superhero at night.

Tutorial
How to import Decentraland SkyboxEditor into Unity
Tutorial
Doing a MANA transaction in a Decentraland scene
Tutorial
Canvas (2D UI) Manager in Decentraland