Collaborative Project: 2D Lighting

This was my first attempt at using a 2D lighting system, and I found the process to be both challenging and creatively invigorating.

To first understand how to implement 2D lighting systems, I watched a handful of tutorials, collected below.

Brackeys, 2D Lights in Unity!, Available at <https://www.youtube.com/watch?v=nkgGyO9VG54>, accessed on XYZ
Unity, 2D Lights and Shadows in Unity 2019! (Tutorial), Available at <https://www.youtube.com/watch?v=F5l8vP90EvU>, accessed on XYZ

Point Lights & Global/Freeform Lights

Point lights are like lightbulbs you can place in a scene, lighting up the surrounding area. I used these at first to give the player a glow that would illuminate objects it approached; I liked the effect so much I attached a point light to the fish prefab, which would alter its radius to match the size of the instantiated fish. This had the effect of bringing the schools of fish much more into the ‘foreground’ – they really felt like they were interacting with the player on the same ‘layer’, rather than moving behind them.

Fish and player point lights

Global lights increase the ambient lighting in a scene, while freeform lights create global lighting effects over a specific area. I used both of these to create a general ‘wash’, and to separate each ‘strata’ of the level into a slightly different texture.

I also started using lights for more direct effects. I added extra point lights tied to triggers to bring players closer to, then warn them away from the anglerfish; a freeform light at the bottom of the sea to give a gradient effect of ‘deepening’, and point lights at the entrance to the narrow tunnel and around the collectible at its end to draw the player to these locations.

Anglerfish ambush

Sprite Lights

Sprite lights are used to create lighting in the ‘shape’ of a sprite – sometimes parametric or freeform lights won’t be flexible enough, or provide enough detail. Xinyu had already provided me with two different ‘god ray’ sprites, which I had lain over the gradient ocean background in the prototype scene. By applying these to sprite lights, I was able to create a natural, directional brightness moving from the top corner of the scene (or, the surface of the ocean) to the bottom (or seafloor).

One of the ‘god ray’ images
You can see the player sprite ‘catching’ the different rays as they move

A simple cosine movement script created a tidal, dappling light effect over both the coral and the deep ocean floor.

Subtle dappling effect on the reef to the right

Normal Maps

The Brackeys tutorial also introduced me to normal maps – flat textures that approximate three dimensional surfaces. By now I had definitely spent more time on lighting than I had budgeted for, but I suspected that Xinyu’s detailed sprites might look even better if they caught light three-dimensionally. Plus, I was a tad underwhelmed by the effect of the player’s point light on the edges of the coral, so I decided to experiment with using normal maps.

Introducing normal maps was relatively easy – I used a program called CrazyBump (unlike Photoshop, Affinity Photo doesn’t come with tools for bump/normal/height mapping) to map all of the sprites, then assigned these maps as secondary textures in the Sprite Editor. It took a bit of work to generate maps for every sprite in the game, and there were some sprites that needed to be reimported, or have their transparency layers cleaned up outside of Unity first.

I immediately noticed a trade-off in brightness and colour saturation, but the detail and ‘pop’ that the light now gave the objects, as well as the realistic moving shadows, were well worth the work. Xinyu shared her happiness in how the sprites now looked.

Conclusion

Out of all the design elements I implemented in this project, I think these lighting systems had the most impact. Reactions among playtesters and viewers of gameplay footage were more positive once the lighting had been introduced, and I was pleased with how it helped to differentiate between the level strata. As observed in the environmental design case study of Abzu, lighting and shadows play an important role in communicating where a player is underwater; I enjoyed putting these design lessons into practice, and discovering how easy the system was to use.