Stylized Water Shader
Stylized Water Shader
Note: This documentation is currently being updated for version 2.0. Some of the features you may read about are not yet available.
Thank you for purchasing the Stylized Water Shader!
Your feedback is instrumental to the future of this package!
Feedback and suggestions can be made in the forum thread:
This manual is intended to clarify the use of the package and should be consulted for troubleshooting.
A new version is under development, which will see a vast amount of improvements and new features:
- Desktop Beta will become default
- New Mobile uber shader (up to 37% faster)
- 3 new demo scenes
- Orthographic camera support
- Vertex painting support
- Color gradient feature (Desktop)
- 4 water particle effects
- UX improvements
- Tiling reduction (Desktop)
- Improved wave animations (Desktop)
- Custom heightmap option
With this version the previously deprecated Desktop shaders have been made obsolete and will be removed from the package. These are then replaced by the Desktop shader currently marked as “Beta”. The current mobile shaders will be removed as well, and replaced by an entirely new version.
Version 1.50 will still available and included as a separate .unity package.
Please refer to our refund policy
Water, by nature, is a very complex phenomenon, as it can be in a lot of different states. A water shader requires a lot of different operations in order to achieve a believable effect. It’s important to understand this as the water shader will always see some performance impact.
For lower end devices, such as mobiles, two shader variants are included, both of which are designed to minimize a possible performance impact without losing much of the Desktop fidelity.
Users have reported to have no issues on Playstation 4 and Nintendo Switch. The shaders are surface shaders, which means they use Unity’s internal lighting system rather than a custom one. This leads to assume the chance of any graphical issues is minimal.
I have no access to any devkits, so if you find yourself having any such issues, please get in touch!
The shaders have been tested using an Oculus Rift where no issues have been encountered. Planar reflections do not work in Single-Pass Stereo Rendering and are automatically disabled.
Version 2.0 adds support for orthographic camera’s, making it compatible with applications like Vuforia.
Support for will be added in the next update.
Currently, everything works, but the deprecated desktop shaders throw an error, these will be removed in version 2.0
- Drag one of the prefabs found under Assets/StylizedWaterShader/Prefabs/ into your scene.
- Use the
StylizedWaterscript component to start modifying it to your liking.
- Create and assign a material to your water mesh and assign a shader found under /StylizedWater.
- Add the
When using Forward Rendering, be sure to add the
EnableDepthBuffer script to your camera. This ensures the depth and intersection effects work. Since version 2.0, this is automatically handled through the
Note: It is advised to create your own materials, so your settings are not accidentally overridden when updating the package.
If you’re uncertain what a parameter is for, click the help icon to toggle descriptions for that section
Should you run into any issues or have questions/feedback, please do not hesitate to reach out! I will do my best to respond as soon as I can.
Unity forums thread: http://forum.unity3d.com/threads/stylized-water-shader-desktop-mobile.430118/
The Beta shader is an effort to move the visual fidelity of this shader forward.
It has been recreated in Amplify Shader Editor which outputs a surface shader, making it compatible with all of Unity’s rendering features, as well as offering other benefits. The shader is targeted at Desktop platforms, the mobile shaders will follow suit later, once the core features have been defined.
Users are encouraged to use this shader in their project, as the current (Shader Forge) shaders will be removed in version 2.0.
– Recreated in Amplify Shader Editor entirely
– Realtime reflections
– Skybox lighting
– Reflection Probe support
– Mask surface highlight by heightmap (wave foam)
– Wave direction configuration
– Improved texture cross-panning
– Improved glossiness
– Improved depth, with shallow water color parameter
– UV Distortion
– Unlit mode
If you’d like to have separate water bodies in your scene, each with a (slightly) different appearance, you will need to create a unique material instance for these meshes.
- Create and assign a new material to your water mesh and assign a shader found under /StylizedWater.
- Add the StylizedWater script component.
- Hit the ‘Apply all changes’ button once.
Make sure only one object has Planar Reflections enabled, otherwise this will incur a huge performance hit.
All the shaders in the package are one-sided. Meaning, if you move the camera beneath the water surface, it will appear invisible.
If this is an issue for you, duplicate your water object and flip it 180 degrees. It’s recommended to create a separate material for this object, so you can fine-tune it’s visual appearance.
Triggering post processing effects, such as screen waving and blurring, is possible through SC Post Effects, which includes an “Underwater” example profile.
Note: not every parameter is available in all shaders versions.
|Feature||Desktop||Mobile Advanced||Mobile Basic|
|7 different styles||V||V||V|
|Advanced surface highlights||V||X||X|
|Water color:||The most self-explanatory parameter.|
|Fresnel color:||Controls the color for the glancing reflection, the Alpha channel controls the intensity of the Fresnel effect.|
|Rim color:||Color of the foam intersection. Alpha controls its transparency|
|Wave tint:||Controls how bright or dark high waves should be tinted based on the heightmap|
|Normal strength:||Increases or decreases the normal map intensity|
|Tiling:||The amount of tiling|
|Transparency:||Controls the opacity of the surface.|
|Glossiness:||Defines how reflective the water looks. Fully reflective water shows the sun reflecting in the waves and the cubemap reflection.|
|Fresnel:||Exponentiate the Fresnel effect, essentially moving it closer or further away from the horizon.|
|Refraction:||Simulates light bending as it moves through the waves.|
|Reflection cubemap:||Assign a cubemap to be reflected in the water, depending on the glossiness amount. Real-time reflection is not supported.|
|Custom texture:||Assign a grayscale texture to be used for the intersection effect.|
|Style:||Dropdown menu to choose one of the pre-built styles from.|
|Size:||Controls how wide or deep the intersection effect should be.|
|Falloff:||Adds a linear transition to the intersection.|
|Distance:||Add a smooth offset for the effect|
|Tiling:||The amount of tiling for the intersection texture. The buttons here can be used to increase or decrease the tiling.|
|Use intersection texture||Use the intersection texture for the surface highlight effect.|
|Cross-panning textures||When using the intersection texture, this toggle adds a secondary cross-panning texture.|
|Opacity:||Controls the overall opacity of the highlight effect. This effect is derived from the normal map.|
|Size:||Dynamically shrink the size of the effect.|
|Tiling:||Amount of tiling.|
|Depth:||Adds murky water the deeper the water is.
Note: This effect depends on the amount of transparency.
|Darkness:||The depth color is derived from the water color and can be brightened or darkened here.|
|Custom normal map:||Assign a custom normal map to be used for the waves.|
|Style:||Dropdown menu to choose one of the pre-built normal maps from.|
|Heightmap||Dropdown menu to choose one of the pre-built heightmaps from.|
|Strength:||Controls the height of the waves. If you need higher waves, you can scale your water plane up on the Y axis.|
|Size:||Controls the size of the waves.|
Add polygons to the mesh to create a more detailed wave animation effect
Waves aren’t high enough, even with the highest “Wave height” value
In this case, your water mesh must be very big. If you need higher waves than the shader value allows for, increase the scale of your mesh on the Y-axis to the same effect
Waves look very pointy, triangular
This is an indication that the vertex-density/polycount of your water mesh is too low. Add subdivisions to your mesh to increase the wave fidelity. When using the Desktop shader, the “Tesselation” parameter has the same effect.
Much like a pin-art toy; the more pins it has, the more detailed the cast becomes.
Transparency is set to 0, but water still has a faint bright color
This only applies to the Desktop shader. The transparency parameter doesn’t actually control the shader’s opacity, but rather controls the amount of visibility of the objects rendered underneath the water. This is known as a GrabPass. The water shader is built on the PBR model, so it inherits some shading properties such as fresnel, which explains the faint brightness.
This behaviour is by design, so it’s still possible to have crystal clear water, while retaining the refraction a capabilities. Otherwise the water would simply turn invisible. When the “Unlit” toggle is checked, this is not an issue, since all lighting is overridden.
(Mobile) After a few minutes, the water animation becomes stepped and the textures pixellated
Since mobile devices don’t support high precision values, artifacts may occur the longer the shader runs. This greatly varies between devices. Disabling “World-space tiling” uses overal lower values, and will prevent this issue.
This issue is resolved completely in version 2.0.
Water surface flickers white and the intersection effects disappears
This is usually caused if there is no light source in the scene, or your scene-view has lighting switched off.
Water shows banding artifacts
Some of the shader features rely on the rendered depth buffer. If your device does not render this accurately banding artifacts will show. This appears to happen on some devices using a Mali-450MP4 GPU.
It has been fixed in version 1.24. Should it still occur, a potentially solution is to set the display buffer to 32-bit as some users reported this fixed the issue.
Objects show a pixelated white outline
This occurs when using Unity’s built-in MSAA and can be remedied by using an Anti-Aliasing image effect instead.
Surfaces looks jagged
This is due to compression of the shader textures. You can override this compression in the inspector under the “Advanced” tab.
This will impair a slightly larger memory cost as the two textures will be larger in size.
(iOS) Black dots appear on the water
You can elevate this issue by doing taking the following steps:
- Unset the Sun object in the Lighting tab, if set
- Raise the Shadow Bias value on your Directional Light
`System.IO.File’ does not contain a definition for `WriteAllBytes’ error
The “WebPlayer” target platform does not support writing files to disk and is thus not supported. The WebPlayer functionality was officially deprecated since Unity 5.4.