How do Major Video Games Render Grass?

Trying out the last grass and foliage rendering techniques used by Ghost of Tsushima.

Disclaimer: Commission is earned from qualifying purchases on Amazon links.

Follow me on:

In this video, I tried implement the grass techniques explained by SuckerPunch in their talk "Procedural Grass in 'Ghost of Tsushima'". We walk though a lot of their basic setup, explore some possible alternative implementations, and end up with a nice little scene full of grass.

References talks:

[simondev]

Patrons can now vote for the next video! Thank you for your support.

[theblackquill]

THe more you render grass the less you touch grass

[asandax]

Simon: "I'm just messing around"
(Proceeds to make one of the most awesome grass scenes that looks better than some games released in 2023)

[deanolium]

For the wind, try giving each blade of grass a random 'stiffness' which goes from 1 to 0.8 or so then use this to multiply the effect from the wind. That would give a little bit of variance to each blades movement which would make it feel a little more realistic, since each blade will have slightly different resistance to being moved by the wind.

[neoshenlong]

Dude, you are like "yeah I'm just messing around" and then build a scene that looks absolutely amazing and far better than like half of the games I can think of right now.

[SteveLEKORodrigue]

I'm mesmerized by how good this stuff can look. I'm not a game developer, but you make me want to become one. 😁

[BltSoft]

As the developer of GrassFlow, I approve of this video.
It's weird how familiar hearing about their grass setup feels to how I ended up developing it.
Ghost of Tsushima actually inspired me to add bendy grass and stuff at the time because I was jealous they could do it and I didn't have it.
That was back when using geometry shaders though, now it's just raw mesh instancing baybee.
At one point I hacked together an experiment inspired by nanite using a compute shader based micropolygon software rasterizer to render a truly insane amount of grass with like 1000 triangles per single clump and hundreds of millions of triangles at like 2K 450 fps. I wish it was practical to implement that more generally. But cool nonetheless

[seriouce]

Simon, consider this: Since the video compression really messes with the grass details far away, you could consider this step: Simply upscale the video to 4k and upload. This sounds a bit silly but the 4k stream will have much more bitrate and the grass will look much nicer, even though it is technically still a 1080p video. The upscaling does not make it nicer, but the higher bitrate does - and you won't get that from youtube without increasing the resolution.

[AnimusAgent]

The fact that this was made in Javascript is mind-boggling for me as a web-developers that have been working with JS-related stuff for about 10 years.
And as always, awesome video!

[playonce]

To be honest man, this grass looks artisticly unique and very beautiful. I really love it ! One of the best grasses I have seen in a game.
The more realistic something is to real life the more it looses that childlike connection and desire to that play game.
Your grass has a a type of characterstic to it which i find very wanting to run around the grass meadowy hills.

[zeekjones]

I'd add the actors move vector to the "wind" for a given area so the grass gets a little push as you pass through.

[kingcrimson_]

you are a true wizard. And I absolutely love your approach of tutorial making. Please dont stop, its inspiring.

[mattwayne]

Some of the best javascript and game dev content on the Internet. Thanks for sharing your knowledge. I'll definitely be looking into your courses (when I get some money).

[soumyapanigrahi]

Almost everything bounced over my head but I loved the video for some reason. Subscribed because I wanna watch remaining videos you have uploaded.

[LewisRidyard]

I recently watched the same GDC talk, after playing the game for the first time, and wondered how it could be approached in the browser. Super cool to see your thought process, especially around the points you chose to focus on vs simplify. Great stuff. Really loving your content both here and on Twitter!

[..]

I'm absolutely impressed by how good of a result you got for what is basically a throwaway toy demo. Love your explanations.

[RGSTR]

I used to dream of becoming a game programmer. Now, I watch technical videos such as this, and enjoy them a lot. Thank you!

[CompositeNation]

You show how is not the language which limits but the optimization mindset that creates amazing performance, thank you very much for this video it was delightful to watch and learn from this!

[wafi_izz]

the plot twist at the end got me. amazing

[DavidsKanal]

Love how you're doing your tutorials in the browser - not only is it easier for people to view this demo, but it also constantly reminds people of the power of modern browsers and what you can make with them. I much prefer this approach over fiddling around in some heavyweight engine like Unity.