Black details in Babylon Viewer but fine in Sandbox

@Jaap_Huisman, happy to help with more questions. To be honest, when I look at both DDS files, I am seeing the same issue that they seem to be formatted in a way that is just alpha. Again, DDS is a very hard file to debug and I would probably advise to move away from it for this reason. If the file Skybox_2.0-256.dds is the file you are using for your skybox in scene, I’m not quite sure how it’s working without looking at your code. Typically for skyboxes, we pass a group of 6 images and the scene assembles a cube map for us. You can rely on the scene to create a skybox for you if you are setting an IBL as the environment, but you can always just create your own.

The same can be done for reflections if you have a mirror surface. Typically for material reflections, you are good enough with the IBL reflections in PBRMaterial even if the cube faces are only 256 px per side. This is mostly due to the complexity of the model and relatively low percentage of a material that is reflective like chrome. A mirror is a different issue, however. Since a mirror is usually a large flat surface intended to reflect the environment, the small 256 px environment cube texture is too small and shows pixelation. This is where you would want to pass a separate reflection cube texture. This is an LDR image set to make up a cube like a skybox would. This texture gets assigned to the material as the reflection texture and then your lighting calculations will take the environment texture into account, but the reflections pull from the reflection texture. This allows you to get faster lighting calculations with the smaller environment texture, while still getting higher quality reflections. You can also benefit from image compression of jpg with your reflection textures since you do not need any HDR data.

This thread dealt with much the same problem you are looking at and would be worth a look.

My suggestion for your tool chain would be something like this:

  • Open the sandbox and drop your mirror asset into it
  • Drag and drop your .hdr texture onto the sandbox to load and convert the .hdr into an environment
  • Open the inspector and click on the tools tab
  • Choose Generate .env under scene export
  • Go to 360Toolkit - Convert equirectangular to cubemap
  • Choose the six image option for output
  • Upload your .hdr image (note that for larger cube images, you will need a 4k or larger image)
  • Export your images as jpg
  • Rename your images according to what Babylon expects, i.e. filename_px.jpg, filename_nx.jpg, etc.
  • Create your environment with your .env file
  • Optionally, create your skybox with another set of skybox textures. You can follow the same instructions as above
  • Create your reflection texture and assign it to your PBRMaterial

This should get you where you want to be. Note that when creating your reflection texture, you don’t need an .hdr file. You only need an LDR equirectangular image to convert to a cube map. The important thing here is that the image can be projected to be spherical without seams or lost information. Any method for creating an equirectangular image can be used.

Hopefully this gets you a clear path to a workable pipeline. If you like, you can create a playground with a sample asset and environment set up and I can take a look at any problems you may have. Working with playgrounds is always easier since I can see exactly what you are doing in your code and make suggestions. Let me know if you have more questions.

2 Likes