2D Game Depth

2D Visual Depth

One of our first challenges was giving the game “depth”. We are working with a 2D Top down view and the entire game is 2D, so how do we make it feel less flat?

Adding details to the corner walls including and yellow tape helps bring the eye towards the center of the room and fills in any corner. When we fill in the details of the room we also try to keep things near the walls.

Lastly we light the room in a way that encourages the player to use their flashlight to look around. Adding small environmental FX

It all boils down to this:

• Floor Tile Details: corner tiles that intersect with wall, and yellow tape
• Corner Objects: objects that fill in the walls with further detail and help with the forced perspective
• Lighting: Making the room sparsely lit helps with the immersion and eases the forced persepctive

“3D” Lighting Shader

One of our biggest issues with lighting a 2D game that mimics a 3D perspective was the inconsistent lighting. We solved that by creating a custom shader that would take in the object’s height and boundaries to determine how the light would interact.

For those curious on the technical details, we take the light position _GlobalLightPosition and the object position Y and use a smoothstep function ot create the illusion of shadow. Below the threshold of _ObjectHeight the smoothstep kicks in and the object can be lit. If the light is entirely beneath the Y threshold (beneath the object) then it can be fully lit.

This went through a few iterations using the object position and scripts to determine object height and player flashlight position. There are some limitations when you have many objects in a scene pointing to the same Shader and sharing object properties in Unity. Using an “object” node would allow us to get the object bounds and automatically calculate the height of any object, but it would require to have a specific shader / material for each object.

Alternatively having a script that sets these properties on load allows us to use a single material on all objects, setting custom heights to each one manually if necessary.

We are still missing “shadows” that move below the object as the player toes around. Unity’s 2D shadow system (as of writing this article) is very limited and has hard edges with weird visual glitches if the light enters the object frame.

A simple solution we found was to create the shadows manually as cut-out alphas and have scripts on lit objects that rotate in the opposite direction of the light. This can be achieved in the shader but would introduce different problems down the line. For coop gameplay each player flashlight would influence the shadows on their own client and not others.

So we continue to explore other elements to make the game more immersive and with more visual depth.