Weird shading on Android and Mobile Preview ES3.1

While in D3D things look fine, on my mobile device as well as in Mobile Preivew ES3.1, things are looking weird if directional light is facing the camera. Here’s an image:

From left to right
A. Character lit by directional light from front, light in back of camera
B. Same as A in ES3.1 preview - looks ok
C. Character lit by directional light from back, camera facing the directional light
D. Same as C in ES3.1 preview - looking really gruesome. Also note that weird blueish coloring in the trees…

I must admit, that I have no clue, what causes this. Same effect when running on the mobile device itself (cheap old P9000 Elephone, Android 7)

I’d be glad, if someone has seen similar effects and could point me into some rough direction where to search for the cause of this…

Edit #1: some experiments show:

  1. The blueish coloring comes from the skylight, verified by disabling Affects World
  2. Tests in a separate simple project shows, that on mobile preview, the directional stationary light just lights “through” all objects - nothing blocks the light, so even the inner of the mouth gets lit and also shadows get cast in areas, where the directional light should not do anything.
  3. The shadowed areas on the character are too dark compared to the D3D version.

    Only the static mobility mesh is not lit by the stationary directional light if in shadow and seems to behave as expected.

Edit #2:

  1. By using Cascaded Shadow Maps for the directional light, I could basically get rid of the weird light in the mouth. Starting with the following settings did help:
    csm-settings
    Important: I had to disable the Cast Modulated Shadows setting to make CSM work (this makes sense, but somehow I had both enabled at the same time).
  2. For the fact, that my player character still gets lit while in shadow areas: I found, that setting the walls to Stationary changes things… experimenting with these now…

Edit #3:
Changing the Skylight Intensity to 0.2 makes the blueish lighting on the trees and other meshes disappear. Interesting: For the Skylight actor, the parameter name is “Intensity Scale”, for the Light Component it is “Intensity” - but it is the same value as it seems. For Windows PIE this value resutls in too dark shadows. I added some Blueprint Code to check for platform:
skylight-intensity-change-bp
This works, but unfortunately Mobile Preview ES3.1 also simply reports ‘Windows’, so this cannot be used to detect if using this or Play in Selected Viewport, but it works on the real Android device.

Still have the issue with character being fully lit while in shadowed area, but it looks far better now.

I found a solution now resulting in same look and feel on ES31 preview and Windows PIE/Standalone

  • Change all Static Meshes like walls or trees, that potentially cast shadows on the player character from mobility static to stationary. Otherwise, there seems to be no way on mobile to make them cast shadows on movable objects.

  • Enable Cascaded Shadow Maps from the stationary directional light. I set dynamic shadow distance to 5000, disable inset shadows for movable objects and enable far shadows with cascade count = 1 and distance = 15000, which turns out to be ok for my level.

  • Change the skylight from Mobility Stationary to Static and reduce Intensity Scale on the Instance to 0.4 (Intensity of the Lightcomponent follows this value).

This looks far better now, although problems still remain in ES31 Preview Mode:

  1. When character is backlit and walks out of a shadow (here cast by the stone in background), there’s a sudden change of shadow lightness.
    shadow-differences
    Left: characters back shadowed by the stone, Right: walking out of the shadow.

  2. Unfortunately, when Launching on my P9000 Phone, the old problem with “light in mouth” is back again: screenshot taken using adb shell screenrecord:
    real-device
    also some of the CSM shadows are missing, which definitely should be there.

I assume, that the latter problem is caused by the fact, that I’m using such an old device with Android 7, so I’ll have to test with a newer one.

It turned out, that the “light in mouth” problem on the P9000 device could be solved by disabling the “Android Device Profile Selector” Plugin. This did make the Device Profile “Android_MALI_T8xx” reported by the Elephone now being “Android” only - and the strange looking light is gone.

Not sure, which parameter exactly is responsible, but I might just decide to keep the plugin disabled for the project, if no other problems appear.

Thanks to dev.ue.games leading to the solution (found no other way to mention someone than using a link to his profile)…

1 Like

Revisiting this again, because I found having really terrible framerate on the P9000 device and needed to go deeper into the exciting topic of performance profiling and device profiles and scalability settings.
Reenabling the Profile Selector Plugin, creating my own DefaultDeviceProfiles.ini and overriding the MatchProfile for Mali T8xx with my own profile to experiment, I found that the ‘Light in Mouth’ problem appears, when sg.ShadowQuality is < 2.

Drilling down in a custom AndroidScalability.ini with settings based on ShadowQuality@0 default settings it turns out, that 2 parameters are to be changed for this in combination:

r.ShadowQuality needs to be > 0

AND

r.Shadow.CSM.MaxCascades needs to be > 1

to make the problem disappear. Well, framerate now goes from 8.5fps to 14.5fps - a huge win in terms of increase percentage - but actually still really bad. Now need to go further into performance and see, if anything is possible to get better results with my poor GPU…

Now I found, that lowering r.Shadow.MaxCSMResolution from 512 to 256 makes the ‘Light in Mouth’ problem ‘slightly’ appear. Changing to 128 makes it fully visible. So for some reason, this parameter also has effect.

Thank you for sharing your fixes.