Realistic Breaking Wave

Hello,

I am currently about starting a new project on surf with a realistic approch (more simulation oriented than arcade). Here are some inspirations I have:

• World Surf Series - PS4 (2018)
  
• True Surf - mobile (2018)
  
• YouRiding The Journey - mobile (2016)
  
• Kelly Slater Pro Surfer - PS2 (2002)
  

BUT, I am facing a big issue with how to render a real looking wave from its growth until it breaks into foam.

I find out several way to render the ocean but very few to have some breaking wave look:

• AQUAS https://assetstore.unity.com/packages/tools/particles-effects/aquas-water-river-set-52103
  
• Crest: https://github.com/huwb/crest-oceanrender
  
• SUIMONO Water system: https://assetstore.unity.com/packages/vfx/shaders/suimono-water-system-4387
• Hydroform Ocean System https://assetstore.unity.com/packages/tools/particles-effects/hydroform-ocean-system-76960

Concerning shader, I have already seen some interesting free ones like:

• Ocean Community Shader: https://forum.unity.com/threads/the-community-ocean-shader-open-source-unity-5.370818/
• Ceto- Ocean system for unity :https://github.com/Scrawk/Ceto
• Triton Ocean SDK: https://sundog-soft.com/features/oc...nity-water-effects-with-triton-for-unity-pro/

None of them allow to do what I need.

Still, I found out an very interesting asset which might do exactly what I want: Mega-Fiers
https://assetstore.unity.com/packages/tools/modeling/mega-fiers-644

... but I would have to pay 134€ only to use a single feature i can't afford! I only need that Bezier Attractor from the package. Now I am looking for a way to achieve this mesh deformation by scripting but it seems to be very complex at the end, then I will have to add some physics to this mesh...

I would really appreciate some help if anyone has a way to create that realistic breaking wave. I hope this thread can also help other developers/designers to add some realism to their ocean/shore/beach scenes.

 

Well, the easiest way to create such wave is to model it.

 

Using 3D software, animating and importing to Unity, may be the convenient way of sufficient and simple results.
If expecting much, be ready to spend time, or money.

 

Simplest way that comes to my mind is using Blenders (or any other 3d modeling software with similar feature) wave modifier and using shape keys to fake it.

 

Well, after month of testing stuff, modelling in Blender/3DSMax without good results, I finally I just got Mega-Fiers for half the price thanks to BlackFriday. Let's see what is possible then...

 

When you're only doing one wave at a time (as in surf games), then the physics of breaking waves isn't complex (I was recently reseaching waves for a project, and although I didn't need/want breaking waves, I found a few free research papers on the web that went into details of breaking-waves). It's a bit of work - you need to mathematically model the waves, and then add breaking-behavior, and finally you need to update your mesh each frame to use the values from your mathematical model - but each step is quite small.

There's a couple of different mathematical models, with different levels of accuracy, but they all looked reasonably simple to implement. The hardest part for me was mathematically modelling basic waves (there's a LOT of tutorials for how to do this for games, using Gerstner waves to make meshes), which Unity has built-in (some of the included shaders have functions you can use that automatically make gerstner waves) ... but to add the breaking behavior, you might need to re-implement gerstner yourself.

If you haven't written much code for dynamically changing meshes at runtime before, and/or haven't done much work with turning math functions into in-game movements, then this could take you many weeks to implement, but it's mostly about going slowly and testing as you go.

 

I think we saw the same documents from the web, I gathered a dozen of them with different approaches (most of them are extracted from theses about breaking wave modeling), the best I found is the one from Siggraph 2007 with the Surf's Up movie. I tested some mathematical approaches by changing the mesh on Update(), but it is very performance costly and I would like to run severals wave at a time like what you can see at Snapper Rocks Autralia or Puerta Chicama in Peru as shown below (maybe with less waves):

