This effect has been achieved using a smart setup of 4 cameras and custom shaders writing to depth buffer only. Neither stencil buffer not render textures have been used as they are unavailable in the free version of Unity3D. This technique allows also for perfect rendering of mirrors and water reflections. Hopefully a tutorial will be coming soon. Cheers!
Due to popular request, I’m posting the source code of my Unity3D Animated Water Shader. It is a complete rewrite of Alzahiel/GraphicRunner’s shader. Brief list of changes:
– It’s a surface shader (not Vertex+Fragment)
– Doesn’t require script file, all animation is done in the shader using built-in _Time variable
– Supports transparency
– Support specular lighting
– Supports reflection map
– Configurable cycle length and water flow speed
By changing normal maps tiling, main color, reflection color, specular color, flow speeds and cycle lengths a variety of effects is possible:
I’m also attaching the flow map and noise map from GraphicsRunner’s demo and water bump map and Sunny sky cube from Unity Standard Assets so that you have something to start playing with. I’m using the same normal map twice but the effect should be even cooler with two different normal maps. Enjoy!
Remember, that for flow map creation you can use FlowEd.
SOURCE CODE (Simplified BSD): AnimatedWaterShader.zip
What FFE now produces is in general an image. It can be created from: flow field points, color points, color gradients following Bezier curves (middle-click at endpoints to adjust colors) or a combination of these.
First, Bezier curves with adjustable width (middle-click at the control points) are drawn on an initially empty and transparent canvas.
Flow field points are mapped to color points depending on their direction+magnitude (RGB, use handles to manipulate) and wave size (A, middle-click at one of flow field point handles to edit).
Color points are defined directly using RGB and A components (middle-click to edit).
The space between color points is then interpolated using either linear, cubic or natural neighbor interpolation.
In linear interpolation mode, color points can be marked as “passive” meaning that one of non-passive points in the triangulation will replace the color of the passive point. To flip point’s passiveness Shift + right-click on it or use the Mark Passive tool.
To delete any object, right-click on the movable part of it (e.g., flow point’s handles, Bezier curve’s endpoints).
There are 9 tools now in FFE:
– Flow points (add flow points)
– Gradient points (add color points)
– Flow brush (adjust direction/magnitude of flow points using a brush)
– Gradient adjust (adjust individual color points using absolute or relative color changes with optional cloning)
– Eraser (remove flow and color points using a brush)
– Gradient brush (change color of multiple color points using a brush)
– Mark passive (set, unset or flip passiveness of multiple color points using a brush)
– Add Bezier curve (as the name says 😉 )
– Add Bezier point (add new segment to the current Bezier curve; the current Bezier curve is the last created or edited one).
Some of the tools have configurable options displayed in a panel below tool selection combo box.
You can right-click in the free space of your design to undock the tools menu and display it under your mouse cursor. It’s a convenience feature to minimize moving your mouse back and forth. Double-clicking the title bar of such undocked menu sends it back to the docking space. You can also close it and use right-click again to reopen it.
The New/Save/Load/Export entries in File menu remained mostly the same except for the “Generate flow grid” and “Generate gradient grid” in the “New” submenu. As the names suggest they generate an MxN flow or gradient grid respectively. In addition to number of rows/columns, for flow grid – the direction (in %) and wave size (0-255) have to be specified, for gradient grid – the color.
– Natural neighbor interpolation is now based on nn-c library which is significantly faster than my own implementation from previous releases.
– FFE no longer uses OpenGL for linear interpolation. It is software-based now for both preview and output. A little bit slower but more predictable.
Previously FlowEd was published without any specific license. It’s time to change that. Eventually I’m aiming for a commercial open-source model but for now I’m publishing just the binaries under a free-of-charge EULA license. It’s nothing too restrictive, just trying to prevent others from making what I consider unfair profit on my Software. Output of this software is not subject to ANY restrictions, so you can relax and use it in your productions.
A couple of new effects are possible with this new functionality. I will describe at least one of them in the coming posts. In the meantime, feel free to unleash your own creativity using this new tool Enjoy!
Probably final this time 😉 I was trying to find a compromise between speed and quality and came up with an idea of triangle-based cubic interpolation. Fortunately it turned out that such beast already existed – http://cran.r-project.org/web/packages/akima/. It’s several times faster than Natural Neighbour and gives better results than Linear Interpolation, although there are some artefacts in sharp transition areas (they can be avoided or overcome with smart point placing). Just another interesting option for preview during development. For production quality, you should definitely go with Natural Neighbour Interpolation.
DOWNLOAD: Flow Field Editor Update 2
So first of all, I’ve fixed a little bug in the water flow shader which basically inverted one of the texture coordinates and made all of the flow animations look weird or just wrong. This is how the flow map from my last tutorial looks in action now:
And it’s WAY more impressive when animated!
Next, I thought that the way of creating flowmaps I’d described before is a little bit too complicated and so I created a little flow editor in Qt to make preparation of flowmaps more straightforward. You can sketch the flow as you see fit and the rest will be interpolated using Natural Neighbor algorithm. Due to the nature of NN the more flow points you add, the faster it works (recomputation of Voronoi diagram is faster, read NN description if you want to understand). The example flow field takes just a couple of seconds on one 3GHz core.
And this is what it looks like in Unity with little debug info added:
and without debug:
It’s WAY WAY more impressive with animation, you can actually see the water interacting with obstacles. I tried going back to Simple Daylight Water from Unity and it looks like a child’s play now when my water is INTERACTING with the environment. Pretty cool. Thanks Valve (guys from Valve came up with this idea at SIGGRAPH 2010), GraphicsRunner (guy who wrote all about it and prepared a demo in C#) and Alzahiel (guy who prepared the initial port to Unity). I’ve modified Alzahiel’s shader a little bit and now I’m contributing the flow editor. Enjoy!
DOWNLOAD: Flow Editor
PS. You can also try the updated monkey game
DOWNLOAD: Monkey Dodge – Unity Game