Having some holiday fun with this fortnite model, been trying to figure out how to get the material workflow down. I’ve got an example of how it should look on Sketchfab where I was able to configure it correctly, but on BabylonJS, it looks like all the right parts are there for the material but its not working.
Looking for advice on where I could be going wrong. Thanks.
// StandardMaterial
//PBRSpecularGlossinessMaterial
//standard pbrGloss switcher
How it should look:
cc @PatrickRyan
@Baktrian, unfortunately the asset you are using is not set up in a way we would expect for any of our shaders. Looking at the base glb, there is only one texture - the base color texture - defined in the glTF, and the other parameters are defined as factors in the file:
When loading the model as is, the render looks like a decent start to the render from sketchfab:
However, it is missing its emissive texture and the roughness variation you see in the original on sketchfab. However, when I toggle through the material channels on sketchfab, and then look at the textures you supplied for the model, I see the issues you are having. The texture you are passing as a specular texture is not, in fact, a specular texture but a channel packed texture containing several textures, one per channel. You can see here that the red channel of your specular texture contains what would be your smoothness texture. Normally, you would assume author metallic roughness, but engines like Unity require metallic smoothness, so the texture is the inversion of a roughness texture like we see in sketchfab.
Which is an inversion of the roughness texture found in sketchfab:
The green and blue channels contain different information entirely, which would likely drive a custom shader. Arguably, the green channel contains a metallic texture, which you can see when overlaying the green channel with the red. The fully green bits fall on the metallic parts of the model.
From what I see in Sketchfab, it’s not using a metallic texture at all, so there seems to be data in the textures included with this model that aren’t referenced for the original render. My best suggestion would be to peek into each texture and see what is there and what each channel could potentially represent. Without seeing a full render of the character using the correct shader, it’s hard to guess what each channel is used for. The blue channel of that texture has detail in it that I don’t see in any of these renders, so I can only guess at what the shader would do with it.
This could be a specular F0 texture for a metallic roughness material. Or it could be something else entirely. I doubt it’s a glossiness map to throttle specularity, unless it’s an inverted one as the values don’t make sense for glossiness.
If you can break down what each channel is doing, you can reconstruct the textures so the channels contain data that our shaders expect, or you can go the custom shader route. I prefer working with node materials, and this one seems like a good candidate for that. I hope this helps point you in a good direction, but feel free to ping back with more questions.
Thanks for the response @PatrickRyan
If you look at the playgrounds, those are using the source files, I exported out the glb with some textures still in there but this is just my assignment guesses in blender. The base model is just a blender export with my initial guesses.
The textures I load in the playgrounds are the ones that come with the model, and im trying to load them in.
I have done the same with the SketchFab model but that clearly allows you to put the maps in the correct slots whereas BJS is a little more convoluted.
Here are the material settings for the sketchfab file:
The SketchFab output is how it should look, ignoring emissive etc. I am just worried about Specular, Glossiness, Metallic and Roughness. The output you are seeing in the model inspector in SketchFab is a baked output and not representative of the original configuration.
So the albedoTexture is what the base model should come with, and then we assign a texture with an _M suffix to occlusion (These are sometimes assignable to roughness and metallic) Then we have the _S suffix which im thinking has to be Specular and Glossiness due to it working in SketchFab.
I will try out Node Materials, as it should support channels
@Baktrian, I understand that the wizard for assigning textures to PBR materials in Sketchfab is easier than in Babylon.js, which is expected because of the nature of the Sketchfab product being a model viewer where the upload process needs to be very streamlined. Babylon being a 3D engine which is used for whatever the developer wants it to be does mean you are working closer to the metal than in Sketchfab and more will be left up to the developer to handle. Not that Babylon is all that close to the metal, but certainly closer than Sketchfab’s viewer.
That said, I am unsure what is happening behind the scenes in the processing of the textures for the Sketchfab upload process. In the case of your specular F0 and your glossiness assignment, the process for the texture is only taking the red channel from the texture you assign. This is not laid out in the documentation at all, and I don’t see a way to limit a texture to a particular channel in the UI you shared. Nor do I see any mention of being able to assign specific texture channels to a PBR property in the documentation for Sketchfab. But it is obviously ignoring the G and B channels of the texture you assigned.
This means that their processing takes into account the ability to assign a specific channel from a texture or they decompose the channels into different textures for their shaders. In any case, the shader just needs to know what to do with the specific data in each channel. If it’s a true RGB image, our shaders will take the values for R, G, and B for each pixel to drive the lighting calculation. In this specular texture, the values for R, G, and B are three different data sets, so we should only use the value of one of the channels at a time to drive the lighting calculation. This is where the node material comes into play. You can make the shader however you want so you can process the data coming from the textures correctly.
