This looks like a good way to do deterministic serverside waves on dedicated servers without gpus. You load the 512x64x32bit texture into memory. Send each player boat position and velocity and do a matrix multiplication on just the part of the matrix you need and a few bouyancy points located around the boat
@@couragefox Yup, it's limited in resolution & space, and can't be dynamically updated to change the wave parameters though. Plenty of good things about this technique, but plenty of limitations :)
Huge thanks for this tutorial, my water looks great now while covering a huge distance, and when using it for cinematics it also looks great at a distance with the right scaling. All the while barely impacting my performance, pure magic.
I can across this video yesterday, and thought I’d let you know about a similar technique I used recently. Instead of setting up the material to use a flip book, I set the flip book texture to be a volumetric texture and then used world position as the texture coordinates, and added time to the Z component. This seemed to tile nicely, and smoothly transition between frames but without me having to set up any logic to handle it.
Yes, totally! A volume texture can simplifiy this process a lot! Whether it results in a faster shader has to be tested tho. I thought the old school flipbook approach was a better topic because it can be ported to other game engines that may not support volume textures yet and it's always good to learn how to do things yourself :D
This might be a silly question, but why is there a memory concern with the flipbook? Isn't it a single 4096x4096 texture that is sampled multiple times? Is that not particularly small in the grand scheme of things, in the case of a game that would utilize 2 or 2k textures for most assets?
Height & Normal, that's already 2 4Ks, plus potential Crest map, that's 3. For one single wave set. You may need multiples for different ocean conditions or to break the tiling. And each flipbook only offers an actual 512px tile resolution so you might need 8Ks. So there's definitely a memory concern, especially compared to a mathematical approach where the memory cost is null. GPU memory isn't as tight as it used to be but is still a limited resource and I wanted to point out that using multiple 4Ks texture isn't as given as people might think, in any production.
No benefits. UE's water plugin is one approach to render water & add buoyancy. It has its pros & cons. You might not like it or might not want the overhead it comes with just to render a pond or whatever. Knowing how to build your own alternatives is good.
I dont know what i made wrong but when i spawn second water plane near first one the transition between them is not seamless. can i fix this in engine or problem in my flipbooks?
Its starting to get 'expensive' at this point. Flowmaps double the texture sampler count for each texture set. That is already doubled for frame linear interpolation in the flipbook logic. So 4 texture samplers per texture set (height/crest/normal? 12? :( )
It's a bit of extra work, but to avoid the mipmap artifacts, you could author your own mipmaps. This can be done using the photoshop DDS plugin. The only thing is unreal is picky about what DDS formatting it accepts...
Very good point, but yes and no. You likely can't fix mips manually here, oversampling is required. Also Gimp can be used to edit DDS files as well, and the funny thing is I made a tweet about it very very recently :)
@@ghislaingirardot Ah cool I didn't know gimp was able to! Could I please ask you to explain the issue a bit more? Is it to do with making sure the border texels have enough surrounding information to downsample to the correct value?
@@Pseudocue Hmm can't really phrase it better than what I said in this video. There's nothing to fix with mips per say, data is going to bleed across nearby frames. So you need to sample a smaller region within each frame to prevent what bled to be sampled, so each frame must be scaled up and contain more than "100%" of whatever you want to render. Thus, called oversampling. Thus the fix must happen when the texture is first authored, there's nothing wrong with mips.
Great tutorial! But in Unreal 5.1, the material with a standard plane did not want to work, it just slid up and down. From Cinema 4D, I added a plane that had more segments and everything started working
Ty! exactly what @Sozidar said. I briefly mention in the video that the material should be applied to a subvidived plane. UE's default plane only has four vertices, so it's just going to slide up & down
Hey I wanted to ask if you can use a ue volume texture? I wonder if they support mipmaps. They removed the section for it from the ue5 docs... so don't know whats up with that.
Uh, I tend to forget about volume textures :D I don't know actually and I don't know if they suffer from the same issues flipbooks have. But I guess the good thing about going full manual with a good old flipbook approach is that it's engine agnostic. You could replicate the shader logic in any game engine and it'd work. No need to rely on volume textures that some engine might not implement. But it's worth investigating, you're right :)
@@ghislaingirardot True. And there is always another way to do things. But I looked into it. And it should solve the mipmap issue, probably. But the interesting thing is the mipmaps are 3D. So it will scale down the texture tiles but also take out tiles. (It will linear interpolate two tiles and merge them) So the waves would have reduced frame resolution in the distance. For example a 512 texture with 2x2 tiles. Would have on the 1. mipmap two 128x128 tiles and on the 2. only a single 64x64 tile. So waves would be static on that distance. I think it would need to be actually tested to see how it affects visual quality, but I think it will work great. Wonder if they have some internal optimisation or if they just sample two times like in your setup. (gpu should still need to sample 8 pixels on the texture, 2^3, but depending on how shaders are optimizied still more performant) I just found out there is a feature called texture array. This should work similiar but will not mipmap over the third dimension. You have to import all textures, select them and generate texture array. But I am not sure if you can directly input the third dimension by float or if you need to sample two times by hand. (Okay tested it will only accept integers)
@@kettenotter Texture array is to be tried as well, yup. I read that it suffer from complete lack of mipmapping so that could be an issue. I lack the good old flipbook approach tbh. Lets you have complete control over how the sampling is done :)
@@ghislaingirardot I tested it. And everything seems to work fine! It might be because they have turned them off by default (because they are used by UI often I think). But they work and also use them correct (at angles). I think under the hood it combines them to one long texture. Just with correct mipmaps.
Not sure if you know but you can set and read particle positions from Niagara in blueprints/CPP. You could actually have a particle system that spawns lets say 5000 particles at startup and stay active lifetime of the particle system. You can set where you want to sample the height texture and read back sampled particle's position in blueprints / c++. you could use that to make a buoyancy system.
Oh I knew you could read data from Niagara on the CPU but I didn't even think to use it to sample the wave height! I had built another solution so I'm eager to try that approach and compare performance/useability. Thanks a lot for sharing that idea :)
One of the benefits of using a flip book is that it's deterministic, and the code can derive height information for buoyancy and occlusion without having to read from the GPU. Even with DMA, Niagara reads are still bound by PCIe bus speed, which is orders of magnitude slower than CPU cache hits, or even memory access. The other benefit is that multiplayer experiences can provide all participants the same view of the ocean despite lag, latency, or differences in GPU capabilities for a given time stamp.
@@jklappenbach Hmm good points but I reckon you can achieve similar results with other methods. Sea of Thieve afaik uses FFT computed in real time with async GPU data readback for networked buyoancy and it can run decently on potato
@@ghislaingirardot I liked sea of thieves, and if I can get something at least that good, I'll be happy. However, my current goal is Black Flag. They did such a great job with wind texture on the waves. And the size of the waves became an obstacle in the game, periodically obscuring your target. But ACBF wasn't multiplayer, IIRC, so they didn't have to worry about determinism.
@@jklappenbach Determinism isn't an issue. FFT, Gerstner Waves and most other techniques whether there are pre-computed or computed on the go, are determinist and you still have to read wave data from the GPU. However GPU async readbacks are usually good enough and the 1/2 frame(s) delay isn't usually an issue for buoyancy and such. I reckon Black Flag is still based on FFT. Or maybe Gerstner waves with detail texturing like I did in previous video(s). Flipbooks are cool but they have their limitations. Can't make the ocean react to changes in wind speed for one. Limited resolution. Memory heavy and so on. There's no perfect method.
I love this tutorial, thank you so much! Idk why, my waves has a kinda black shadow/outline on them... I cant see where I have made a mistake. Could you help?
Nop. Waterfalls are not straightforward to make. It's usually a bunch of custom authored meshes. Then scroll a texture with stretched uvs, add some extra particles and tons of other details and you get a decent waterfall :p hard work
i made this in unity but the problem is you only get the vertical displacement. since you cantget horizontal displacement, the waves are not choppy. which is sad. but its a nice and optimized way for the ocean.
Hmm why do you only get vertical displacement? The Gerstner Waves aren't Engine specific, it's be done in every engines, Unity included. Are you sure you implemented the formula correctly? Displacement should be XYZ
@@ghislaingirardot What i was doing is put a camera above and shade it depending on height and render them. So i would only have a displacement map for y axis. I could not find a way to shade it for all the axices.
@@bdenix1997 My bad I had a bizarre TH-cam bug and thought you were commenting on another video. Yeah this method does only output height displacement and you need the normals to add the chopiness. Any texture applied to the water also won't get distorted with the waves, which is sad
@@ghislaingirardot I made an fft implementation just because i wanted choppiness. But its too performance heavy. Displacement map itself is not but the derivatives are killing it. + I am doing 2 cascades. But since i am generating waves based on time, i think i can make an animation and precalculate them just like this. Definetely worth trying.
@@bdenix1997 neat, congratz on the FFT implementation :D not easy to do. Might I ask what it costs and on what hardware? It does seem quite expensive but then Sea of Thieves uses an FFT simulation and it can run on potato so I'm not sure how they pulled that off. Anyway, yep you can for sure you a similar baking technique and output XYZ offsets into a flipbook from your FFT sim :) I'm jealous, I've yet to join the FFT sim gang ;)
@@ghislaingirardot Thank you. Due to the needs of the project, I need to find CPU coding (which requires CPP). I would like to ask if you have any projects in this regard for reference!
salut, j'ai un soucis, quand je relie le materiaux au world position, tout passe sous le sol de la preview, comment je fait ? je comprend pas tout c'est pour ca.... as tu un insta ? un discord ou autre pour que tu puisse maider plus facilement ? merci d'avance !
Salut. T'as du faire une erreur quelque part 🤷 mais impossible pour moi de dire d'où vient ton souci là comme ça... La meilleure soluce c'est de reprendre la vidéo depuis le début et de refaire les étapes une par une
@@ghislaingirardot salut, alors j’ai repris toute la vidéo de À à Z, le Bug survient au moment où je doit rajouté les 2 heigth map, et quand je fait le multiply avec 75, est ce que tu saurais m’aider ? Merci
Everything you do just looks so good!
Thank you! But you know I do create a fair share of crappy looking stuff, I just choose to show what ends up looking somewhat decent 😅
Amazing content, brilliant real world application of the Fourier transform
Just click here and there, et voilà, you got some cool looking water shader.
This looks like a good way to do deterministic serverside waves on dedicated servers without gpus. You load the 512x64x32bit texture into memory. Send each player boat position and velocity and do a matrix multiplication on just the part of the matrix you need and a few bouyancy points located around the boat
You get tessendorf waves but don't need to run ffts and therefore don't need GPU on dedicated server.
@@couragefox Yup, it's limited in resolution & space, and can't be dynamically updated to change the wave parameters though. Plenty of good things about this technique, but plenty of limitations :)
Huge thanks for this tutorial, my water looks great now while covering a huge distance, and when using it for cinematics it also looks great at a distance with the right scaling. All the while barely impacting my performance, pure magic.
Glad to hear my tutorial was helpful :) have fun!
I can across this video yesterday, and thought I’d let you know about a similar technique I used recently. Instead of setting up the material to use a flip book, I set the flip book texture to be a volumetric texture and then used world position as the texture coordinates, and added time to the Z component. This seemed to tile nicely, and smoothly transition between frames but without me having to set up any logic to handle it.
Yes, totally! A volume texture can simplifiy this process a lot! Whether it results in a faster shader has to be tested tho. I thought the old school flipbook approach was a better topic because it can be ported to other game engines that may not support volume textures yet and it's always good to learn how to do things yourself :D
This might be a silly question, but why is there a memory concern with the flipbook? Isn't it a single 4096x4096 texture that is sampled multiple times?
Is that not particularly small in the grand scheme of things, in the case of a game that would utilize 2 or 2k textures for most assets?
Height & Normal, that's already 2 4Ks, plus potential Crest map, that's 3. For one single wave set. You may need multiples for different ocean conditions or to break the tiling. And each flipbook only offers an actual 512px tile resolution so you might need 8Ks. So there's definitely a memory concern, especially compared to a mathematical approach where the memory cost is null. GPU memory isn't as tight as it used to be but is still a limited resource and I wanted to point out that using multiple 4Ks texture isn't as given as people might think, in any production.
why not using the water body plugin inside unreal ? is there any benefits to not using it ?
No benefits. UE's water plugin is one approach to render water & add buoyancy. It has its pros & cons. You might not like it or might not want the overhead it comes with just to render a pond or whatever. Knowing how to build your own alternatives is good.
Thank you! This is exactly what I've been looking for.
I dont know what i made wrong but when i spawn second water plane near first one the transition between them is not seamless. can i fix this in engine or problem in my flipbooks?
Impossible for me to tell sorry, could be either or both.
a quand la vidéo en Français ?
Tutorial d'une qualité incroyable, merci du partage !
Merci!
I’m wondering how feasible it would be to make this scroll and then possibly use this in combination with flow maps?
Totally doable. Great timing actually, have a look at my twitter, I posted something about FFT flipbook + flowmaps :)
Its starting to get 'expensive' at this point. Flowmaps double the texture sampler count for each texture set. That is already doubled for frame linear interpolation in the flipbook logic. So 4 texture samplers per texture set (height/crest/normal? 12? :( )
It's a bit of extra work, but to avoid the mipmap artifacts, you could author your own mipmaps. This can be done using the photoshop DDS plugin. The only thing is unreal is picky about what DDS formatting it accepts...
Very good point, but yes and no. You likely can't fix mips manually here, oversampling is required. Also Gimp can be used to edit DDS files as well, and the funny thing is I made a tweet about it very very recently :)
@@ghislaingirardot Ah cool I didn't know gimp was able to! Could I please ask you to explain the issue a bit more? Is it to do with making sure the border texels have enough surrounding information to downsample to the correct value?
@@Pseudocue Hmm can't really phrase it better than what I said in this video. There's nothing to fix with mips per say, data is going to bleed across nearby frames. So you need to sample a smaller region within each frame to prevent what bled to be sampled, so each frame must be scaled up and contain more than "100%" of whatever you want to render. Thus, called oversampling. Thus the fix must happen when the texture is first authored, there's nothing wrong with mips.
Amazingly well done video
Thanks, much appreciated!
still wait for river xD
Great tutorial! But in Unreal 5.1, the material with a standard plane did not want to work, it just slid up and down. From Cinema 4D, I added a plane that had more segments and everything started working
World Position Offset moves vertices, so the more vertices you have on your mesh - the better displacement will look.
Ty! exactly what @Sozidar said. I briefly mention in the video that the material should be applied to a subvidived plane. UE's default plane only has four vertices, so it's just going to slide up & down
Hi. Are you using Eevee?
Hi. No?
Wow. Miles ahead of some AAA games like Pokémon
Hey I wanted to ask if you can use a ue volume texture? I wonder if they support mipmaps. They removed the section for it from the ue5 docs... so don't know whats up with that.
Uh, I tend to forget about volume textures :D I don't know actually and I don't know if they suffer from the same issues flipbooks have. But I guess the good thing about going full manual with a good old flipbook approach is that it's engine agnostic. You could replicate the shader logic in any game engine and it'd work. No need to rely on volume textures that some engine might not implement. But it's worth investigating, you're right :)
@@ghislaingirardot True. And there is always another way to do things. But I looked into it. And it should solve the mipmap issue, probably. But the interesting thing is the mipmaps are 3D. So it will scale down the texture tiles but also take out tiles. (It will linear interpolate two tiles and merge them) So the waves would have reduced frame resolution in the distance. For example a 512 texture with 2x2 tiles. Would have on the 1. mipmap two 128x128 tiles and on the 2. only a single 64x64 tile. So waves would be static on that distance.
I think it would need to be actually tested to see how it affects visual quality, but I think it will work great. Wonder if they have some internal optimisation or if they just sample two times like in your setup. (gpu should still need to sample 8 pixels on the texture, 2^3, but depending on how shaders are optimizied still more performant)
I just found out there is a feature called texture array. This should work similiar but will not mipmap over the third dimension. You have to import all textures, select them and generate texture array. But I am not sure if you can directly input the third dimension by float or if you need to sample two times by hand. (Okay tested it will only accept integers)
@@kettenotter Texture array is to be tried as well, yup. I read that it suffer from complete lack of mipmapping so that could be an issue. I lack the good old flipbook approach tbh. Lets you have complete control over how the sampling is done :)
@@ghislaingirardot I tested it. And everything seems to work fine! It might be because they have turned them off by default (because they are used by UI often I think). But they work and also use them correct (at angles). I think under the hood it combines them to one long texture. Just with correct mipmaps.
@@kettenotter Gotcha! Good to know, ty for the feedback 😊
hi, i have a problem, i not got there create the texture with gimp, how i can do ?
Hey! Uh? Could you elaborate?
@@ghislaingirardot In fact, when I launch the .bat it doesn't show anything, while Gimp is on my computer, I don't understand, can you help me?
@@zogi1798 Oh, this script has nothing to do with Gimp. It uses a tiny program called ImageMagick. Install it and it should work
Not sure if you know but you can set and read particle positions from Niagara in blueprints/CPP. You could actually have a particle system that spawns lets say 5000 particles at startup and stay active lifetime of the particle system. You can set where you want to sample the height texture and read back sampled particle's position in blueprints / c++. you could use that to make a buoyancy system.
Oh I knew you could read data from Niagara on the CPU but I didn't even think to use it to sample the wave height! I had built another solution so I'm eager to try that approach and compare performance/useability. Thanks a lot for sharing that idea :)
One of the benefits of using a flip book is that it's deterministic, and the code can derive height information for buoyancy and occlusion without having to read from the GPU. Even with DMA, Niagara reads are still bound by PCIe bus speed, which is orders of magnitude slower than CPU cache hits, or even memory access.
The other benefit is that multiplayer experiences can provide all participants the same view of the ocean despite lag, latency, or differences in GPU capabilities for a given time stamp.
@@jklappenbach Hmm good points but I reckon you can achieve similar results with other methods. Sea of Thieve afaik uses FFT computed in real time with async GPU data readback for networked buyoancy and it can run decently on potato
@@ghislaingirardot I liked sea of thieves, and if I can get something at least that good, I'll be happy. However, my current goal is Black Flag. They did such a great job with wind texture on the waves. And the size of the waves became an obstacle in the game, periodically obscuring your target.
But ACBF wasn't multiplayer, IIRC, so they didn't have to worry about determinism.
@@jklappenbach Determinism isn't an issue. FFT, Gerstner Waves and most other techniques whether there are pre-computed or computed on the go, are determinist and you still have to read wave data from the GPU. However GPU async readbacks are usually good enough and the 1/2 frame(s) delay isn't usually an issue for buoyancy and such. I reckon Black Flag is still based on FFT. Or maybe Gerstner waves with detail texturing like I did in previous video(s). Flipbooks are cool but they have their limitations. Can't make the ocean react to changes in wind speed for one. Limited resolution. Memory heavy and so on. There's no perfect method.
I love this tutorial, thank you so much! Idk why, my waves has a kinda black shadow/outline on them... I cant see where I have made a mistake. Could you help?
Np :) Uh, sounds strange. Where is that happening? In Blender? In UE? Best bet would be to start from scratch and see if you missed a step
@@ghislaingirardot In UE, yes I will do it!
Love this! I cannot find any smart way to create a waterfall! Pls tell me you have a way to achieve a good looking one
Nop. Waterfalls are not straightforward to make. It's usually a bunch of custom authored meshes. Then scroll a texture with stretched uvs, add some extra particles and tons of other details and you get a decent waterfall :p hard work
@@ghislaingirardot thanks for the advice!
Merci infiniment pour ton travail.
amazing！
Can you use this technic to make curvy waves?
Curvy waves?
@@ghislaingirardot yeah. It really sounded weird. What i meant is how can we make something like the waves from a beach?
@@rodrigofernandes6449 haha. I wish I had a simple answer to give you :p it's a rabbit hole I won't go into (not yet at least)
Trop bien :O
i made this in unity but the problem is you only get the vertical displacement.
since you cantget horizontal displacement, the waves are not choppy.
which is sad.
but its a nice and optimized way for the ocean.
Hmm why do you only get vertical displacement? The Gerstner Waves aren't Engine specific, it's be done in every engines, Unity included. Are you sure you implemented the formula correctly? Displacement should be XYZ
@@ghislaingirardot What i was doing is put a camera above and shade it depending on height and render them. So i would only have a displacement map for y axis. I could not find a way to shade it for all the axices.
@@bdenix1997 My bad I had a bizarre TH-cam bug and thought you were commenting on another video. Yeah this method does only output height displacement and you need the normals to add the chopiness. Any texture applied to the water also won't get distorted with the waves, which is sad
@@ghislaingirardot I made an fft implementation just because i wanted choppiness. But its too performance heavy. Displacement map itself is not but the derivatives are killing it. + I am doing 2 cascades. But since i am generating waves based on time, i think i can make an animation and precalculate them just like this. Definetely worth trying.
@@bdenix1997 neat, congratz on the FFT implementation :D not easy to do. Might I ask what it costs and on what hardware? It does seem quite expensive but then Sea of Thieves uses an FFT simulation and it can run on potato so I'm not sure how they pulled that off. Anyway, yep you can for sure you a similar baking technique and output XYZ offsets into a flipbook from your FFT sim :) I'm jealous, I've yet to join the FFT sim gang ;)
非常好的教程
谢谢
Hey Bro do it work for Android?
Hello, Is this dynamic ocean written in C++ code? Please inform the author all the time, this is very important to me！
What? It's a shader. There's no CPU code (no blueprint, no CPP) Have you watched the video at all?
@@ghislaingirardot Thank you. Due to the needs of the project, I need to find CPU coding (which requires CPP). I would like to ask if you have any projects in this regard for reference!
@@sabellalevitt I don't have any CPP project.
@@ghislaingirardot Thank you again ！
@@sabellalevittplenty of CPP tessendorfs out there but the problem is ffts ran far far faster on gpus
salut, j'ai un soucis, quand je relie le materiaux au world position, tout passe sous le sol de la preview, comment je fait ? je comprend pas tout c'est pour ca.... as tu un insta ? un discord ou autre pour que tu puisse maider plus facilement ? merci d'avance !
Salut. T'as du faire une erreur quelque part 🤷 mais impossible pour moi de dire d'où vient ton souci là comme ça... La meilleure soluce c'est de reprendre la vidéo depuis le début et de refaire les étapes une par une
@@ghislaingirardot salut, d’accord je vais tout refaire alors…
@@ghislaingirardot salut, alors j’ai repris toute la vidéo de À à Z, le Bug survient au moment où je doit rajouté les 2 heigth map, et quand je fait le multiply avec 75, est ce que tu saurais m’aider ? Merci
@@ghislaingirardot je tai envoyer un message priver sur ton compte twitter pour que cela soit peut etre plus simple pour maider ?😅