Realtime Foliage in Verge3D

Hi!

I’ve been experimenting with how I can create good real-time foliage in Verge3D and Blender.

The results so far: https://v3d.net/11es

I am positively surprised at how well this has worked so far but feel there is room for improvement.

Goals: Realistic foliage (trees/bushes/grass) that still is performant in the browser.

What I have done:
– Geometry nodes system for generating leaf cards inside a volume.
– Looping procedural animation of the leaves by rotating a noise texture and affecting the instance rotation. This animation is exported to .mdd and imported again to convert to shape-key animation.
– I have a 3D-trunk but image planes for the tree branches.
– I put a darker, smaller and opaque shape inside the bush to darken the middle.
– Used AGX and look Punchy to get more vibrant colors.

Ideas for improvement:
– There is three “levels” of shadows applied depending on zoom level. I wonder how we can control this. You will clearly see how there is a shadow line traversing over the grass when zooming in and out. Preferably this could be mitigated.
– The grass just doesn’t look that great and is a performance thief. I’ve been toying with the idea of somehow just breaking up the outline of the grass rather than distributing them all over the surface. I got an interesting effect when disabling “depth write” I think.
– Performance. This works well on my iPhone 14 and my beefy laptop. My less than modern Android phone struggles. Also this is a minor scene, I’d like to have room for scaling up the scenery.

Here is a link to the project files. https://www.dropbox.com/t/H0iqRAoqWJg4gXwf

So, what do you think? I am very interested in ways to make this either more performant or more visually pleasing.

Thanks,
Adam

• This topic was modified 4 months, 3 weeks ago by wpadm.