Shader Tutorial for GameMaker 25 - Side-Scroller Water Shader

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
[Music] hi I'm Reverend Craig and I welcome you to this video in the tutorial series traders for all the programs in this video will create this side-scroller water surface trader I will explain each step that I won't explain every detail since everything we need to know to create two shaded was covered in another video tutorial already in the last few videos we learned a lot about fragment distortion and distorting with maps and in earlier videos we covered color effects like Photoshop blend modes despite not covering all the basics this is going to be a rather long video I just hope it won't be too boring or too fast so just leave a comment if you think the pacing of this video is off I'm curious about it there's always a short disclaimer first it's going to produce a struggle with understanding shaders I'm not a professional programmer they're not making it mess so you see a mistake in my video see they like to sell the problem before starting I'd like to talk about two important limitations of this method first being this is not a water simulation so we can't just place a rock into what'n expect the water to flow around it it's just a distortion effect trying to look like a water surface and second the reflection completely ignores distance of the reflected objects let's say we got this background sky and water surface we got some rocks in the background at different depths and a bridge in front of these rocks then this is what the reflection should look like each item is reflected at the line where it touches the water surface for the sky that's the horizon if we draw the reflections that way we'll have to draw each object twice in the original to the application surface and the reflection to the reflection surface and this can get complicated and will definitely cost power so instead we're going to ignore depth and simplify by a lot we won't be able to draw a bridge but a dam instead and now everything is connected to the horizon like this then we just copy the application surface and draw it mirrored along the horizon so instead of drawing everything twice we just use a copy it's still wrong we still ignore distance and angles but it will be fast and still looking good enough for this use case that said at the end of this video tutorial I'm showing a method to respect depth and position if you want to the Ducks in the preview are an example of how it could be done so we're going to build this effect step by step we need to get the reflection of the game onto the surface and then distort the reflection look like water will blend the reflection with a solid color using Photoshop blend modes and will add some basic color justments like brightness saturation and contrast then to improve the look further we'll mix that college reflection with another solid color the darker the reflection is the more of that other color it will receive after that we'll add a waterline to make it look more like a body of water and in the end we'll add some rubber ducks to show how you could add flotsam or boats or other stuff that need to respect depth let's have a look at the project first though there are a few sprites a from base project I'm using the sunnylands sprites created by Luis zoo no links to his patreon and open game art sites are in the description beneath this video we're going to use the tile set and the two background sprites then I also added some sprites specific to this tutorial a water object sprite so we can see the water object in room editor a distortion sprite with three different leopard patterns on each color channel the patterns all need to tile seamlessly and the sprite needs to be on a separate extra page needs to be square and it's dimensions need to be any two to the power of n and then the water line sprite it's just one pixel its collar is white and it's always a bit less than 0.5 and finally the duck sprite its origin should be rather low since we're going to flip it for the reflection we're going to look at the shade and the main object later so let's have a look at the other objects next I've used the base projects wall object to add solid collisions to the mock up game it's not really important for the shade effect to work the object waterside background is just a very very simple parallax background object during the two forest background images from the base project again not important for the shader and just part of the mock up the play object is just a very simple object to move around to demo again not important for the shade of to work and finally the dark object and this is part of the tutorial but the code in it is simple we'll go to look at it when we add the Ducks to the game and this is the room it's a bit more complicated than usual in my tutorials one reason is I've created a small mock-up game with different layers and the second reason is I wanted to have lots of shader variables be dynamic for the tutorial and thus I needed lots of sliders and buttons on the GUI and this instance layer is the parallax background object on the next three layers is the mock up games tileset then there's the wall layer for collisions the main layer with a player instance and the water effect instance and the duck layer with all the duck instances now on the gooey layers I added lots of gooey elements we got 20 sliders in this creation order and four toggle groups with one or four toggle buttons in each now this is the main object object Waterside distortion so let's have a look at its events create event inside the title region as always it's just some description and stuff needed for the demo project but not for the shade effect to work the same goes for Digweed region and she's setting up the captions of all sliders and toggle buttons and their initial values the important stuff is in the sprite and shader region here I'm setting up the distortion sprite that's the one with the three leopard patterns then the shader and all its uniforms mind that most of those uniforms are only needed to find interesting settings once you've got what you want you could and should turn as many of those uniforms into Constance or Mac revs you distort text will send the texture ID of the distortion sprite you water shift RGB will be used to move the three leopard patterns along the X or Y axis to create a flow you distort strength sets the distortions strength you pattern size will send a scale factor for the distortion maps and thus changes the size of the distortion you what a call is the second solid color will mix the reflection with the first color we'll use to apply the Photoshop blend modes will not be sent as a uniform but as a vertex Col instead then you call mix will determine how the reflection color is mixed with the water color you virt Satcon will be used to change brightness saturation and contrast you blend mode is for testing only with it will be able to dynamically change the blend mode from overlay to soft light hard light and vivid light and finally you show result is for debugging only with this will be able to show the distortion Maps instead of the water reflection then after setting up the shader stuff we'll also need some other variables the stores text is the ID of the distortion texture what a shift bar J and B are going to change each step to make the water move and surf water will be the surface ID we draw the reflection on so the create event looks like it's a lot but that's mainly due to this demo setup in a real game you'd only need to shade the distort sprite and only some of those uniforms now in cleanup event I need to reset the demo projects camera because the mock-up is scaled by factor 3 and I just need to reset that factor to 1 before the shade effect only the second line is important freeing the water surface to prevent memory leaks the step event is as simple as optional I'm just moving the water object up and down in a sine wave behavior it's absolutely unnatural but for some reason I like the effect anyways enjoyment is empty and just here so did watcher dummy sprite won't be drawn and all the important drawing stuff is in the draw and event so after everything in the game has been drawn to the application surface again due to the demo nature this event looks like this a lot but most of it is just to keep the effect as dynamic as possible in a real game you wouldn't need half of the code here step one is creating the water surface with the reflection of the application surface on it before looking at this code let me explain how we're going to do this this is the game without the water effect and the red line is showing the Y position of the water instance this is going to be the water level to get a reflection we need to create a surface for the water it's as wide as the application surface and its height will be the distance from the water line down to the bottom of the view then we can draw the upper part of the application surface to the water surface with a negative Y scale then to make this look more natural we squash the water surface this will create a black bar at the bottom for now there later we'll fill that with a water color and the distortion will make it look really good after that we'll add some optional stuff first we can create a smaller surface draw the application surfaces upper part scaled down to the water surface and then draw the water surface scaled up back to the application surface like this we can work with smaller surfaces but depending on art style or game resolution it might look good or horrible especially in pixel art without sub pixels as this demo project is it looks just awful with we down scaled by a factors less than 0.6 6 this reflection in example is scaled by 0.5 and this by 0.25 and finally we'll add a toggle to either set the linear interpolation filter on or off however as you will see in this won't fix the scaling issue now to coat for now I commented out everything we won't need for this step the first thing we need to know is if the water surface with a reflection on it would be in the view because if not we won't need to create a reflection at all so we need to know where the view currently is and we need to know the height of the application surface we're inside the water objects draw end event so we can compare its Y position with the views Y position plus the height of the application surface if the water instance is Y is smaller then we're drawing the reflection and all the way down if the water is not in view I'll just draw circles as debug information will use those circles for more debug information later now if we draw the water surface then we need some more information what a y scale is the squash in fact I just described the value is taken from slide zero and the lower the slider is the more of the reflection will be squashed vertically it must never be zero though because later we're going to use it as a divisor what your level is the water lines Y position on the view so we can subtract view Y from the water instances y the water surfaces with is the same as the application surface with and water surfaces height is just the difference of the application surfaces height and the water level but it needs to be at least one since the surface height of zero is not allowed and would throw an error later the reflection height is the height above the waterline that fits onto the water surface after squashing it but let me explain this with an illustration we're going to draw two scenes at different positions in split screen in the first scene the player-character is very close to the water surface which means the surface is quite tall and what a y scale factor is 0.5 said the reflection isn't filling the entire water surface that's why we got a black bar in it now the application height is of course the height from top to bottom water level is a part of the application surface above the waterline and the water surface height is the remainder now the reflection height is the part of the application surface above the waterline that would fit onto the water surface if you look at the code you see we're using a min function if we take the first attribute surf water height divided by what a wide-scale which in this case would be serve water height times 2 would get a reflection height that is much larger than the water level means we will try to reflect things that are not on the application surface anymore the second attribute in the min function is smaller there is just water level so we are using everything above the water line to reflect onto the water surface now in the second scene the player character is far away from the water surface of course the application surfaces height stays the same but the relation of water level and surf water height was changed the water line is much lower in the screen and thus the water surfaces height is a lot less now the reflection height again is a part of the application surface above the waterline that would fit on to the water surface if we take the second attribute in the main function like we did in the other scene this would be reflection height the same as water level but you can easily see with draw more than fits on to the water surface so reflection height is too tall now so in this scene the first attribute of the mini function is smaller this time we set reflection height to the water surface as height divided by the water-wise scale factor you might have noticed I'm also subtracting 2 from the reflection height that's for a later step really but back to the code the last information we need is a surface scale factor this will determine by how much the water surface is scaled down to draw upon and scaled up to draw back onto the application surface I'm grabbing that factor from a toggle button group it's either going to be 1 or points and 5 0.66 0.5 or 0.3 3 with all that information we can now draw the reflection onto the water surface first we'll set the linear texture filter on or off depending on yet another toggle bottom check if the water surface exists if not we'll create one and if it does we'll resize it it's dimensions are served water with or serve water height times surface scale after that we can set the render target to the water surface clear it to black for now and then draw the application surface onto the water surface we'll need the function draw surface part X for this we're drawing the application surface the left attribute is zero and the top attribute is water level the width attribute is served water width and the height attribute is negative reflection height doesn't really matter that we flip the top and bottom like this the X scale is just a surface scale factor and the y scale is negative water Y scaled times the surface scale factor so we flipped the image horizontally and the vertex collar is just white with alpha one with this the reflection is on the water surface and we can reset the render target now all we need to do is throw that surface at Buicks instance Y scaled up by the surface scale factor without rotation and white one again and then we can set the texture filter defaults again because we're drawing a pig's log game so this works reflections are in and the squashing slider works as well so does the sofa scale factor and the linear texture interpolation total but as soon as we walk around the reflection starts to flicker a lot it's the same problem as in the scale blurring video when scaling down will lose pixel information and pixels just pop in and out depending on the cameras position now this is a pixel art mock-up without sub pixels I'm guessing with sub pixels this wouldn't flicker as much or at all they're up here we can see the two white circles in the top left corner after view so we know at the moment the drawing code is completely skipping the water surface stuff because it's not in view anyways with a scale factor 0.75 it looks acceptable especially once we distort the surface the flickering would be nearly gone and of course with the linear texture interpolation on the flickering is less noticeable as well now let's distort the reflection in this part is pretty much what we did in the previous videos in the tunnel distortion video I explained fragment distortion in general and then the heat haze flag and flame distortion videos we were already using distortion maps we're back in the draw and event of the water object and we'll need to add a few more lines of code now the first three new variables are water shift r g and b those will be used to move the distortion patter along the X or Y axis in create event those three were set to zero and here we're constantly adding or subtracting to them an example what a shift are is constantly adding slide 1 times 2 minus 1 so if slider 1 is 0 what a shift R will be decreased by 1 each frame which means the distortion patterns red channel will shift one room pixel per frame if slide 1 is 0.5 what a shift are will not change and if slider 1 is 1 then what shift R will be increased by 1 each frame the same goes for water shift G and for water shift Bay strength X and strength Y will be used as distortion factor but that's nothing new in this tutorial series and finally pattern width and height are the distortion pattern sprite width and height multiplied by a factor with this we can determine the scale of the distortion pattern more easily I've already set the factors to slide a 6 times 2 and slide as 7 times 0.25 and it's less for the height because I want the distortion pattern to look stretched in the x-axis I've used the max function to keep the variables above 0 because inside the water shader we'll divide by this but actually it wouldn't be important a shader just returns zero when dividing by zero and frankly if patent size is serum there's something awfully wrong with your code anyways but we'll see how these factors work when run the demo later shell result will be used to tell the shader to draw the pattern instead of the distorted water election so this will help us understand the scale factors the water shift RGB movement and so on now the creation of the water surface is unchanged in this step now we got everything we need for the shader so instead of just drawing the water surface back to the application surface we need to set up the shader first and reset it afterwards the uniforms we need for now are the back three water shift RG and B vector distortion strength the vector pattern size and the float show result and of course we also need to pass in the distortion texture then we can draw the water surface to the application surface and reset the shader the rest stays the same so let's move to the vertex shader very early on in this tutorial series we learned about different coordinate systems inside the shader in example VB text cord is a coordinate system based on the texture coordinates of the base texture and in position is a coordinate system based on the rooms x and y coordinates now here we'll create our own coordinate system it's in texture coordinates for the distortion maps but it's based on the room coordinates as well like this we can control the movements of the distortion maps but at the same time tie the coordinates to the room so when the camera moves in through the room the pattern but let me once more try to explain this with an illustration this is the image already distorted and above that is the code in the object and the vertex shader the distortion will happen in the fragment chain though in the vertex shader which is built a coordinate system for there let's have a look at water shift RG and B first in create event we've set those to zero in your end event we in or decrease them by something from negative one to positive one each frame then we send those three variables to the vertex shader as a very uniform now in the vertex shader we tried three new bearing vectors I call them V V position r g and b and those will be a coordinate system for the red green and blue color channels of the distortion map anna main function of this vertex shader we created as three coordinate systems we start with in position of XY those are the room coordinates of each vertex so if top left vertex of the water surface is X 100 Y 200 then in position of that vertex is the same X 100 y 200 then we subtract avec to build from water shift RG r v and z r in the coordinate system for the red and green channels we subtract water shift R or T from the X room coordinate so we're shifting the coordinate system along the x axis and then the coordinate system for the blue channel we subtract water shift B from the wine room coordinates and thus shift the coordinate system along the y axis then we divide that by pattern size so let's have a look at the pattern next this is the pattern sprite with its three maps on the red green and blue channel and this is the pattern if we would pick samples at VB tax code since Patchen is on a separate text page and the base texture is the surface so both images you v's range from 0 0 to 1 1 the result would be a stretched pattern now enjoy end event we stretch the patterns with by facted 2 and its height by factor 0.25 the result would look something like this or like this if we reduce brightness a bit now let's go back to the uniform vector pattern size pattern size is built in the door and event it's the pattern sprites width and height in pixels multiplied by a scale factor so it's still based on pixels in the vertex shader inside the main function we calculated constantly shifting coordinate system based on room coordinates so kind of pixels as well now dividing the shifted position in pixels by pattern size in pixels we'll get the coordinate system in texture coordinates those coordinates can of course be below 0 or above 1 but we'll have to fix that in a fragment shader with the fracked function later now if water shift R is positive one water shift G is negative 0.5 and what are shift V is positive 0.2 this means the red pattern will move to the right by one pixel per frame the green pattern will move to the left by half a pixel per frame and the blue pattern will move down by 0.2 pixels per frame the ability to move all three patterns at different speeds and in different directions is what gives the water surface a seemingly random distortion and which allows us to make the surface look like still water or flowing water and since we tied the coordinates to the room coordinates the pattern will stick to the room Corden's as well so if we run around in our mock-up game the water distortion will not move with the player or camera it will stick to the water surface and that's it for the vertex shader there's nothing else important here we still need other vertex attributes and bearings including vertex color for this shader and the vertex shader won't change for the rest of the tutorial anymore the fragment China like the draw and event has still several sections commented out here as well we'll add them step by step but let's have a look at what's in here for now though in the header you can see the three new varying back to V V position RGB and remaining uniforms back to distort strength for the effect strength sample 2d distort text for the distortion pattern texture and float show result so we can show either the distortion pattern or the distorted surface to debug inside the main function we first need to take samples from the distortion texture so we grab a sample from the red green and blue channel at VB position our G or B and store the sample in Effect 3 called distort sample mentioned Vivi position now is in texture coordinates but could be negative or more than one to fix that well just get the fractional part of Vivi position now our components of this thought sample range from zero to one if we'd use that the distort Direction would always be to the right or down and I actually want them to go left and up as well that's why I decreased distort sample by 0.5 before moving on now that we got the distort sample we can create a distortion vector from there this is a bit of a complicated line we create your back to distort from back to install sample dot o-r-g and multiply it by the float distort samples of Bay so distort X is made of distort sample dot R times distort sample dot B and distort y is made of distort sample dot G times distort sample of be like this we get control over the waters movement then we multiply both distort components by the vector to distort strength so we can determine how much the X and the y axis get distorted and finally we're multiplying both distort x and y by the float 0.2 plus 0.8 times V V Tech score top y this means the distort strength is again x factor 0.2 if V V Tech score Y is 0 and by factor 1 if V V Tech scored or Y is 1 or in other words the distort strength is reduced at the top of the water surface and increase to full strength at the bottom of the water surface this will add some depth to the effect now with the distort vector we can finally get a sample from base texture Vic free base cone is the sample colors on TB @ VV text code plus restored back to clamped to 0 & 1 so the sample coordinates won't leave the surface texture and that's it for the distortion now we just need to add the debug function to show the distort sample instead of the distorted water surface so all the way down we got a new vector3 out call and mix face call and distort sample by the mix amount of shell result so if show result is zero we'll see the distorted face texture and if show result is one will see the stored samples components the last line of course is set in the output color which is just a bag full created from out : 1 the distortion works now with the strength x and y uniforms we can set the effect strength the X distortion should be kept rather low but the Y distortion looks good and nearly any setting from 0 to 1 and with scale X and y we can set a scale of the pattern you with speed RT and B we can set or stop the movement that's the uniform back three water shift RGB in the vertex shader and with show result on the debug slider we can show the back three distort sample to better see what water shift are to be uniform does I'll change the scale of it now we can see the three leopard maps quite clearly water shift B will move the blue pattern up or down and thus gives the feeling of water moving towards the shore or away from the show you what a shift art we'll just add some irregularities bit will not change the flow after watching you and what the shift G will move to Green pattern left or right and will give the feeling of water flowing in that direction now I'd like to show and fix the small issue I'm setting the squashing factor so that the black parts at the bottom of the water surface are chest so visible now if I jump up and land again you'll see that the black parts appear quite suddenly and depending on the water level this can look glittery even the black areas are created when we cleared the water surface with black alpha-1 and the reason this only happens sometimes is that the black part only shows when the reflection is smaller than the water surface fortunately there's an easy fix we just need to make sure there's at least a couple of pixels of blackness on the bottom of the water surface which means we just need to reduce the reflection height by a bit so back in water objects draw and event we can just subtract two from reflection height and this will fix the issue so if we run this again and set the same squashing level as before we can see the issue is fixed actually no matter where we are now and no matter by how much we squash there will always be some blackness at the bottom of the water surface now all the complicated stuff is done we just need to tweak the colors and make this look prettier so the next step is adding a vertex collar and blend that with the distorted water surface we're going to simulate some footage of blend modes that work quite nicely with this shader so now we need a blending call I've set up three slides for that so we can create an HSV collar dynamically then for this demo project I also want to change the blend mode type dynamically so I've set up a toggle button group for that to tell the shader what blend mode to use we need to add the uniform blend mode and here we also need to change how the water surface is drawn instead of setting a white vertex color we'll set the vertex call it to blend call and now I'm adding one of the debug circles this will draw a circle in the blend call to the upper left corner of the view so we can see the blend caller visualized inside the fragment shader we first need to add the blend mode uniform and then the blending code we talked about simulating Photoshop blend modes before in video 8b day/night cycle version 1.1 so I won't explain here but like then I've just used formulas by arrow Elio Bernal a link to his site is in the description beneath this video I've added the blend modes overlay soft light hard light and vivid light and used if statements to determine which blender to use once you decide which blend mode you want in your game you really should remove the other three modes and the if statements branched code in fragment shaders tend to cost quite some performance and the only reason I did it this way is for demo reasons and now the debug line needs to be changed a bit we're mixing outcall now instead of face call and then we can run this code again see that a water is now call it the blended caller is shown in the debug circle in the upper left corner and with the blend HSV sliders we can change their color and with the blend mode toggle switch can change the way this call is mixed with the reflection we got the overlay which just pushes the callers to it's blue the soft light which does something similar bit less saturated the hard light which looks more like tinting blue and vivid light which again pushes in a very saturated and vivid way now the next step adjusting the colors in general for some reason I wanted to add brightness saturation and contrast depending on what you want to achieve this might help or not at all this is something we did many times already in this tutorial series so there's nothing new to explain we'll just need a brightness saturation and contrast value from three more sliders and we need to pass those values to the shader as a BEC 3 fragment shaders header we now need to add that uniform back three in the main function right after the blend mode section we can add in college chestnuts brightness saturation and contest to get some filthy dirty water with those adjustment options and with these settings to what who really looks uninviting sarcastically cheston's do help find a nice settings quickly next I'd like to replace those black areas at the bottom of the water surface with another Cola and I want to tint the darker areas of the reflection with that color as well we'll need three new variables the first is the new color again I've set up three sliders to create an 8 as we call it dynamically the other two variables are mixing thresholds we'll see how those work when we look at the fragment shader mind that the first call mix ranges from negative 0.5 to positive 0.5 and the second call mix from 0.5 to 1.5 it's important that those ranges don't overlap and that the first range is lower than the second also the upper end of the first value and the lower end of the second value should both be somewhere between 0.2 and 0.8 and now instead of clearing the water surface to black we can clear it to the new water color in the shader section we can now pass in the water call a spec 3 and the mixing thresholds aspect too and in the debug section I'm just adding in the second circle which will be filled with the water color in fragment shaders header we need to add the new uniforms back free watercolor and back to comics and in the main function after the color justments we can now mix the two colors again this is nothing new in the series we did that first time I think in the video undo atoning we're mixing water call and out call the mix amount is a smooth step value the value is the brightness of the base color nuts the out coin the lower threshold is first called mixed value and the upper threshold is the second comics value so if the value of base call is lower than the lower threshold we'll get the watercolor if the value of base call is larger than the upper threshold we'll get out call and for any value in between we'll get a smooth step mix of those two colors now with this or fragment shaders finished the remaining two tweaks are done in the draw and event only so we can close the fragment shader here as well but once you found nice settings for the shady you should definitely turn as many uniforms into constants as possible so let's see how this affects the overall look or moved first I'm picking a yellowish saturated orange blend color now if I move to watercolor you you can see how it mainly affects the dark areas on the water surface setting the water color to a dark saturated blue adds a nice contrast between dark and light already now the lower mixing threshold mainly effects the darker valleys and the higher that threshold is the more it is considered to be dark and the upper threshold determines how much the watercolor influences the light to coalesce with both our 0.3 we can improve that already nice contrast even more and clicking through the blend bones again shows how they influence the mood as well here I really like the vivid light although it doesn't really match the mock-up level what I still don't like however is the waterline it feels like there should be a nice a boarder between water and shawl so we're going to add a line there and this is going to be extremely simple in the beginning our already showed you despite we're going to use it's just this one pixel small sprite it's called as white and it's alpha is just below 0.5 so all we need to do is draw this sprite stretched across the top of the water surface after drawing the reflection onto the surface technically this would reduce the ALF of the water surface in my tests that was not an issue but if it is in your project then just adds the two lines are commented out the first locks the Alpha channel and the second opens it this doesn't look perfect by any means but it looks so much better than before and this effect costs hardly any additional performance and now the last step how to draw things onto the water and get a reflection anyways we're going to draw rubber duckies floating on water but it since for some reason I wanted that effect to be top level I'll just add this line of code here then while drawn to the water surface bay after drawing the reflection and water line I'm going to draw the Ducks flipped upside down to the water surface so I'm just referring to our duck objects and tell them to draw their sprites at their position in view changed by the surface scale and flipped upside down this will create the reflection of course if you'd have different floating objects you'd call a parent object here and if you have lots of floating instances you probably want to check if they're in view before drawing then after the water surface has been drawn back to the application surface I'm just calling draw self and I'll duck objects here again if you've got different protein objects you call the parent and if you've got lots of instances you'd want to check if they're in view first now the dark object I kept ultra simple it just has a step event if there's no water object do nothing the local VAR h speed is just grabbing the movement of the green distortion map since that's the one giving the illusion of moving water X is in or decreased by H speed Y just six to the water instances Y in case that changes flip the sprite according to the eight speed sign and I just wrapped the exposition around the room size now we got our ducks floating along the river and they even have a reflection however the reflection is a bit off because there shouldn't be any above the Ducks now two thoughts about what you can do or should think of when adding objects on top like the duckies the first is if you add more complex things you can't just flip the sprite to draw the reflection let's take this boat as an example if we just flip the image this would be awfully wrong the shape is wrong the angles are wrong and while we can look into the boat from above we shouldn't be able to see the inside of the boat in the reflection so we actually have to draw a separate reflection image to fix all that and if you want to add a water line just draw a white line onto the reflection image like this and it will be distorted automatically the other thing is this in the beginning of this video I said we can only mirror along one single horizon line like in this image I claimed we can't do this where each object has its own depth but actually that's what we did with the Ducks so yes you can do this but you have to find a performant way to do it and reflecting tiles like that might be quite challenging anyways I think this shader is really nice although not being a fluid simulation and I hope you like it too I hope I found a pace for this video that suits most viewers next time our plan to finally add a shock wave distortion effect using normal Maps until next time you
Info
Channel: Gaming Reverends - DevCorner
Views: 6,224
Rating: undefined out of 5
Keywords: Shader Tutorial GameMaker, Shader Tutorial, YouTube Shader Tutorial, GameMaker, GameMaker Studio, Shader, GLSL, GMS, GMS2, distortion, map distortion, water distortion, water
Id: FqcbkVHqPk8
Channel Id: undefined
Length: 38min 20sec (2300 seconds)
Published: Sat Mar 23 2019
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.