Examples from the Node Material Editor Playground

The documentation of the NME Editor starts with a big promis: “The Node Material is a simple, highly customizable material that you can build yourself piece by piece. Combined with the powerful node-based editor, you can easily create stunning custom GPU shaders and FX for your Babylon.js scenes.”

Ok, I loaded the first template

and fall into the first trap of not understanding at the beginning of my journey:

What is the difference of a mesh.position and the world.matrix?
Why don’t we use simply a position well defined with x, y and z coordinates?

1 Like

Here are some fundamental answers:

1 Like

Lets also ping @PirateJC cause we could probably improve the doc or link some externals docs for this part ?


@Necips I definitely sympathize with your pain.

You’re jumping into a CRAZY new world and no matter how simple we promise it is (and I do promise that it is a beautifully simple tool to use), you will undoubtedly have a bit of a journey as you dive in and learn this world.

A vertex shader (the nodes in question) operates on every vertex of a mesh. We use mesh.position to represent a collection of x,y,z coordinates for every single vertex in a mesh. Imagine a mesh with 50,000 vertices or higher…there’s no way we could possibly display that many individual positions in the node tree as it would definitely be visually overwhelming and no longer easy to use.

SO, we have this mesh.position node that is representative of a collection of positions. Calculating the individual mesh positions against a world matrix, will give you the position of each vertex in world space rather than local space. And so the resulting node that comes from these two is:

The world Position node. So think of this as a collection of the world positions of each vertex of your mesh.

Past this, things get a little harder to grasp, but you take the World Positions of each vertex and multiply them by the viewProjection Matrix so that the graphics card can understand how to display them relative to the view (camera). Then that gets passed to the vertex shader.

So essentially there are 3 things happening here:

  1. A collection of vertex positions in local space.
  2. A calculation to convert those vertex positions from local space to world space.
  3. A calculation for the graphics card to understand the mesh’s world space relative to where the camera is in order to properly render (display) it in the correct means that you’d expect given your view or camera.

I know that’s a lot to wrap your head around, but hopefully that helps just a little bit in understanding what’s going on.

The deeper you go into the Node Material Editor, the more you’ll find things that aren’t immediately clear…this is just sort of the nature of writing shaders…it’s a complicated space…but I promise that as you stick with it, you’ll quickly discover the power and simplicity that this tool offers.

I hope this is helpful in some way!




Unfortunatelly there is no search for the NME playground… :frowning:

Ohh, there is already a thread about NME examples: