Stylized Water 2 [URP] ☑️ Desktop/Mobile/Consoles/VR

Strange, Buto should definitely work. It's built specifically for URP, so I don't see how any built-in RP shader code can find its way in. For reference, I checked with version 3.6.0 and updated to 4.1.0.

If the Opaque Texture option is enabled, that really should do it. Worth checking if the pipeline asset you are modifying is in fact the one that's currently active (by being assigned in Graphics Settings).



In the frame debugger, there will be a "Copy color" pass, where URP creates the opaque texture. The water, when being rendered, will receive it as an input:

 

Ah, in my Buto test project (also 2022.2.18) I opened the demo scene, and saw this:


I believe this is what you're describing.

There's definitely an explanation for this. The water is still being shaded using Buto's fog. But without the Volumetric Fog component in the scene, the input is also gray (default, uninitialized texture). Same thing happens to the included "Transparent-ReceiveFullFog" materials.

It's ultimately harmless, and an inconvenience 'fixable' on Buto's end.

 

• I follow your Settings, my sea has a lot of umbrella shape
  
  
  

 

What you're seeing is mipmaps in effect, where a texture is sampled at half resolution in distance bands. It's a normal aspect of Unity's rendering. It can be disabled, or its quality can be improved. You can find more details about this here: https://support.unity.com/hc/en-us/...ty-Setting-affect-each-texture-s-Aniso-Level-

Out of the box, all the included normal map textures are configured to use x4 anisotropic filtering.

 

Does this work on WebGL?

 

Yes! Complete and up-to-date compatibility details are outlined here: https://staggart.xyz/unity/stylized-water-2/sws-2-docs/?section=compatibility-3

 

Hi,
There is something wrong in one of my project (it works fine on other) and I can't figure out why. I updated to 1.4.0 and the water is just plain black.


As I said, I've tested on a new project and the water render correctly, URP settings are the same ...
Thanks,

 

Some one else reported the same issue, but despite some back and forth, the cause unfortunately never became apparent. It seems to be project specific, which means either a specific setting or the scene context is related. What may help is to delete the Library/ShaderCache folder (perfectly safe).

Certainly keeping my eyes peeled, in case I manage to reproduce it so I can investigate

 

Yeah I did try that but it's the issue is still there, I'll also investigate on my end and let you know.

 

I bought this asset and import into my project but some Reason Stylized water 2 not working Only show black and white Color please help me

 

I'm trying to use a custom model with the diorama top/side shaders. The wave height is only affecting the top faces but not the sides. Is there a way I should specify which vertices are displaced by the wave height?

 

Are you using Enviro by any chance? If the integration is active, and Enviro is not in use in the scene, the water will either turn black or white.

Yeah! You can use the blue vertex color channel to mark vertices are being unaffected by the waves. This option is enabled on the material used for the sides:


Your bottom mesh, in this case, is filled with white vertex colors, so the entire mesh is unaffected.

Note the text in the Diorama demo scene:

You can see here how the bottom mesh has the bottom row of vertices painted blue, making them still:

 

Yes I am using Enviro lite in my project what I need to do for Fixing problem

 

Setting up Enviro in your scene will allow the water to properly use Enviro's fog shading.

If you really don't want to use the Enviro integration, you can select the water shader, disable the automatic detection and choose "Default Unity" as the desired fog rendering

 

I was reading your message above and double checked the integrations in my project, the issue was here, I had atmospheric Height Fog setup with the automatic detection, reseting to unity fog fixed the issue it seems.

 

Thanks for the feedback, certainly appreciated!

I believe this must the case for anyone who reported the same issue. The behaviour is technically correct, since without the fog asset actually in use the water is instructed to apply 100% dense black fog to itself (un-initialised/default values).

I've meanwhile implemented a few checks in the related shader code, to skip fog shading if values like fog density are 0. Atmospheric Height Fog apparently uses a global boolean for this which I can use (thanks @BOXOPHOBIC!).

That'll be all be included in an upcoming update.

 

Perfect thank you!

 

Hi, I have a case where I have imported your asset into my URP project and the water looks great in the scene view but ordinary in the game view.

I have read the documentation and yes my depth and opaque texture boxes are ticked in the URP settings. I have also checked on the material and there isn't a warning like the one described in the documentation.

Is there any other reason why it would render well in the scene view but not in the game view? Please see the attached pic:

 

I got it to work. I created a sample project for URP and copied the ForwardRender object from that into my project. I converted my old Built-In project to URP so maybe that's why. It looks great!

 

Thanks for providing the screenshots, that's most helpful!

The water looks exactly as it would when the depth/opaque texture options are disabled though (in the scene-view, the depth texture is always rendered, hence the difference).

Be sure to enable the settings on the pipeline asset that's currently in use (either in Graphics settings, or the current Quality level).

 

Thanks for your detailed response. It's all fine now but I'll check the old pipeline's settings.

 

A preview of two upcoming shading improvements, focused on providing more physically accurate behavior.

First is a Color Absorption parameter, which essentially darkens the underwater color based on the color of the seabed and the depth of the water.

The physics behind it aren't particularly relevant to explain, but this is a particular physical property of water that contributes to a realistic appearance.

Last is screen-space refraction, which considers the relationship between the curvature of the water and the viewing angle. The implementation developed is free of streaking at the screen edges and consistent between resolutions and perspective/orthographic cameras.

You may notice objects below the water surface appear to be "shorter", which is physically accurate (just like a person in a swimming pool).

The amount of chromatic aberration is now also controllable.

All of the above is implemented for the Advanced shading mode only. When Simple shading is used, color absorption isn't available, and refraction falls back to the simpler planar implementation.

The context scene is from POLYGON Tropical Jungle - Nature Biomes - Low Poly 3D Art by Synty

 

Hi, having a slight issue with moon reflections in my water material when I use Normals and Light Reflections at the same time.

Here's how my water is supposed to look visually (if you ignore the moon reflection):

As you can see, the sun/moon is a directional light and it looks pretty bad in that place, but the water itself looks as intended.

Here's when I enable normals to get rid of the bad look of the light.


The light reflection looks better, but the normals cause a weird pale color in shallow places. Modifying the vertical depth helps remove the whiteness, but removes my water transparency and you can't really see under the surface at that point.



Some issues I notice:
1. The directional light slider doesn't do anything as for some reason, the Sun/Moon directional light is being considered a point/spot light.
2. The normals make areas white and weird looking in areas with a bit less terrain depth and I'd love to fix that.


Using Cozy for the night behavior with the integration enabled. If you have any ideas about what my issue is or what I can tweak to make it look good with the normals enabled, I'd be very thankful!

 

I believe, if you have the alpha channel of the "Shallow color" set to 100%, and have the Refraction feature disabled, you could end up with shallows that look like that. Assuming the shallow color is white, or close to.

Small note: disabling the normals feature, under the hood also disables refraction, because it relies on it.

You can see here (left), the shallow color is a solid white, and refraction is disabled. At this point no color from the underwater surface is coming through, and the plants are purely visible because of the "Vertical depth" color gradient, making them appear to be white.

On the right, refraction is enabled, allowing the underwater color to come through (pink plants for exaggeration).

So if refraction is disabled, I'd recommend keeping both it and the Normals feature enabled, and adjust the material from there on. If disabling Normals is a quality/performance measure, you could create a Material Variant with it disabled, and the fog depth adjusted slightly.

Not sure about the light. Directional and Point/Spot lights are two very different code paths, if a reflection on the water is influenced by the parameters under the "Spot/Point lights" section, it cannot be a directional light.

 

Can repro it in the Cozy Demo scene by just plugging my material in and the Moon directional light gets controlled by the point/spot light sliders for some reason

Going to try to fix my issue according to your info. Thank you very much for taking the time! <3

 

Ah right! It seems URP passes on the 2nd directional light as an "additional light", which usually point/spot lights are. In traditional (Unity) Physically-based Rendering light reflections are all treated the same, but the water treats them separately for aesthetical control. So this creates an little unintentional situation.

If this really ends up getting in the way, you can opt to use Forward+ rendering (available since Unity 2022.2). Here only the single brightest directional light is treated as such

 

Hi, me again. How do I make the background skydome be affected by the underwater renderer? Everything is affected when I go underwater except that. Please ignore the fact that the dragon is breathing fire underwater.

 

Hi there,

Thanks for making a great asset! Just updated to 1.4.0 and experienced an issue with a neutral underwater color when refraction is turned on. Here's what I did to get around it - maybe this is helpful for others, or for a patch if this is a common issue.

Project details from the hub window:
Stylized Water 2: v1.4.0
Unity version: 2022.2.21f1
URP version: 14.0.7
Platform: StandaloneOSX
Graphics API: Metal
Underwater Rendering installed: False
Fog integration: Default Unity

First off, here's a quick before shot of my water in game on 1.3.1:

A tropical paradise ️

After updating to 1.4.0, I was greeted with this in-game:


Turning refraction off restored my underwater elements, though obviously without the refraction effect.

With no changes to the render pipeline, I dug in a little further. Based on your comment above (#501), I checked out the frame debugger to see if my opaque texture was truly being passed to the shader. When I checked the water drawing in the `DrawTransparentObjects` step, I see that it's in fact taking a `_BlurredCameraOpaqueTexture` that is 16x16:


Looking in `Common.hlsl`, I do see that the `OpaqueTexture` function is looking for this texture:

Code (hlsl):

1. TEXTURE2D_X(_BlurredCameraOpaqueTexture);
2. SAMPLER(sampler_BlurredCameraOpaqueTexture);
3. float3 OpaqueTexture(float2 uv)
4. {
5.    //return SampleSceneColor(uv).rgb;
6.    return SAMPLE_TEXTURE2D_X(_BlurredCameraOpaqueTexture, sampler_BlurredCameraOpaqueTexture, uv.xy).rgb;
7. }

Updating this function to use `_CameraOpaqueTexture` instead of `_BlurredCameraOpaqueTexture` resolves the refraction issue for me:

Code (hlsl):

1. float3 OpaqueTexture(float2 uv)
2. {
3.    //return SampleSceneColor(uv).rgb;
4.    return SAMPLE_TEXTURE2D_X(_CameraOpaqueTexture, sampler_CameraOpaqueTexture, uv.xy).rgb;
5. }

And I can observe the correct texture in the frame debugger afterwards, as well as refraction working as expected again.


(Yay!)

---

Could this be a 1.4.0 bug? Or an issue with Unity 2022.2 (I know I'm on the cutting edge here, so it could very well be my fault)? Thanks again for all your hard work - it's been a real joy to use this for our game!

 

If this skydome material is using a transparent shader (like the water), then it will always render on top/after the underwater rendering does. There's a section in the documentation dedicated to this particular case that goes into more detail: https://staggart.xyz/unity/stylized...rendering-docs/?section=transparent-materials

Thank you for pointing this out! That is indeed not intended. I don't know how exactly, but evidently a minor prototyping code found its way into the store version, it does not actually match the v1.4.0 release branch. I blame late a night hotfix, which has been proven not to be a good idea!

I've submitted an update (same version) to remedy this.

 

Awesome - thanks for confirming the fix and shipping an update. Re-installed from the Asset Store and it's working correctly.

 

Thanks for the update StaggartCreations, now refractions are working for me.

 

Hi there!

I'm using the plugin for a project currently and its been looking and working great!

I just ran into an issue with how it integrates into some of our game systems however. The game world is large enough we needed to implement a floating origin system to keep various systems stable. When updating the origin and repositioning all relevant GameObjects however, the water visuals have a noticeable jump.

Digging into the shader a bit, it seems like it uses the world position in some part. This becomes an issue when the floating origin is updated, as the visuals suddenly snap to a different configuration when offsetting it and the rest of the scene. Is there any way to account for this such as supplying the world position manually (where I can apply the offset and thus supply the "perceived world position"), or some kind of offset to map to the new position in scene?

Any suggestions would be greatly appreciated, thanks!

 

I believe the visual jump you see is attributed to the vertex animations performed by the waves feature. These are also using the world-position as coordinates. If you were to move the mesh around, the waves would appear to slide over the surface and the vertices appear to jostle up and down. That is all quite normal to be expected, in a technical sense.

The way this can be avoided is by moving the water (grid) geometry only in increments. Specifically, by the distance between each vertex of the mesh used. You'll notice the Water Grid component can be moved around, but will always snap to a grid (the vertex distance), specifically for this reason.

This script would achieve the same thing, and could be attached to a water object:

Code (CSharp):

1.     public class SnapToGrid : MonoBehaviour
2.     {
3.         public float cellSize = 4f;
4.  
5.         private float Snap(float position)
6.         {
7.             return Mathf.FloorToInt(position / cellSize) * (cellSize) + (cellSize * 0.5f);
8.         }
9.      
10.         private void LateUpdate()
11.         {
12.             Vector3 worldPos = this.transform.position;
13.             float x = Snap(worldPos.x);
14.             float z = Snap(worldPos.z);
15.             this.transform.position = new Vector3(x, worldPos.y, z);
16.         }
17.     }

I'm basing the value of 4, on the vertex distance of the mesh being used:

(It could also be 8, 16, 32, etc. As long is it evenly divisible by 4)

A potential alternative, is making the code adjust outlined in this post. Which will allow you to specify an offset for the world-position being used in any and all shading functions.

 

Thanks for the quick explanation and rundown of options, really appreciate it!

I forgot to mention before that I'm already using the WaterGrid approach, so I believe the SnapToGrid functionality is already in? And it works perfectly when moving smoothly through the world, but has the previously described issue when drastically repositioning the follow target like the camera. I tried out the second option of adding in the adjustable offset, which I think might fix the previous issue, but at higher offset value ranges (1000+) the wave height scales down to zero.

Any thoughts on what the issue might be there?

Thanks!

EDIT: digging into it more, its definitely related to the wave distance scaling optimization, as its fine when removing that functionality from the shader.

EDIT2: Alright, fixed it by adding the offset back to the uv position when calculating the pixel distance for the wave scaling. Seems to all be working outside of a 1 frame flicker when the jump occurs, but I think thats probably on my end. Thanks again for the guidance!!

 

Does the water not support Light Layers Feature? It seems to ignore it and the water is lit even by lights that have all light layers disabled.

I can get around this in normal forward rendering by just using the normal layers to disable certain lights for the water, but in forward+ rendering neither light layers or normal layers work and the water is lit by all lights no matter the Rendering Layers setting or Culling Mask setting on each light.

Also with forward+ enabled point lights seem to be culled when moving the camera a very short distance from the light, other objects are still lit from the lights when the camera gets away but the water no longer is, this does not happen in normal forward rendering. Not sure if this is intended or not.

using 2022.3.0.1f and 2023.2.0a17 both acted the same.

 

Albeit not intentionally, that's quite possible. When adding support for it, I found that the functionality didn't even work for native Unity shaders. So I assume it was a bug, because the shader code was identical.

Same with Forward+, there seems to be a culling distance involved, but no settings anywhere to control it.

Either way, I'll be able to look into it some time next week. Perhaps URP's shader were updated with some additional code.

 

Thank you, not a big deal atm will just stick to Forward Renderer.

only noticed it because i was trying out the Forward+ renderer in the new version, thank you for looking into it.

 

Thanks for your reply. I'll go and read the doco.

 

Hello,

I'm having an issue trying to use this asset with built-in fog for an Oculus Quest 2 project. It seems that fog only works in the Editor. In a Quest build, the fog doesn't seem to have any effect. What could be the cause of this?

Editor:


Quest Build:


Project details:

• Unity 2020.3.19f1
• URP 10.10.1
• Unity XR with Oculus 1.12.1 plugin
• OpenGLES3
• Stylyzed Water 2 1.4.0
• Lighting and Shadows Enabled
• Default Unity Fog, Exponential Squared (tried other fogs, didn't work as well)

 

Upon double-checking, it seems there is actually an issue with the integration for Unity's native fog. A minor scripting error was involved.

For the time being, you can select the StylizedWater2/Shader/StylizedWater2_Standard shader file and uncheck the "Automatic integration" checkbox, then choose "Unity fog" as the desired fog rendering:


I've meanwhile corrected this for the next update!

 

Hi there,
Did anything more ever come of the Surface Modifiers extension mentioned in the documentation? I saw a couple posts in this thread earlier where it sounded stalled, but even some of the limitations described there sounded feasible for my use case. I would love to have this kind of functionality just for better water feedback like foam, ripples, etc.

 

I think I enabled this option from the start when importing the package (I can't see the image but I'm guessing its this) :/ Did a quick build again just to be sure and also clicked Recompile, the resulting build still doesn't fog up the water.


Update
Currently my colleague is testing this as well, in his case it works. There's probably some caching going on on my end. Will check tomorrow again and clear the caches.

 

I'm afraid it does remain binned. Particularly due to blending between different modifiers not being possible, and a slew of other design/performance implications.

Perhaps a simpler system, that does cookie-cutter injection of vertical displacement and adding foam would be more viable. It may not be able to create complete oceans, shorelines or detailed rapids, but is capable of adding a certain fun factor to many types of applications.

If the same project does work on a another PC, then caching is certainly a possible explanation. To fully clear the cached shaders, you can delete the Library/ShaderCache folder (perfectly safe), this will force all shaders to recompile.

 

Removing the Library folder to get a full refresh did solve the problem. Thanks!

 

Sir your Stylized Water 2 is very good and very nice for mobile platform I use your water shader In My first mobile Game (Recently Released on play store https://play.google.com/store/apps/details?id=com.surya.simulator )made in unity and give me 55-60 fps in Low Settings.

Sir it is possible to River mode work on Mobile platform in the future Updates and Under Water Rendering Also.

 

Thanks for sharing, and congratulations on publishing your first game (quite the achievement!).

Enabling River Mode is perfectly fine, performance wise. It will involve re-sampling the normal map/surface foam textures on slopes, but that's nothing dramatic. When the shading mode is set to "Simple" these shading features are simplified for rivers as well.

I don't see underwater rendering making it to mobile unfortunately, at the bare minimum it requires copying and processing full-screen buffers, which low-end hardware doesn't take well to.

 

@StaggartCreations Hello,

I'm trying to use this asset for using water in our game. But we have a one problem.

What you are seeing is full of 2D sprite renderers. I'd like to fill the middle with your water. I put black color for you to understand more. But I want to make foams and intersection foams on edges, I was thinking:

if I put 3D Sphere with transparent material on top of the screen and bottom of the screen and transparent cubes for the other parts. For generating foams or intersection foams. and make it looks like it looks as that black area filled with water.

But when I use transparent material as Surface Type/Render mode it doesn't generate foam/intersection foam. How can we achieve this?

 

It's important to understand that the information that (approximately) describes the intersection between the water, and other geometry is based on the scene depth information. 2D objects virtually have no depth to them, so they can't create an intersection foam effect.

For a bit more information see the "Water depth and intersection effects do not appear on some objects" item on the Troubleshooting page.

Granted you are not using the 2D Renderer, you can still use the water in this type of scene setup. Though, it would predominantly be one color (the deep color) and would be without the intersection foam effect.

 

Hmm, I think I don't explain enough. I'll try giving more details. In gaming industry you always need to use some tweaks for best practices.

• I have a 2d battle board (let's say pool) as spine game object in 3d world.
• I want to fill water in my fake pool. with stylized water 2 urp.
• But of course it's 2d and 3d mix so it won't work. But as we developers need to think how can we achieve this. So I came up with this Idea.
  
• Let's make simple pool with 3D spheres and cubes, for generating foam and intersection foam.
• But also make it invisible(transparent) so when I put my 2d battle board(fake pool) it looks like my battle board filled with 3d water with interaction
  
  I want to combine my 2d sprite with your water for simulating foam by adding simple 3d spheres and cubes. but when I make it transparent, it doesn't create foam.
  
  How can I solve this problem, can you help me? or is there a way to just create foam from invisible objects, maybe from colliders, not from opaque material? so those 3d objects doesn't block my 2d sprite or appear in camera

 

Making the materials invisible, by making them transparent, also renders them virtually invisible to the depth texture prepass. Meaning their depth information isn't present in said texture, which in turn means no intersection effect is rendered on them.

What you're looking to achieve is to inject specific geometry into the depth texture, whilst not being part of the main shading pass.

That's only possible by using a shader on that geometry that strictly contains the depth-writing pass, and nothing else, such as this:

Code (CSharp):

1. Shader "Universal Render Pipeline/Depth Only"
2. {
3.     SubShader
4.     {
5.         Tags
6.         {
7.             "RenderPipeline" = "UniversalPipeline"
8.             "RenderType" = "Opaque"
9.             "Queue" = "Geometry"
10.         }
11.  
12.         Pass
13.         {
14.             Name "DepthOnly"
15.             Tags { "LightMode"="DepthOnly" }
16.            
17.             ZWrite On
18.             ColorMask 0
19.  
20.             HLSLPROGRAM
21.             #pragma target 3.0
22.  
23.             #pragma vertex DepthOnlyVertex
24.             #pragma fragment DepthOnlyFragment
25.            
26.             #pragma multi_compile_instancing
27.  
28.             #include "Packages/com.unity.render-pipelines.universal/Shaders/UnlitInput.hlsl"
29.             #include "Packages/com.unity.render-pipelines.universal/Shaders/DepthOnlyPass.hlsl"
30.             ENDHLSL
31.         }
32.     }
33. }

Which results in something like this, where the cube adds fake depth to the scene, but nothing else


This is a cube with a black transparent material (to simulate a sprite), with a duplicate of itself as a child which uses the DepthOnly shader. One object adds shading which ends up being visible on screen, the other only adds depth information.

This is a subject more related to the general workings of 3D rendering. The water merely reads the depth texture, so whatever is part of it can be processed, and whatever geometry isn't virtually doesn't exist to it.