I know the Gerstner wave model and successfully re-done it with Shader but this is the the "growing" wave moment, collapsing (or breaking) moment is the tough part to represent within Unity (Blender doesn't allow very flexible parametric wave except if you create several copies with slight changes).
In addition to that there is the Physics part which is even more costly in performance...

I will try to get the vertices from a gerstner ocean then apply the Attractor modifier from Mega-Fiers if it works...

 

If I remeber correctly, there was one that used a nice simplification using rotating circles as an approximation of where the breaking wave should go, but I don't quite remember it (I wasn't paying attention). I just checked some of my bookmarks - Uncharted had some talks on their waves, and they had breaking waves IIRC. I also looked at the Boussinesq approximation, which looked like it had potential for a high-fidelity simulation (probably more what you're looking for?)

 

I found an very interesting video extracted from Siggraph for Surf's Up making of about the wave generation:

 

Cool. My vague memory is something like that, but more precise.

Something like ... the main wave surface exactly runs on the edge of one circle, but the point where it collapses follows a smaller circle that rolls around the inside edge of the main circle. It was apparently based on actual physics of how gravity pulls the breaking wave edge down - it looked too simple to be true, but seemed to match.

Sorry I can't find the paper any more , I've been through my browser history and saved links, and just isn't anywhere. Arrgh.

 

Hi @StarChick971 ,

I am also making a game with breaking wave in Unity and I have coded a way to model them quite realistically with good calculation speed. My game will be different as it is a boat game in 2D for mobile, still the code is made for 3D, so if you have difficulties I can share things. (but I won't disclose the whole code for free as I spent months on them).

 

I would be really interested in such solution.

May you share a screenshot about how it looks like?

 

I am also making a surfing game. I'm very curious about your code. If you put it on Assetstore, I'll pay as much as I want to buy it.

 

I found an very interesting video.

This game is on Steam.
https://store.steampowered.com/app/993340/Virtual_Surfing/

The review of this game is not good. but,
It has quite a perfect water physics. It's the best ocean wave physics I've ever seen.

 

I know the game, I forgot to mention it in the first post.
The game looks visually great but according to the reviews the surfing feel is not realistic enough. Yet, gameplay here is not our topic, let's focus on Virtual Surfing waves: they look perfect with a good shader making the ocean beautiful. However, it seems to be the same perfect barreling wave for all spots, maybe by just making it breaking in different sections.

The main idea of the topic is to reproduce all wave styles starting from the perfect tube wave:

Plunging - making perfect tubing waves


Spilling - gentle slope floor resulting in mushy waves


Surging - long period on steep beach


Collapsing - between surging and plunging

(source: https://www.surfertoday.com/surfing/the-four-types-of-breaking-waves)

In addition to that, there are different configurations: beach break, reef breaks, point breaks, rivermouth break.
It would be great to be able to have cross-waves so the height is the sum of two intersecting waves (double-up waves) or even reforms when the same wave breaks again.

 

Hi, Megafiers is the way to go...

Just remember that Surf games are real time simulations and you must balance between speed and wave resolution...

 

Even if the waves generated using MegaFiers look nice, it is not realistic enough and there are some issues when the waves collapse: I randomly get weird positions for some vertices resulting in backface rendering and such, that is not good.

Most Surf games are using baked waves, I don't think they are pure real time simulation in the same game, they break exactly the same way and most of the time in the plunging type.

 

I saw that alpha game a long time ago but I didn't post it here, someone managed to create realistic wave within Unity: https://shorebreakblog.wordpress.com/ (you can try yourself on the website download page)
So it is feasible, we just need to know how! Here are some screenshots from his game:

From the barrel :


Surfing!


Beautiful shot:


In the tube:


Looks great right?

 

Ok, now I am thinking about using Bezier splines to give wave a nice breaking shape, here is my first attempt :






It is ok that the mesh is not perfect (especially the wave shoulder) but I got some progress with a breaking wave.

 

Great update: I continued with the Bezier Spline approach and managed to bring the wave to life as a plunging wave.

 

And now with Crest Ocean Renderer for a better looking visual!

 

Well, the wave kinda works but the way I do it is in not performant at all, especially with a wider wave: I tried a 100x100 grid = 10k vertices! So that my FPS drops drastically because I am updating the mesh each FixedUpdate...

Is anyone have a better idea how to modify the mesh runtime with better performance?
I am thinking about using ECS but I want to have the best performance without it first .

 

How do you set currently the mes vertices?

See this thread
https://forum.unity.com/threads/par...neration-with-job-system.959385/#post-6382005

 

Basically, I first create a copy of the mesh.vertices in Awake(), then check which ones are in the "wave zone" in Start() (i.e the ones which will be moving, actually all of them) then in FixedUpdate() i do:

Code (CSharp):

1. for (int v = 0; v < _meshVertices.Count; v++)
2.     //modify vertices position using bezier splines
3.  
4. //then apply to mesh
5. _mesh.vertices = _meshVertices;
6. _mesh.RecalculateNormals();
7. _mesh.RecalculateTangents();
8. _mesh.RecalculateBounds();

The main problem is the high number of vertices, and it is might be not enough for a very long wave, I wish to have 1-5min ride maximum (5mn is way enough for a surfing game) inspired by Chicama world longest wave
https://mywavefinder.com/2020/04/19/the-worlds-9-longest-waves/

 

I would suggest to investigate some optimization approaches.

For example, can you reduce number of vertices, which are far away from camera?
You could shift higher density vertices, toward camera movement, when riding the wave.
And leaving behind low density vertices. Similar at the front, when approaching low density vertices.

Then, you don't need modify far away vertices every frame. Saving potentially tons on FPS.

Check also for GC.

 

First breaking wave with some added buoyancy to a surfboard!

 

For performance you could look into compute shaders or shaders in general. They run on the GPU and are good for mass calculations like modifying vertices. In normal shaders you have access to vertices of the mesh the shader is attached to and you can modify them however the collision doesn’t update I believe. In compute shaders you send packs of data(vertices in this case) to be calculated on the GPU.

 

thanks for the info, do you have any recommandation/link for computer shaders? In that case, I wish to modify the mesh with a dedicated compute shader...

 

I'm trying to deform a mesh by code and looks really hard, how could I do it using bezier splines? no idea how to do it in unity?

 

What Bezier Spline solution add on you are using ?

 

I did on my own which is very basic actually using this tutorial:
How To Work with Bezier Curve In Games with Unity

 

Could you share a sample project with your Spline Solution deforming a plane ?

I am using Surf´s Up approach with a Animated Surf Wave done in Blender and than playing it back with Mega Fiers Point Cache modifier...but I would like to try doing it with a Spline Solution.

Mega fiers Belzier Attractor has perfomance issues in Mobile...

 

I might share this one day, but there are so much things to do to boost performance and I don't have time right now...
I quit on Mega-Fiers solution for both performance and how the Bezier Attractor renders a "wave".

I don't know how flexible you need your wave(s) to be but if there are many waves to animate, you will need to animate each which is time consuming with the Surf's Up approach.
I haven't use MF Point Cache modifier yet, so you basically import point cache from another 3d software then play it under unity. I did quite the same with Unity blendershape from my blender model: it looks nice but absolutely not flexible.

My goal is to create a parametric wave using splines as profiles (as you know the Surf's Up way), two splines for each profile in order to create trough and crest. I 've simply bound a plane mesh's vertices to them using the link above but this has huge performance cost I need to improve with Burst or else.

 

I'm dropping in on this conversation a bit late, but I've been contemplating attempting this myself. So far, I've figured out how to use blendshapes in blender to create animated waves. I wonder if it's better to use an animated mesh collider to define the surface upon which the surfboard can move?

 

Hello, I strongly advise you to avoid modifying a mesh collider runtime, it is very heavy in performance. You 'd better modify mesh runtime using ECS/Burst/GPU or any other performant solution but not manipulating mesh colliders... There are plenty tutorials available
Problem with Blendshapes is as soon as you want to change the wave you will have to redo the complete animation in Blender then import in Unity again. It is ok if you just need few waves but it is definitely not the fastest way to go for dozen or procedural waves in my opinion (except if you have plenty of time haha).

 

I think there is a much simpler solution. Hand animate the wave in blender, then make a very simple mesh collider (similar to a skate ramp) move along with the wave animation. I'll post the results of this once I get it working. I'm attempting to model the wave right now (not very easy!)

 

Already tried with fixed ramp, but again you will need to deform the mesh if you want to match the shape otherwise you will notice some "gap" between invisible collier and the wave shape. However I didn't pushed this solution a lot, give a try I am curious about it. I only know that Unity Physics is bad with such "water Physics" unfortunately, especially because you have 2 objects moving at the same time...

 

Since this is an active discussion, I was wondering what the proper way to animate a wave with blender would be. I've been having extreme difficulty creating an animation rig for a breaking wave. So far I've figured out that I can use absolute keyframes on a bezier curve to do this in 2d, but I haven't been able to get a clean solution for a 3d wave that doesn't become extremely tedious

 

I went through many different options, but I realized that this pdf actually describes the process pretty directly:
https://library.imageworks.com/pdfs...-Up-the-making-of-an-animated-documentary.pdf

Create a nurbs surface and use absolute shape keys keyframes to distort the surface. I'm going to attempt to make this in blender, but it will be questionable whether this type of surface can be cleanly exported to unity.

 

Unfortunately, there is no easy way to achieve our objective about realistic wave, either through 3D animation or coding... Using Bezier curves deforming to a linked surface plane seems to be the best way to properly reproduce a wave shape as you have noticed in this thread.

I had been using this document as my main reference for the concept, I did it both under Blender exporter wave model & animation into Unity, which works very well with blendshapes but no modular at all (especially if you want different wave shapes: plunging, spilling, collapsing wave types).
Thank you to attach the link to th thread, I didn't think about put it here as reference, it could help some readers too

Let me put this tutorial as reference too, it using 3DS Max but it can be definitely adapted to Blender:

Again, working only on 3D software will cost you lot of time in you want flexibility with your wave.

 

I tried using NURBS + shape keys to replicate the surf's up effect in blender, but after seeing that 3Dsmax video you posted, I'm kicking myself a bit as I took a much more tedious route (animating every single slice of a 3d wave by hand). It took me roughly 3 hours to get this result:

The video you linked is a way, way more efficient and flexible way to set up a wave rig. If you're not familiar with animation, I'm going to have to say that this type of rig can be used to generate numerous types of waves (probably virtually all the waves that would be needed in a surfing game or movie)

 

Update: Getting a bezier curve to control a wave in blender is a bit more involved than with 3dsmax apparently. I'm going to start over doing this the "correct way" tomorrow. I think the way to do this is to make a bunch of beziers with the appropriate shape keys, combine them into a single animated bezier, create a spline IK rig then proceed with the technique in the video above. This is pretty advanced rigging, and I'm very impressed the Surf's Up team settled on this approach (which I believe is the correct one).

I'm really wondering now if the Kelly Slater PS2 game (which predates surf's up) did the wave programatically or using baked animations...

 

Second update: I think I've figured it out. This is very advanced use of blender but the basic technique is:
- Make some bezier curves
- Animate them using shape keys and keyframes
- Duplicate the curves and offset the keyframes as in the 3dsmax video above.
- Covert one of the curves to a mesh and extrude/flatten into a plane. Extrude the plane into a volume (useful for automatic weight painting later.
- Create an armature.
- For each bezier curve create a long chain straight chain of bones. There should be multiple chains but each should be in the same armature.
- For each chain, add a spline IK modifier to the terminus of each chain.
- Now parent the volume to the armature with automatic weights
- For additional control, create control bones and drivers to making animating the wave easier as in the 3dsmax video above.

 

just for inspiration/reference,
3d breaking wave in shader https://www.shadertoy.com/view/ldcSR7
2d reference https://www.shadertoy.com/view/4dy3Dw

 

I had the very similar approach starting with Bezier curves, shape keys, keyframes, mesh extrusion combining the profiles because I wanted to have several crashing sections depending on the profiles starting to "break" (not necessary a classic left and/or right barreling wave). This way I could have 4 reference animation left+right barreling wave stating from the middle (like A frame wave), either left or right starting from one side, or closing left and right toward the middle. BUT, the wave will look exactly the same each time... I didn't pushed that 3D solution programmatically within Blender.

 

Nice ones, however I have a doubt on the 2D profile with the moment the lip "split in 2 points" (one continuing forward and another one going backward) as it looks nice from exterior point of view but from a bottom up view I bet you will have rendering issue with the texture stretching a lot on the "flat" part at the end just before flattening the shape to ocean level.
I would be interested to see the 3D rendering without the splash effect and foam, only the textured mesh alone to check the texture stretching. Still, it is smart to hide it (like a lot of 3D wave animations did).

 

can disable the foam and particles by commenting out those 2 lines,

 

Thanks for the info but I can't get the camera neither closer or underwater... :/

 

I've been working on a fifth approach in blender for this problem which is looking closest to the 3dsmax approach posted above.

It's very very tedious to do this in blender, but basically you can parent empties to each bezier control element, then hook the empties to individual vertices on your wave mesh. This is even more tedious than nurbs modeling because each bezier needs to have extra control elements added to get nice looking curves on your wave, but it does give the level of control that was achieved for the Surf's Up game.
Does anyone know if the games at the top of this post use keyframe animations or compute shaders to achieve barrelling waves?

 

Here is an animation using bezier curves and hook modifiers in blender:

It's a bit hard to modify the control curves or add additional detail. I would like to try to figure out how to use Blender's geometry nodes feature to directly create a mesh from the bezier curves, but it might be too complicated to tackle right now.

Edit: Oof, it looks like it's not possible to export this animation to Unity due to use of the hooks modifier. Looks like the only option is to go with nurbs + blendshapes. I might have to table this project as it's more complicated than I initially anticipated.