# Node material water looks triangulated, how to make it smooth?

**URL:** <https://forum.babylonjs.com/t/node-material-water-looks-triangulated-how-to-make-it-smooth/55064>\
**Category:** Questions\
**Created:** [November 29, 2024, 11:18am UTC](https://forum.babylonjs.com/t/node-material-water-looks-triangulated-how-to-make-it-smooth/55064 "2024-11-29T11:18:23Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![forux](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/forux/32/36392_2.png) [@forux](https://forum.babylonjs.com/u/forux)\
**Post date:** [November 29, 2024, 11:18am UTC](https://forum.babylonjs.com/t/node-material-water-looks-triangulated-how-to-make-it-smooth/55064/1 "2024-11-29T11:18:23Z")

</div>

Hi!

I am working with water material in the node material editor and trying to understand how to make it smooth.

For now, it has visible edges on triangles you can see on the demo here:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/2/8/28f30f1e2453b1770b0d9eb34242da9a7b7c61d6.jpeg)

> **[Babylon.js Playground](https://playground.babylonjs.com/#9B0DNU%23295)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL and WebGPU 3D scenes

Here is its node material:

> **[Babylon.js Node Material Editor](https://nme.babylonjs.com/#3FU5FG%23258)**
>
> Babylon.js Node material editor - shader-based materials editor for Babylon.js

Can you please help me understand what causes these triangles to be sharped? Do you have any ideas about how to fix it?

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [November 29, 2024, 11:30am UTC](https://forum.babylonjs.com/t/node-material-water-looks-triangulated-how-to-make-it-smooth/55064/2 "2024-11-29T11:30:22Z")

</div>

You can improve things a little by further subdividing the mesh by increasing the value of `subdivisions` on line 27.

cc @simon, who is the creator of the shader!

---

<div class="post-metadata">

**Author:** ![forux](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/forux/32/36392_2.png) [@forux](https://forum.babylonjs.com/u/forux)\
**Post date:** [November 29, 2024, 12:47pm UTC](https://forum.babylonjs.com/t/node-material-water-looks-triangulated-how-to-make-it-smooth/55064/4 "2024-11-29T12:47:19Z")

</div>

Hi Evgeni!

I agree that it will make it better, but I need to keep triangles low.

I want to understand why material itself is broken?

If there are details on what each node do, and each input output it will also help

Especial I can not understand why pbr node itself does not provide final color and there is need of mixing?

---

<div class="post-metadata">

**Author:** ![simon](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/simon/32/45590_2.png) [@simon](https://forum.babylonjs.com/u/simon)\
**Post date:** [November 29, 2024, 1:37pm UTC](https://forum.babylonjs.com/t/node-material-water-looks-triangulated-how-to-make-it-smooth/55064/5 "2024-11-29T13:37:26Z")

</div>

Hi!

To make it work you have to recalculate all the normals inside the shader. I created a topic about that some time ago. So it could helps you:

> [@How to smooth normals useing NME?](https://forum.babylonjs.com/t/how-to-smooth-normals-useing-nme/30918/8):
>
> Your computations of displacedNeighbour1/2 is wrong in the NME, you should apply the displace transformation to neighbour1/2, not do neighbour1/2 + displacedPosition. This seems to do it: Note that I had to use an elbow node to connect the output of the (final) normal vector merger block to the transform block (to compute the world normal), directly connecting both would not work for some reasons…
