Black PBR texture under Environment lighting in Node Material

[Sambler]

I’m trying to create a PBR texture in Node Material, but when I switch to Environment lighting it becomes black for some reason.

What am I doing wrong?
Is it possible that using an HDRI for PBR lighting is not the right approach?

P.S. I’m working on a furniture project where I want physically correct materials for realistic rendering of textures on furniture products (in this case, wood).

https://nme.babylonjs.com/#423PH6#1

I found the following approach, but I’m not sure whether it’s correct or not:

But in the end, the material is displayed incorrectly in the scene:

[Evgeni_Popov]

You must connect a ReflectionBlock to the reflection input for environment lighting to work as expected:

https://nme.babylonjs.com/#423PH6#2

[Sambler]

It seems like this worked. But what about the brightness?
The object in the scene is very dark, and if I increase the Environment intensity, all the realism is lost and it starts to look unnatural.

scene.environmentIntensity = 4.7;

Can I increase the brightness specifically for this texture in the Node Manager?

[Sambler]

Maybe HDRI isn’t the right choice for my goals?
Do you have any other ideas on how to improve the image and achieve maximum realism?

Or perhaps you have an example of an already well-configured Node Material texture that I could try to use (in JSON format). I could then follow that setup as a reference for creating all the other textures in my project.

I would really appreciate it if you could help me.

[Evgeni_Popov]

These faces are in shadow, which is why they are darker. You can try reducing the darkness property of your shadow generator to lighten the shadows.

If you want to update the intensity only on the mesh material, you need to clone the environment texture and assign it to your material’s reflection texture. Note that the underlying GPU texture will not be cloned during the process, so you will not consume more memory (except for the new texture properties).

[Evgeni_Popov]

Also, how do you create your environment texture? Can you paste your code? It would be even better if you could reproduce it in the Playground, so we could help you better.

The environment texture is definitely the right method to use with PBR materials.

[Sambler]

@Evgeni_Popov

Also, how do you create your environment texture? Can you paste your code? It would be even better if you could reproduce it in the Playground, so we could help you better.

I’m just creating an HDRI in the scene and that’s it.
Should this be done in a different way?

 // Окружающая текстура (HDRI)

  scene.environmentTexture = CubeTexture.CreateFromPrefilteredData(

    "/hdr/brown_photostudio_01_4k.env",

    scene,

  );

  scene.environmentIntensity = 0.7;

[Sambler]

I think I recreated the scene, and it seems to display correctly there.
I copied all the lighting/shadows exactly like in my main project.

It works here, but in my project it still looks incorrect for some reason.

https://playground.babylonjs.com/#6GB2NK

What else can I do to check this?

I can’t increase the intensity too much, because then all the realism is lost. But at the same time, I don’t want it to look like this in the shadows.

I also can’t add another Directional Light, because in that case the shadows won’t be cast correctly. I need only one Directional Light, and also a light source that would evenly illuminate the object from all sides (HDRI).

hemiLight.setEnabled(false); - It’s disabled, just so you know.

I think the issue is with my texture.

I downloaded another texture, and it displays correctly:

[Evgeni_Popov]

cc @PatrickRyan, I don’t quite understand why simply modifying the albedo texture (you only modified that one, right?) would have such an impact on the lighting…

[Sambler]

I only change the texture set; I don’t touch anything else.

In the first case, it looks very dark, even though the Albedo is clearly light.

In the second texture, the Albedo looks very similar, but the final result is much brighter.

[Sambler]

I found the cause of the darkness.

It was the AO texture — it was too dark.

Thanks everyone for the help

I hope this helps someone who runs into the same problem.

[Sambler]

After testing it several more times, I noticed that the resulting texture looked very different from the original. It turned out that I had connected the wrong output — I should have connected DiffuseDir instead of Lighting.

However, I ran into another issue: when the Environment lighting is enabled, the texture becomes completely black.

Could you please advise how this lighting issue can be fixed in this case?

[sebavan]

Can you share a repro in the forum ?

[Sambler]

https://nme.babylonjs.com/?webgpu#PATTDN

[Evgeni_Popov]

diffuseDir corresponds to the diffuse component of the direct lighting: if you don’t select any direct lights in the preview, you will see a black mesh.

With some lights selected:

Note that all outputs of PBRMetallicRoughness are in linear space, except for lighting! That’s because we generally use lighting (which is the sum of all types of lights) as the final value we output from the shader. That’s why it’s already in gamma space and not in linear space. The other outputs assume you are going to use them in some calculations, so they must be used in linear space. It’s your responsibility to convert the final result to gamma space.

There’s a property on FragmentOutput to help with that:

[Sambler]

I see this as well, but I need everything to work specifically with environment lighting.

[Evgeni_Popov]

Then use diffuseInd instead (Ind is for Indirect, which is the environment):

[Sambler]

Yes, I tried that as well. But in the end, the texture in the scene doesn’t look the same as the original texture. Here is a clear example comparing the original texture and how it looks in the scene.

Maybe I’m doing something wrong with the lighting? Or something else — I don’t really understand.

  scene.environmentTexture = CubeTexture.CreateFromPrefilteredData(
    "/hdr/brown_photostudio_01_4k.env",
    scene,
  );
  scene.environmentIntensity = 1.0;