Valparaíso, Chile

Faking 2d Lights on Unreal

Faking 2d Lights on Unreal

As already stated on previous posts, the idea was to create an atmosphere that could vary between simply beautiful to dangerous and downright creepy at some points. Obtaining a forest that has natural contrasts on each stage, which further help to create the impression of something “out of place”. For this to work, we had to be smart about the use of “Lighting” on a 2d world.

As you may know, 2d world usually uses unlit materials, mainly because the lack of depth (although 2d lit sprites are also used and can be interesting an interesting choice).  Beside the possibilities of using lit sprites (on some levels like caves, etc), we also wanted something similar to a SpotLight that could fake lighting to some unlit/lit sprites … mainly to create those typical light cracks that one can see through the clouds or cracks on a cave (it can be used for beautiful and spooky factor at the same time, so it was a good option to develop early on).

Concept of Fake SpotLight

For the moment, the first stage of the game (tutorial level) has the mage traveling until he finds a house lost in the forest. We wanted to give extra attention to detail to this house, but with no lights, the idea was simply not happening.

Early house build


So after thinking about this for a while, we decided to try creating a fake light that, simply put, is just a translucent one sided mesh that has a material that “fakes” a spotlight (it has emissive colors, some particles floating to fake dust, etc).

While rho (one of our artist) created the material i set up to create a simple solution to create this lights. The solution i created is by no means optimal nor the ultimate Spotlight that we are seeking (will iterate until i’m satisfied by it, but for all the purposes of creating the ambient, it was a good solution).

Simplified FakeLightMaterial

The SpotLight2D object works by launching multiple line traces using the visibility channel of UE4 (simply because that’s the use of that channel, or at least it sounded logical). Whenever it encounters a hit, it stops at it tracks ant creates a runtime generated triangle which faces the camera, assigning the spotlight material that was created.


As you can see, the lines stop where a hit is found, the rays are not perfect and can miss some corners, so you can adjust the angle to use between each trace, you can also set the light as static, so it only does this once (the “dynamic” mode is costly, until optimized, reaching a 10fps drop per 3 active 1º light present on screen, moving). each of this triangles is mapped to a triangle runtime generated.

On each vertex, we had to assign the UV Mapping of the material, we simply scaled the total raylength to 1, and each vector direction from the light, was mapped on the material like this.

UV Mapping of raylights

With this, we could have a light source that diminished with distance traveled, we also had the particles effect (that move with time) to create a simple dust in the wind.

The modified scene now looked like this.


Lights rendered

Another example.

Link to video:

The results where good for a first iteration, but on the future we will implement refraction and reflection on some surfaces, so water scenes can look more lively, any update will be posted on further posts


Agregar un comentario

Su dirección de correo no se hará público. Los campos requeridos están marcados *