My funky (and not so funky) grass shader

Because I am tired of being a lurker at the Unreal Engine forums I decided to post something here to get rid of my lurker status :smiley:

After almost giving up on making grass on UE4 due to absence of a non directional shader (or rather, my lack of skill at shaders and lazyness at editing normals :rolleyes:) I came across a way to emulate the shading model from UDK. (thanks to Ulrich.Thümmler for this!)

The shader is set up with multiple parameters such as color, color variation color (couldn’t come up with a more confusing name, sorry), color variation scale, contrast, and UV offset (for multiple blade types in the same texture). All of the following where made by tweaking the shader.

Not so funky

Funky

p.s. Sorry for the aliasing but for some reason highres shot rendered it that way :confused:

Oh, very nice! How is the performance for you with that grass? The grass I currently use in my project is somewhat heavy so been considering switching it for some other method.

That looks really nice!

Would you mind going into some detail about how you made this and what you learnt? It looks fantastic!

This looks pretty cool, nicely done!

Thanks! That’s awesome

Awesome job dissonanceint! That grass looks amazing. Keep up the great work and hope to see more of your work in the future!

Thanks everyone for the comments!

Right now it is quite performance heavy but that is mainly because I haven’t optimized my method yet. The grass is set to cast shadows (which can be easily replaced by baking ambient occlusion to vertex colors), I am using no LODs (which would be a HUGE performance boost) no distance culling (Would lose the nice far away grass but in a game environment this could be acceptable at certain distances), I didn’t really tweak the clusters in foliage mode.

My method are regular grass planes and they are about double the triangles they should be. I decided to test how and extra edge vertical edge loop would look and there wasn’t any difference but it’s still there. Also, many of my planes occupy the same spot (I don’t gain anything from them so when optimizing time comes I’ll delete them. To be honest I just scattered them randomly and I expect to be able to third the polygon count when I take the appropiate time without any visible difference (the edge loop already cuts half). My 8m grass patch is about 8k triangles (which is way too much) I get around 40 - 50 fps on a Gtx 770 for that scene and 60-70 when grass doesn’t cast shadows (there shouldn’t be much difference visually with ambient occlusion). As a test, I deleted one edge loop and this went up to the 80s, still without LODs. Once I make them it should be very usable in realtime.

What method do you use?

What part exactly? The grass geometry or the shader (or both)?

Well I have a very simple material setup and mesh, pretty much I just have intersecting sloping planes together which are two sided and tangen space normals off to avoid any issue with light but with enough of them placed out it is still too heavy together with other foliage, I am running my project with a R9 290x. It is a very cartoony look which I would have liked to avoid but as it is now I can’t due to performance issues. I wish foliage was better handled in UE4 but the engine is young so I suppose we might see change later. (When not taking screenshots I am around 45-60FPS but I need to get that number up to at least 60-75 due to it being a oculus project.

092479259e34786e543c9dc465c68c494f0c251f.jpeg

Those look amazing! The cow inside me wants to go and get a taste of the blue grass. :o

So you want short grass right? I might be able to help you with that. The expense on my shader comes from the overlapping transparency and subsurface. In short grass, overlapping can be easily worked around and subsurface can be faked. If you PM soon on how to contact you I might be able to help you.

Blue grass tastes ok but I prefer the acid/sweet combination of my pink and yellow grass fields :stuck_out_tongue:

Oh sorry didn’t see this post until now. I’ll throw you a PM in a minute. And yes, short grass would be the best. :slight_smile:
Any help would be greatly appreciated as I am running out of time on my project and being able to improve the grass would be really good.

All of the above please. I’ve done a wee bit of grass but it slows my project down a lot, so I’ve had to use it sparingly. I guess I’m after your technique and things you know now that you didn’t know before you started.

I’ll see if I can make a small tutorial. Mostly, it’s about the grass texture and grass planes. The material aside from the editable parameters is just a diffuse with very basic sub surface scattering.

Keen as! I’ll be looking forward to it. :slight_smile:

Man, Rama’s gonna love that rainbow grass.

****, love the last pic! great job!

Here it goes:

Step 1, the grass blade texture.

  1. First, you start by finding a texture suitable for a blade of grass. It can be a regular gradient, a leaf closeup or a grass blade closeup. For this example I’ll just use a leaf grabbed from CGTextures.
  2. You make a couple variations from the base texture, maybe mirror it, add some noise, paint a color, it’s up to you. Just try to not overdo it. It works just the same as a regular texture. If there are too many unique details, you are going to notice the repetition.
  3. I like to add highlights to the grass blade edges.
  4. this is the perfect place to fake ambient occlusion (or cast shadows) or subsurface scattering only and ONLY if you are not going to use it in the engine to save performance.

417be58adedd17720abc0c62612568575b6b41e0.jpeg

Step 2, the grass blade model

  1. You start by applying the texture you made to a random plane. Remember to set it as a two sided material. To save time you can just chop off the pieces from there.
  2. You add a couple edges to support bending. Collapse the tip to form an arrow.
  3. Scale the blade until it looks more… grass blade-ish?
  4. How you bend the grass is up to you. I usually create a spline and deform my grass blade for more control. You can bend it manually or like I did in the example, use a bend modifier in Max.
  5. Create a couple of variations. You can mirror your blades to save time or just scale them.

Step 3, Baking the grass to a plane

  1. Now that you have your grass blades, just scatter them with your weapon of choice. I am using the default painting tools in max.
  2. You can create pretty much any kind of grass. Once you are happy with the results, set up an ortographic camera (not perspective) and 3 lights like in the image. Left and right lights should be at the same distance and the front light, well. That’s up to you. Depending on the distance, you’ll get different results. I don’t use a backlight because it kills the look and takes away depth but if you decide to use a normal map later on, you can use a backlight.
  3. Render out a diffuse map with alpha/opacity.
  4. In photoshop (or whatever you use) change the background to a more appropiate color to avoid artifacts. Save this as a 32 bit image to keep the opacity in the alpha map.

Step 4, The grass planes.

  1. Nothing special here. Just apply the material to a plane. I like to add an extra edge loop at the middle of the grass plane and bend it. This way, the grass doesn’t look to horrible when viewed from above.
  2. Create a couple of copies and modify them a bit to avoid repetition (mirroring, bending, etc.) And arrange them the following way:
  3. After that, just scatter them. In 3ds max, all the objects I create are instances. I’ll explain later how this is helpful.
    4)Usually, when you scatter, you want to create a circular shape (or octagonal, up to you). They blend much better against each other and doesn’t look unnatural when you place a single grass patch.
  4. Now, to create the LODs, just delete the middle edge loop on one instance. That reduces your polygon count by half. On the 2nd LOD, delete the intersecting grass plane and it halves the polygon count again. You can delete individual grass planes for optimization but I didn’t in this example.

Step 5, The Material

The material is really simple. This one has no wind but that’s easy to find around.

11889a12fec9d1c4d05989548e00a7d906d2be4e.jpeg

How it looks in-game

This was made in about 20 minutes or so. The more time you put into it, the better it will look.

Fun fact. I took longer writing this tutorial than making the grass.

Thanks! That’s a good tutorial.

So it’s a translucent material?

Masked. Shading model is subsurface