Graphics Swaying grass tutorial - GMWolf

GMWolf

aka fel666
GM Version: GameMaker:Studio 2
Target Platform: ALL
Download: N/A
Links: YouTube Video
Summary:
Add lush swaying grass to your game with this powerful solution.
This video aims to introduce you to Vertex Buffers and Vertex Shaders in GameMaker Studio 2, by building a a simple grass mesh generator, with a simple shader to animate it.

Tutorial:
Hope you find this useful! I would love to see what you come up with!
 
T

trichome

Guest
grass_shader.PNG

Cheers for this Fel666, just finished your tutorial and have a working moving grass shader :). It's my first attempt at a shader and using vertexes.

Very nice tutorial and easy to follow.
 

Sammi3

Member
So this is what they did on breath of the wild... :p
I'm trying to convert this from triangles into a trianglestrip (my grass is more rectangular). You used 2 triangles per blade of grass on this one (t1 and t2) what part of the blade do each of these triangles correspond to?
 

GMWolf

aka fel666
So this is what they did on breath of the wild... :p
I'm trying to convert this from triangles into a trianglestrip (my grass is more rectangular). You used 2 triangles per blade of grass on this one (t1 and t2) what part of the blade do each of these triangles correspond to?
I actualmy use more than two triangles (notice the for loop?)

The pair of triangles actually form a rectangle, and multiple rectangles are used to build up a blade of grass.
 

Sammi3

Member
I actualmy use more than two triangles (notice the for loop?)

The pair of triangles actually form a rectangle, and multiple rectangles are used to build up a blade of grass.
So I wouldn't have to change it into a trianglestrip but rather keep the base width and top width consistent with each other?
 

GMWolf

aka fel666
So I wouldn't have to change it into a trianglestrip but rather keep the base width and top width consistent with each other?
Yes.
The reason I don't use triangle strip is to have multiple blades of grass in the same buffer.

If you ony have a single blade, then triNgl strip may be better. But I have not seen much performance different e from just using triangle list.
 

Sammi3

Member
That was easy. I even added random distances between the blades and random heights. You're the hero the GMC needs but doesn't deserve!

 

GMWolf

aka fel666
That was easy. I even added random distances between the blades and random heights. You're the hero the GMC needs but doesn't deserve!

Hey that is very cool looking! The randomness really does add to It, and I like the square style!

Something you could try is have each blade have a different "stiffness" by adding a new attribute.
 
D

DevGuyDonny

Guest
Cool, will have to give your tutorial a try. :)

What's the framerate like?
 

GMWolf

aka fel666
Cool, will have to give your tutorial a try. :)

What's the framerate like?
Very good. Each patch of grass is a single draw call. And the shader is practically free.

Actual numbers will depend on your hardware, but it's plenty fast enough to cover your maps with grass.
 
D

DevGuyDonny

Guest
Nice. Will have a try today and post how I go. Wish me luck! :)
 

Nux

Member
I had followed your tutorial and managed to get this result, but it didn't replicate my desired grass effect strongly enough. It was so close but I hit a brick wall.
I really liked the tutorial though and I learnt how to use vertex buffers and vertex shaders, so i appreciate that! ;o
 

Star Dust

Member
That was easy. I even added random distances between the blades and random heights. You're the hero the GMC needs but doesn't deserve!

Hi! What changes you did, to get this result?
var x1 = xx + (width - base_w) / 2;
var y1 = yy - i * seg_height;
var x2 = x1 + base_w;
var y2 = y1;
var x3 = xx + (width - top_w) / 2;
var y3 = y1 - seg_height;
var x4 = x3 + top_w;
var y4 = y3;
 
Top