2D with a little Depth, as a treat


We want our games environments to look alive, and we can’t really do that with just flat images no matter how nice the art is to look at. A flat look just isn’t enough for our little bunny to run it.

One major contributor to depth is parallax, where things move at different speeds relative to the camera based on how far into the background they are. One way to achieve a parallax effect in a 2D game is to create a script that moves a layer of objects based on the movement of the camera, though that only really works for simple tiled backgrounds that don’t need to match up with each other or with mechanics essential to the game.

So instead of using code to simulate depth, we’ll just cheat and use the third dimension itself :P

A camera in Unity can function in a couple different modes, Orthographic, where regardless of how far away from the camera something is it will always appear as it’s true size relative to the canvas, and perspective, where things become smaller and move more slowly on the canvas the further they are.

Take this Concept by Xin for one of our environments. Very beautiful. To put this into the game each element in this painting needs to be separated into it’s own layer, and the environment reconstructed into the scene like putting together a puzzle.

Once all the pieces are where they should be relative to each other in terms of vertical and horizontal placement, it’s time to spread them out! Why simulate a 3D look and not just hijack the third dimension itself. And as a bonus, since the camera is in perspective mode and the pieces are actually spread into depth, every element will also scale by distance. The third dimension also allows us to twist and turn any element so that one side is closest and another further from the camera.

The final result is subtle but it brings everything together, especially once lit but that’s a story for another post :P

  • Grem

Get The Everdream

Leave a comment

Log in with itch.io to leave a comment.