Liquid shader/node material shenanigans, how to translate this to Babylonian?

Hi everyone! I hope you’ve all had a relaxing summer so far!

I have been studying shaders with mostly trying to recreate some cool Unity ones and trying to create some “plug n’ play” -functions for my game, so that Babylon stuff is separate from the main game logic.

Anyways, I have this cool liquid shader, that is encased in this so-to-be futuristic container. Take a look at the prototype here: https://playground.babylonjs.com/#D1H1LY#17

As you can see, there are some liquid thing going in the container. I’ve been following this brilliant tutorial: Liquid Shader Breakdown | Unity URP + Built-in - YouTube . The problem here is that I do not quite understand how the rotation part works in there. Meaning, that when the container flips all around the place as a physics object, the liquid should turn upside down.

The C# script that the tutorial uses to control the wobble and the fluid level are visible here: https://pastebin.com/raw/tvCHyQ8M
I have not implemented the “UpdatePos” -function yet since I don’t really understand how that fits in everything.

The biggest problem I have right now with the shader, is the fact that the liquid stays unturned:

I wonder if this is because I use the mesh position directly without the world position? Anyways, I will continue banging my head on this problem, but I figured I’d ask if there are some Jedi Masters around to poke me into the right direction :sunglasses:

Yeah it is the world position I should be using, and then update the liquid level using some external function. Brb trying to do this…

I have a question about relating to is this node setup equivalent to Unity’s?

Here I try to to subtract local position with world position, like the picture below:

image

However, when I vector split the result and try to isolate the y-axis, I do get horizontal split and not vertical that I was looking for… Which seems odd to me :eyes:

I don’t think this is subtracting the local position of the mesh to its world position, that would make no sense to me. I think Object.Position is also a world position, for some other “Object” (maybe the container of the liquid, assuming the shader is for the liquid itself?).

1 Like

I think this is done because we want to get somewhat “local relative world position”. It is explained like this in the tutorial:
worldpos

But how to replicate this in Babylon?

Edit: Please open the image in new tab, so it is bigger.

For me, what this is doing is liquid_vertex_pos_worldspace - liquid_container_worldspace.

But if you really want to do liquid_vertex_pos_worldspace - liquid_vertex_pos_localspace, what you did is ok.

Note: if that’s what they wanted to do in Unity, they would have reused the same block they used for vertex world space and would have chosen “Local” instead of “World” for Space? Here they used a different node (“Object”). For me, this “Object” represents the container mesh, with its Position and Scale properties.

[…]

Given the doc: Object Node | Shader Graph | 6.9.2

I would say that “Object” is the position of the liquid mesh (and not the liquid container mesh as I first thought) instead => it’s the (world space) position of the mesh. In the NME, you will have to use a Vector3 input to pass the value to your shader.

Yeah, you were correct! It seems that in Unity, the Object position is a pre made node that is using the mesh transform as whole.

So updating the mesh position directly to the shader in Babylon works!

Here is the fixed effect, still work in progress though :slight_smile: https://playground.babylonjs.com/#D1H1LY#28