How to create a normal map texture? or show normal map texture?

Can any one please guide me how to show normal maps, Sofa - Download Free 3D model by Urpo [80edec2] - Sketchfab how they are doing normal map, wireframe in double layer, how can i set wireframe background white and wireframes in dark? how to show the UV map? I’m new in this field. please guide me

1 Like

Hey @imarabinda

Sure thing I can show you how to show normal maps, etc using the Inspector.

Before we dive-in, in the future, please provide a playground with your question. That is the easiest way for people to help you learn. It’s also an expectation around here. :wink: Let’s start with this one:

With the scene loaded, find this button at the top:

image

That opens up the Inspector.

Next, in the inspector, expand Materials and select “YetiMat.” This selects the Yeti’s Material.

image

Next, if you scroll down in the general properties:
image

You’ll come to the “Channels” section.
image

If you select the little wrench icon on the far left of Bump, it will show you the Normal Map.

image

You can toggle “isolation” for any of the texture channels through the wrench icons next to each item.

The inspector is definitely your friend!

I hope this helps!

3 Likes

https://playground.babylonjs.com/#S0KJUA#39 , this is my play ground, but i see there is no bump texture available as you’ve shown in the yeti image

Correct, it looks like you have the model, but no textures for it:

image

You would need to get the source textures and then apply them either in a DCC tool like Blender, or directly in Babylon.

If you go the Babylon route, there are 2 options, applying them directly via code, or using the Node Material Editor.

If you’re new to 3D, then I’d suggest taking a look at the Node Material Editor. It’s a code-free way to set up materials for your scene.

Honestly, I wouldn’t start there (sry :face_with_hand_over_mouth:). NME might be code free but it requires knowledge on how to create materials at a very minimum. I think the easiest way would be to first learn how to do it with code, using standard, metallic and PBR materials. All nicely explained in the doc and I would start from here.
Of course, my opinion only…and meanwhile, have a great day :sunglasses:

Honestly I would go even further and suggest anyone who is completely new to 3D to start here: Introduction to Babylon.js Features | Babylon.js Documentation (babylonjs.com), as I think jumping directly into materials without having knowledge of things like camera, vectors, etc, can cause a lot of confusion :slight_smile:

@PirateJC could you please tweak this material to normal map type https://nme.babylonjs.com/#AZM7DN#2

Hey @imarabinda,

I’m not sure I understand what you’re asking for.

There is no “normal map” type for the node material editor.

The normal map is usually a texture file generated in a DCC tool like Blender.

Displaying that texture in the Node Material editor is incredibly easy.

You really only need 2 additional nodes beyond what the default NME template has:

A MeshUV node and a texture node.

Then you simply load your normal map into the texture node and hook everything up like this:

Node Material Example: Babylon.js Node Material Editor