Video Game Grass Rendering Techniques

Grass in Video Games

• Grass is important in video game environments, with its absence making environments feel unnatural.
• Insufficient grass can make the grass that is present stand out oddly; to solve this, developers often include more grass.
• Having a lot of one thing in a video game can be computationally expensive and affect performance.

Grass Rendering Techniques

• Many grass rendering techniques exist, but some are unacceptably bad.
• One technique used for decades can turn a vacant plane into a dense field of grass.
• 1.2 million animated grass meshes rendered at 500 frames per second can be achieved utilizing this technique.

Setting the Scene for Grass Rendering

• A 300 by 300 meter plane in Unity with vertices displaced by a height map is used.
• A small cube serves as a player model reference.
• To render grass, the grass model needs to be rendered.
• Different grass rendering techniques determine what the grass model looks like.

Billboard Grass Technique

• Grass in Final Fantasy XIV is not a 3D model but an image.
• Billboard grass consists of two triangles forming a quad that samples a grass texture.
• Billboard grass is commonly composed of multiple intersecting quads.
• The project uses three quads, where the texture does most of the work.

Creating a Grass Texture

• A grass image texture is required, and a custom texture was created.
• When the texture is applied to the billboard grass model, the grass comes together.
• The grass model needs to be placed over the plane.

Optimizing Grass Placement

• To simplify placement, the plane is flattened first.
• Covering the entire plane requires a lot of grass, potentially more than the CPU can handle.
• A handy method is used where the CPU takes all the object mesh data and sends it to the GPU.
• Mesh data is copied from the CPU to the GPU every frame, creating a bottleneck in graphics programming.

GPU Instancing

• To avoid copying data every frame, a massive buffer of grass positions is created on the GPU.
• The GPU uses this buffer to find the proper grass position each frame.
• This technique, called GPU instancing, is ideal for grass because it doesn't need to exist on the CPU side.
• The downside is anything instantiated by the GPU doesn't technically exist as far as the CPU is aware.

Calculating Grass Positions with Compute Shader

• Grass positions are calculated using a compute shader.
• The positions go directly into the GPU buffer, avoiding CPU copying.
• The positions fill a square space, e.g., 300 for a 300x300 meter plane.
• The thread ID of the compute shader thread is used to determine position.
• The thread ID ranges from 0 to 300 for both axes, then subtracting 150 centers it over the origin.
• With these positions, the GPU can instantiate the grass.

Instancing Billboard Grass

• The billboard grass is composed of three meshes, resulting in three separate instancing calls.
• One grass object is placed every meter.
• The amount of grass objects is doubled by multiplying the calculated position by 1/2.
• Two grass objects are rendered per meter, each consisting of three quads, i.e., 12 vertices and 6 triangles.
• With 300 meters squared, this equates to 2,160,000 triangles drawn every frame just for the grass, at an average framerate of 500 FPS.
• This setup would not be possible without GPU instancing.

Adding Variance to Grass

• The grass looks uniform and unrealistic, so variance is added to the grass positions to remove uniformity.
• Variance to the height of grass using simplex noise is added, causing height variance to clump together.
• Higher grass is grouped with higher grass, similar to real life.

Animating the Grass

• Grass is long and thin, making it susceptible to wind.
• Instead of simulating wind, the animation is faked in the vertex shader.

Skewing the Grass

• The grass model has only 4 vertices to work with, with only the top two moving.
• The basic idea is to skew the grass back and forth.
• Oscillators in the form of trig functions are used, with trig values and random numbers used to create the animation.

Animation Details

• The animation involves hashing the instance ID of the grass object to get a unique random number.
• If the hash value is above a threshold, a cosine value with a faster frequency is computed; otherwise, the default cosine value is computed.
• The frequency is reduced on taller grass since it would take longer to swing.
• The amplitude is squared and subtracted from based on the ID hash to add local variance.
• Amplitude is the distance a grass object will sway from its original position.
• This value is added to the local position of the topside vertices, scaled by the hash ID.
• Used for further localized variance and height variance, taller grass will sway further than shorter grass.
• This animation is computationally cheaper than a full physics simulation of wind and is more realistic since the grass data doesn't exist on the CPU.

Displacement and Homogeneity

• The plane has its vertices displaced.
• The grass converts world space coordinates to UV coordinates to sample the same height map as the terrain mesh.
• The grass now properly displaces along with the terrain.
• The color of the grass is homogenously and uncomfortably so.

Visualizing Old and Young Grass

• Older grass is more yellow, while younger grass is greener.
• Taller grass is considered older, and a height modifier is used to calculate height variance.
• A new value controls how yellow the grass turns, using vertical UV coordinates to interpolate its strength.
• Increasing height causes only the tips of the grass to become yellow.

Performance and Optimizations

• The grass performance is good.
• In the real world, such dense grass instantiation is rare.
• Level of detail optimizations include culling grass in the vertex shader and triangles in the geometry shader.
• Grass vertices outside the camera view or beyond a certain distance are culled.
• Tessellation on the terrain is reduced or eliminated since the grass obscures it.

Reducing Shaders

• Reducing the amount of instructions in vertex and fragment shaders is a key optimization.
• Instantiating many meshes means even a single instruction can scale highly in cost.
• Rendering 2,160,000 triangles (4,320,000 vertices) means the vertex shader executes that many times per frame.
• Reducing vertex shader animation complexity improves performance.

Billboard Grass - Performance and Limitations

• Billboard grass is a fast and performant option for rendering foliage.
• Billboard grass appears in nearly every game.
• One problem is when the grass is viewed from above, it doesn't look good.
• This is not a problem if the game has a fixed camera angle.

Improving Billboard Grass

• Modern foliage rendering techniques seek to solve the overhead view issue with more geometry, which comes at the expense of performance.
• 3D modeling foliage improves the overall appearance.
• Simple post-processing effects can also improve the appearance of the grass.