Node Materials Examples

Hi there,
I have a texture slot in my nodematerial. Is it possible to assign this slot to another texture in code?
Something like : nodeMaterial.getBlockByName(“Ambient map”) = aStandardMaterial.ambientTexture;
(I have invalid left-hand side in assignment error when run this code)
Thank you!

Close: nodeMaterial.getBlockByName(“Ambient map”).texture = aStandardMaterial.ambientTexture

2 Likes

Super excited about this. A node-based GLSL editor has been sorely lacking! The saved shader results are/will be regular old GLSL vert/frag, right?

Yes it generates pure glsl shaders (as we are using glsl to render ;))

1 Like

GridMaterial recreated in the NME:


https://playground.babylonjs.com/#1QIWRQ

The standard GridMaterial class does not handle lights nor textures, now you can use the NME version to do whatever you please :slight_smile:

6 Likes

F*** YEAH!!! @Evgeni_Popov: do you mind adding it to the NME doc?

Done here:

1 Like

Hi all,
This is my first time posting on the BabylonJS forums. I wanted to share a node material that I have been working on. It is a dissolve effect that linearly dissolves the object.

Here is a link to the material:
https://nme.babylonjs.com/#7LRA9H

Here is another link to a playground example:
https://playground.babylonjs.com/#1K48LV

Still needs some improvement. Unfortunately, I was unable to add noise to the dissolve effect. If you have any suggestions, please do let me know.
Hope you like it.

Cheers,
Taha

10 Likes

Welcome! Are you sure the playground link is the right one?

I think it is, but you need to modify the parameters through the “DISSOLVE” input section of the material.

Nice effect by the way, with lots of customization!

Ok gotcha!! thanks! nice effect indeed!

Hi all,
I just wanted to post an update on the Dissolve material. I have updated the material to use PBR as a base. This exposes more properties to control the look and feel of the object such as metallic, roughness, sheen etc. It includes all blocks for the PBR material.

Here is the link to the material:
https://nme.babylonjs.com/#Z3L2DB

Here is another link to a playground example:
https://playground.babylonjs.com/#KKLLSH

I failed to mention this in the previous post. However, I have not added in code to animate the dissolve effect. To move the dissolve edge over the object you will need to change the Edge Position property located in the Dissolve section.

The material still needs improvement and I have not tested all PBR blocks yet. Please do let me know if you have suggestions or run into issues. Do note that the material contains all PBR blocks and you can delete blocks that you do not need.
Hope this helps you guys out.

Cheers,
Taha

5 Likes

Toon Water

Loosely based on: Unity Toon Water Shader Tutorial - Roystan

https://playground.babylonjs.com/#BSIWK6#7

Am curious, if some people can improve it, i.e. with distortion. Shouldnt take big steps.

image

8 Likes

I tried to animate the dissolve effect, but using ugly bit of code :sweat_smile: (line 124) https://playground.babylonjs.com/#1K48LV#5

Is there a way to expose this property? (maybe it’s already the case but I haven’t seen it)

You may be inspired by the ocean shader from Node Material | Babylon.js Documentation

3 Likes

Thanks, yes I saw this amazing example!
There is another great example which is a bit closer to mine, since it uses depth map. It is not made with Node Material Editor, but looks much better than mine: Simple stylized water shader

Hi there,
I made a simple checker texture, good base for further modifications
nodematerial-editor.babylonjs.com/#V11ZH9

checker

3 Likes

another simple examples:

a single square, the size can be easily adjusted
nodematerial-editor.babylonjs.com/#HBYH4K

and sinus, cosinus visualization
nodematerial-editor.babylonjs.com/#28M5JD#1
sin

and circles: #EUP4AT

2 Likes

Hello there,
we are trying to find a way to debug values in the node material editor.
Is there a way to read the output value of a node, in console maybe or with a trace output node (a la Unreal)?
I.e.: reading what come out from the following Abs.Floor node?


cheers!

2 Likes

Hello @Pippo! Welcome!
Please watch this cool video by @PirateJC Custom Nodes in the Node Material Editor: Part 1 - YouTube where you can learn how to use the OOP custom node which is used for debugging. Hope this helps!

3 Likes

Hello @roland! Thank you for your help I will look into @PirateJC 's video.
Cheers!

2 Likes