The levels of Rest in Jelly are drawn first on Photoshop, and then they are adjusted to generate the assets the game needs. In the following video you will be able to see a timelapse of this process. Ah, and it’s a world no one has seen before.
Before we start splitting the level in parts we need to adjust some elements like lighting or color grading. Sometimes we need to modify some elements for gameplay needs, for example to reduce the contrast of a decorative element. In the video we add a new layer with very little opacity that we will paint with black to “cast” a shadow on Jack when he runs these zones, like a fake shadowing effect. This little effect helps to integrate the environment and the player’s character.
Once the corrections are made, the next step is to split the map into different images depending on its role and z-position:
Torches: Separated to reuse the sprites
Background shading: The light/shadow the torches cast is custom made for every level
The player: Jack, obviously
Liquids: Water and lava, the places where Jack will die drowned
Decorative elements: Lots of little elements like beams, columns or smoke
More decorative elements: Some elements like columns that are shown over the terrain
Blood stains: Every time Jack dies will leave blood stains
Atmospheric effects: Fog, blizzard and other climatic elements
Lightning: Torches and other light sources are in the foreground to maximize their effect
This list is a generic one. In reality we have a lot more layers because some levels have special elements. A good example in this case are lamp chains. The player can jump on a lamp and it will fall in the lava. This forces us to have two versions of the sprite, lighted and not lighted. In the case of lamps it’s worse, since they have shading effects that need to be hidden when they fall. That’s why we need yet another layer with these shadows in it.
Now it’s time to open Unity3D and start placing all the items. First step, configure the sprites correctly to assure the final game will not weigh too much by setting the max size and generate mipmaps in the import settings.
To go faster we start by copying the level art folder from another scene and then replace the sprites. At the moment we have 64 sorting layers to be able to set accordingly the depth and lighting that we are looking for.
For the lava we use prefabs with different lava sizes and we adjust the width and height. We do the same with the lava smoke. Once all items are in position we have to tediously place aaaaaall the lamps. To place the lamp shading layer, we adjust its position using the chains as a reference. We add a pivot point of a gameobject to be able to reproduce the falling animation to the lava.
Finally, we have to add the gameplay elements and other little details and it’s done!