How to achieve grass "3d effect" similar to this one

Dears,
Interesting topic. Let me just add the link to the video. Will make it easier to understand the scope, I believe.

It’s funny how the ‘grass’ topic is kind of redundant in this forum. I believe at some point, there are some keywords, like ‘displacement’ or ‘vray’.


Let me also just add another link from the forum.

The video is kind of interesting, I believe.

Now, I’m not a real dev, so don’t count on me to give you the algorythm or the final logic/&method, however… as a creative, there’s a number of things that are clear to me. 1) Applying a texture, even with bump or parallax/parallax occlusion on a terrain will never create the vertical displacement when viewed from the camera (real time camera). 2) At some point, the old school method was to add sprites… next moved to either decals or instances. Or we can now create a geometry using a variety of methods (from vertices or from materials like the fur mat). And then, we have the shaders and the node mats which (at least up to some point) can help do the trick. Up to some point? Either I’m missing something or it is so that we still need to use a ‘mix’ of techniques? Do we?

I suppose it would be great to have @PatrickRyan input at this point. If you have a minute for this? I’m pretty sure this is the kind of thing where you’d like to impress us with your expertise, isnt’it? In any case, I would be eager to read about your analyse of the current state of this in BJS… if you can save a moment to enlight us? :smiley:

It depends who do you ask to port it :smiley:

Displacement maps needs highpoly meshes.

Indeed. But that’s kind of conflicting with the ‘high performance’ request, isnt’it?

Yerr :clown_face:

Please Roland, can you port it? :slight_smile:
I’m curious to compare these different approches…
To Mawa: I think the other way is really a performace killer…

Oh, yeah. If you’d implement it just like that on a large terrain and for low grass, without clipping and lod and some other fancy stuff, it would likely put your GPU to the knees :joy: Reason why I’d really love to read about our expert/guru @PatrickRyan input on this. And then. ‘imagine’ we could obtain even just the base of (a shader/an NME/a whatever suitable method)… now, how awesome would that be? :smiley: :grinning:
Sidenote: Anyone noticed I’m trying to trigger something here? :face_with_hand_over_mouth: Just don’t tell anyone, may be it will do the trick :joy:

I saw this coming :stuck_out_tongue:

Lemmesee…

1 Like

EDIT: working PG:

Doesn’t seem to do anything funky yet :smiley: but it compiles. I’m missing something with the UVs here I believe.

1 Like

Mitico Roland!

Can you simplify the code to handle only the last result (now I’ve stop the time…)?

And what about the UV scaling?

And I’ve seen that there are some artifacts:(white dashed line?)

1 Like

Screenshot? I can’t see any artifacts.

I asked chatGPT

Adding Short Grass Texture (chatgpt.com)

grass with noise added | Babylon.js Playground (babylonjs.com)

It is not the final product, but the shader could be compiled and the grass was slightly mixed.

modify the factor of uv

uv.x += (noise - 0.5) * 0.05;
uv.y += (noise - 0.5) * 0.05;


may be I ask the wrong questions… :slight_smile:

how can i make a flat picture look 3d with a shader?

Hi, can you see the Dashed Line? Move near to the texture and rotate the view… In VR mode are more evident.

1 Like

while walking the dog i came up with a very simple idea: since the shadows depend on the normals of the plane, you would actually have to turn the normal vectors in places so that they form a shadow. this assumes that you have a plane with many segments to get better details. no extra material shader is necessary for this idea.

Here is a quick made example with the help of chatgpt

grass with noise added | Babylon.js Playground (babylonjs.com)

1 Like

What about this method?

what’s the difference with this one? The concept is the same. Isn’t it?

Ah, ok… From the video the results seem better…
And what about the artifacts mentioned above?