December 2018

amit In Breakdown

Lighting Breakdown – 2D Platformer

Doing game lighting compare to cinematic poses some other challenges, unless you are doing real-time cinematic that is. I am specifically talking about performance, gameplay, and clarity to name a few. In this blog post, I will break down a test lighting I did for a game jam 2D Side scroller with a sci-fi theme to it. The majority of the level was put together by my friend with some adjustment made by me later on. So let us start with the general workflow, starting with References.

References – Color and Mood

The first thing to do is always get some references, it makes it much easier to establish your mood and lighting setup. Let me provide two samples from the reference library that I used to light the area.

Once I spend a few hours doing this process I try and establish my own color scheme based on my references, this ensures creative freedom, expression and artistic decisions suitable for the particular game you might do lighting for. Provided is a sample of said color scheme that was used to light up the level.

Base Color Scheme – Oversaturated in comparison to references

Light Placements

With the concept, planning and reference phase semi-completed I recommend thinking about where to put the lights, as in my case there are suggestions on light sources but in some cases none at all. So an example of how it would look like is this:

Looking at the environment I started playing around with different light placement but ended up placing lights somewhat like this:

The reason for these placement was to have the flexibility of creating shadow through barrels and beams. There are additional light sources behind on the yellow wall, to create light in the background. All of this together gives enough light sources to create specular, reflection, highlight, shadow and overall dark background. This is because majority of the light is around the playable area, thus the background will become darker.

By now, maybe you noticed the color of the materials. This plays an important role in what color light to pick. In this case, I was the one who changed the materials to yellow and red, to emphasize the blue/teal lighting that would go in the playable path. With minor breakups using red/orange.

I continued adding static mesh light sources down the hallway, in the process I added elevation and other details to adjust the level design. The darker red light was added to the door entrance with a big wall in between, and other light sources where given a blue teal color. I added similar light sources behind camera to ensure it wasn’t too dark on either side.

Adding the light to the level

One of the first thing that is good to do is getting a decent emissive from the materials that are on the static mesh light sources itself. This will give out a light that can be baked into the texture, saving real time resources.

Then a lot of time goes into adding the best suitable type of light type, such as spotlight or point light to light up the area as intended. In this particular case a mixed method was used to create the lighting. Another mixed method was used called static, stationary and dynamic lighting. Static being the cheapest, stationary mid expensive and dynamic the most expensive. The biggest difference is that static is pre-calculated onto the texture and won’t cast shadow if something moves in between later. While Dynamic happens per second and will cast shadow if something comes in between.

All of these are using spotlight with their own range, intensity and color.

All of these are point lights with their own radius to brighten up darker areas.

These are detail point lights. It means they are unique in color or have a distinct purpose on creating detail lights due to their souce. In this case computer screen and devices etc.

All of these lights have unique settings to them for different purpose and reasons. I will try and explain some of the principles behind it. In general only the important lights have dynamic shadow on which means it is calculated every second while the game runs, everything else is baked to save on resources during gameplay. This allows me to be slightly free in using extra lights in areas that I need to in exchange for longer baking time/rendering.

These spotlights are one of the main light sources, known as key light. That is why their intensity is brighter to show the clear path of direction for the player. The two cones evens out the intensity and gentle fades out the hotspots. This is also a dynamic light and cast real time shadow during gameplay.

The second main light source is also a spot light with a wide range to cast shadow far enough as the player moves. It’s color however is on the opposite color wheel which is red. This was to breakup the monotone color scheme. Notice the light on the top wall is same type, but set to static as it doesn’t need to be dynamic real time. Optimisation and illusion is key.

These points lights all have different range, intensity and color but their purpose is to fill in darker areas and spread out the original light source by faking it. Because of this their shadow is turned off some places to reduce render/baking time and set to stationary to avoid real time cost. The yellow radius is radius representing light source size, in this case faking the fluroscent light source in the gateway everywhere. It affects the ground also.

Notice the ground. This is manipulated through the source radius settings mentioned above.

As shown so far there are many things, thoughts and techniques used to prepare the lighting of the level. From this part on I copy pasted the lights to the rest of the level. That is why color palette, lighting position and most of the work is done early so rest of the level would go quicker. However, since each section is different some tweaks are still required.

An example of such a scenario would be the image shown later below which has hotspot created due the static mesh being closer than other objects earlier when creating the lighting setting. These lights also have something called IES Profile which is physically accurate light patterns from real life. To save time I took an image from Atul Dravid.

IES Profile made by Atul Dravid: http://www.cgarena.com/freestuff/tutorials/max/ieslights/

The lights being used for the game level is also using Inverse Square Law which is basically how lights fall off and lose’s intensity over distance as shown above. But I took another image to save time, this time from Johannes Daunner to show a quick example.

Light Inverse Square Law. Image taken from Johannes Daunner. https://www.diyphotography.net/lighting-design-easy-way-secrets-inverse-square-law-light/

Due to these details explained above and of course intensity, range and such it blows out the details.

This is when we can turn off the Inverse Square Law and play around with intensity, range and light falloff exponent. In my case I also adjusted the point light to add intensity to the floor to closer match the other areas.

Notice the details of the mataerials and objects are easier to spot, such as the white line on top of the machine which would otherwise be hidden.

Basically you keep going like this looking at your reference, color palette and adjusting it based on values, contrast and what you are going for. I tried making sure the background was visible enough while the main path was brightest. Smallest thoughts went into it such as purposely having white tiles on the path and black on both sides of it, this creates contrast and also ensure brightest spots are in the middle of the path.

Fog

I won’t go too much into detail but when you add fog into the scene such as Exponential Height Fog you need to remember it creates flatness due to the type of technology it is. Some time was spent to push the fog to the middle of the scene rather than the whole scene, this was to ensure depth without losing value and contrast. Additionally fog sheet was used to put around on the side background to create further depth and mood. The light sources closer to the player area and higher up was given volumetric lighting as well.

The distant fog was kept to this area while the volumetric fog light was kept closer and up in the air. This was to create further depth to the scene, which often can go wrong and make it more flat.

Post Processing

Eventually I wanted a more worn down color saturation, in other words desaturated color scheme. For this the Post Processing Volume was used by adjusting tone mapping, chromatic Abberation, Bloom, Ambient Occlusion and custom LUT was created in Photoshop. A LUT is basically color correction.

Final Touches

For the final touches you keep iterating upon color, intensity, value and depth. You add in some more details and reflections. You go into Light Mass Settings to adjust the light baking quality, you pump it all up to max and you look for compositional shots to promote your work.