Search Unity

  1. Unity 6 Preview is now available. To find out what's new, have a look at our Unity 6 Preview blog post.
    Dismiss Notice
  2. Unity is excited to announce that we will be collaborating with TheXPlace for a summer game jam from June 13 - June 19. Learn more.
    Dismiss Notice

Stylized Water Shader - Desktop/Mobile/VR [Built-in RP]

Discussion in 'Assets and Asset Store' started by StaggartCreations, Sep 8, 2016.

  1. Ga2Z

    Ga2Z

    Joined:
    Feb 16, 2012
    Posts:
    68
    Hahaha You're right I confused it with another of your assets we're working with, I'm sorry :(
     
  2. protopop

    protopop

    Joined:
    May 19, 2009
    Posts:
    1,562
    Is there a way to edit the shader so tree billboards intersect with the water?

    I had this issue with another water shader and the developer did something that made the shader intersect. Im asking them about it too, but I thought I should ask here since you know the shader best.

    Its great water by the way - very versatile and good performance.

    Screen Shot 2020-09-18 at 9.56.27 PM.png Screen Shot 2020-09-18 at 9.56.33 PM.png
     
    StaggartCreations likes this.
  3. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Setting the render queue value on the water material to 2899 will likely fix this. With the default value of 3000, the water renders over tree billboards (assuming the ones created by the terrain system). These have a render queue value of 2900, so having the water render before them will result in correct sorting. On my end, the water then properly intersects with the billboard meshes.
     
    protopop likes this.
  4. protopop

    protopop

    Joined:
    May 19, 2009
    Posts:
    1,562

    Thank you:) I figured it out. I removed the alpha:fade from the shader and now it intersects with billboard trees.

    I have another question.

    How can I turn on and off the reflection by script. I was to do this in my options so people can choose.

    stylizedWater.useReflection = true/false turns planar reflections on and off in the script attached to my water object. But it doesn't actually turn the reflections on and off in the water.

    If I start the game with planar reflections on then this will turn it off, but not on again.

    If I start the game with planar reflections off it won't turn them on or off (although the checkmark in the stylized water script goes on and off in all cases)

    Would I have to make a operate water object with a. separate stylized water script with planar turned on and switch between them?
     
  5. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Glad to hear that works for you. I wasn't required to modify the shader, but who knows!

    Settings the "enableReflection" bool value on the water component will enabled/disable the rendering. And disabling it sets the reflection strength on the material to 0, otherwise it shows a gray reflection (default texture color). But it doesn't set it back to what it was, when enabled.

    So when you enable it again, you'll have to use StylizedWater.material.SetFloat("_ReflectionStrength", <value>); to set it back to whatever value it was. It's a little counter intuitive, since you'll have to save the desired reflection strength value somewhere beforehand, but it works :)
     
    protopop likes this.
  6. protopop

    protopop

    Joined:
    May 19, 2009
    Posts:
    1,562
    thank you:) for the billboards I use a huge water plane like 2000x2000 - maybe that's why my billboards don't intersect. Unity is like love - full of mystery

    it's really wonderful water. I love diving and swimming in it - it feels so wet.

    if I disable the reflection during run time do you know if there any kind of performance hit, compared to if I disable it from the start and never enable it?
     
  7. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Happy to hear you like it!

    I don't think there will be a noticeable performance hit. But toggling reflections does involve the creating/destruction of an object and texture. But if the game is loading anyway, a fraction of a millisecond probably doesn't make a difference. Ideally, it would be disabled by default, and enabled when needed. But I don't think it's it would be causes for concern otherwise ;)
     
    protopop likes this.
  8. Duende

    Duende

    Joined:
    Oct 11, 2014
    Posts:
    200
  9. Harrenhall

    Harrenhall

    Joined:
    Mar 25, 2020
    Posts:
    10
    Any news on the URP version? Will it be for mobile as well?
     
  10. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    I don't Overloud myself, so can't exactly test it. But judging by that page, it should be possible to add support for it. This requires some minor modifications to the shader. You can do this by opening the StylizedWater_Desktop.shader file.

    At line 66, add #include "Assets/OverCloud/OverCloudInclude.cginc" underneath it. Note that the file should actually be located there, if you've moved the Overcloud folder, adjust the file path to match the location in your project.

    At line 360, replace:
    Code (CSharp):
    1. c.rgb = staticSwitch857.rgb;
    2. c.a = OpacityFinal814;
    with:
    Code (CSharp):
    1. float4 finalRGBA = float4(staticSwitch857.rgb, OpacityFinal814);
    2. OVERCLOUD_FRAGMENT_FULL_ADD(finalRGBA, ase_worldPos.xyz);
    3. OVERCLOUD_OCEAN_ADD(finalRGBA, ase_screenPosNorm, ase_worldPos.xyz);
    4. c.rgb = finalRGBA.rgb;
    5. c.a = finalRGBA.a;
    With this in place, Overcloud's effect (I'm assuming volumetric lighting) will be drawn on the water surface correctly. Let me know if it throw's any errors ;)
     
    Duende likes this.
  11. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    It's practically finished, except for some minor touch ups and polish. I'm currently down to screenshots and documentation, which is the final stretch! I decided to omit some of the advanced features (interactive water and underwater rendering) as separate extensions. Otherwise it just drives up the price, and takes much longer to finish.

    Like the original package, it's also mobile compatible. On low end devices (OnePlus One and iPhone 6s), it runs at about 36fps with all features enabled. Disabling the advanced features, which aren't targeting mobile anyway, brings it up to 60fps+. On newer devices (Galaxy S10/Nintendo Switch), all features can be enabled, without noticing a performance hit.

    It's a huge improvement over the current shader, since I'm not using a node-based shader editor, so was able to optimize it rigorously.
     
    alexanderameye likes this.
  12. shawnblais

    shawnblais

    Joined:
    Oct 11, 2012
    Posts:
    324
    Last edited: Oct 16, 2020
  13. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Yes, that's exactly what I meant ;)

    This technique uses particle systems. I made a prototype that uses this a few months ago, but it's fairly basic and difficult to translate full characters bodies and boats into ripples. The ripples also can't bounce off each other. What I'm looking to achieve is the same technique as used in AC Origins, Uncharted 4 and Fortnite (example). I've conceptually laid it out, but there's still a lot to figure out, so I'm leaving for it for a rainy day.
     
  14. shawnblais

    shawnblais

    Joined:
    Oct 11, 2012
    Posts:
    324
    Well our money is sitting here for the taking, please do take it :D
     
  15. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    this looks beautiful man.

    Does stylized water allow for DOF blur
    What about stylized water 2?

    also is SW2 only for urp or also Built in?

    any update on SW2 release date?

    I don’t want to be buy SW1 and then SW2 gets released lol! Unless ur doing some kind of free upgrade or reduced price upgrade.

    Will you keep supporting sw1?

    And lastly any specials coming soon? I see you have done some discounts in the past.

     
  16. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Thanks!

    DoF ignores transparent materials, since they don't contribute to the depth texture DoF uses, unlike opaque materials. For shallow water, this isn't much of an issue, since the terrain below it is not much further away than the actual water surface is. So this unfortunately wouldn't be much different for Stylized Water 2.

    I expect this to be released some time next week, after which a free upgrade will be available until the end of the year. It'll be exclusively for the URP, it unfortunately can't go both ways ;)

    The currently package will be still be maintained for bugfixes and compatibility with future Unity versions.

    And I'm afraid we're not exactly allowed to share details about any upcoming sales, but I always accept participation.
     
  17. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    I see. So my current DOF won’t be applied to this water? so my far out objects will be blurred except the water?

     
  18. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    It depends, if there is something underneath the water, like a terrain it will still looks blurred. Though technically it receives the same amount of blur as the terrain does. Here is a frame of reference (water is ~10 units above the terrain):

    upload_2020-10-31_16-15-41.png

    If I were to remove everything but the water, it would be blurred completely. Since all the DoF effect sees at that point is the skybox, which is infinitely far away so gets blurred completly.
     
  19. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    Oh ok. So it DOES blur. Damn that looks nice. I’ll be purchasing this soon. Just need to make sure it’s the one I need lol.

    And particles are easily to implement? Like splashes and ripples while my character swims around?

    Any support for water displacement coming? Like water movement around swimming animations? I guess i could just use your ripple particles for this.

    oh I forgot to ask, can we adjust the movement of the water? I figure if I turned that baby red and yellow/orange and slow it down I can make it look like lava or if I turn it brown I can make it like mud.


     
  20. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    The swimming particle effect spawn particles over distance so could simply be attached to a transform, whereas splashes are one-shots. I suppose it's fairly trivial to tie them into a character controller.

    I've seen several people turning the water into lava, the color fields are HDR enabled which does help there. But there's separate control over animation speed for almost all features
     
  21. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    Well I went ahead and bought it. AMAZING asset. Beautiful waters. A lot lighter than lux water. And my FPS is higher now. I’m rapidly creating different waters. Really happy with it so far. Good job.

    What other updates are you planning to roll out for this asset? Any time lines ?

     
    StaggartCreations likes this.
  22. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    Also how do I fix this planar reflection oddity/bug? Please see gif attached. It glitches out on certain camera movements.



     

    Attached Files:

  23. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    To follow up with my below GIF where certain items disappear or deblur, here is another file showing the reflection of the building clipping into the inside of the building when moving the angle.

    also On another water (a fountain on the opposite side of the level) I see the wrong reflection. I see my Bay’s reflection showing the buildings.

    Are these reflection only sharing one camera? How can I fix these clipping and debluring issues?

     

    Attached Files:

  24. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Are you using occlusion culling, or impostor LODs by any chance? It appears some meshes are culling prematurely.

    Only one reflection renderer is supported per camera, which explains why you're seeing the reflection of another water body.

    Nice to see you've got the effect hooked up :)
     
  25. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    Thanks. Yes I got it up and running so far very happy other than the reflection glitches. I don’t have occlusion culling set up. But it still shows. Could that be the only reason this happens?



     

    Attached Files:

  26. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    If you still have two water bodies rendering reflection at the same time, you should disable either one of them, since these'll likely conflict with eachother
     
  27. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Stylized Water 2 is now out! Created a new thread for it here.



    There's a free upgrade until 2021, after which a 20% discount is available.

    Thanks for all the support so far, this was my first asset released in 2016, and happy to see it still being used! Will keep this up to date so it works in future Unity versions. But other than that I'll be focusing on Stylized Water 2 until I've checked all the boxes on my feature wishlist :)
     
  28. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    I thought about trying that. I’ll give a shot later today.
    How can I prioritize which reflection I want on which water? I need them on both lol

     
    Last edited: Nov 3, 2020
  29. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    ok so I have two water bodies.
    One is an ocean and One is a fountain.

    They are both on opposite sides of each other.

    So when my character is walking halfway from the ocean to the fountain (pretty far from each other), can I deactivate the planar reflections from the ocean and activate the planar reflection on the fountain and have the fountain’s reflection camera over there instead? And vice versa? So this way my fountain water doesn’t reflect the building by the ocean water. (Which is wrong).

    In other words, does the reflection prioritize Its camera on the first body of water or a random body of water? I’m trying to find a way around to having these two reflect their appropriate reflections. So this “hack” could work? I guess I should try it lol.

    Also does this asset work with wavemaker? I saw your post how wave maker works with SW2 but I’m hoping it works with this one too.


     
    Last edited: Nov 18, 2020
  30. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    790E187A-8CC6-4EBB-8B36-1DC1F420946A.jpeg Any advise on my above post?
    Also I have a problem returned.
    How can I avoid this camera /reflection culling? Please image attached.

    Right side is the culling and right side shows how far the water is from building. It wasn’t happening up until now and this is the only water with reflection. It only happens when I get the camera verrrrrry close to the water surface.

    Why does this happen and how can I fix it/prevent it?
     
  31. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    FIXED IT! so i was thinking maybe the "offset" slider on the planar reflections module controls the reflection camera and sure enough this fixed it. i set it to 0 (it was only at 0.15) and no more culling. freaking. awesome!

    Also I think I found a bug. I notice if I use any "toon" type of shader (like wind waker or borderlands type) on my characters or objects that has outlines, it triggers these giants dark areas in the planar reflections. if i remove the "outlines" from these toon shaders, the issues disappear. just wanted to let you know. maybe the reflections are being triggered by these outlines?

    Luckily this doesn't'T happen with your SC post effects asset (ironically). lol!
    I use the "edges" effect to get that Borderlands look and it doesnt mess up the planar reflections.
     
  32. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    The reflection is rendered when a water mesh with the Stylized Water component falls within the camera view. So if two water bodies have reflection enabled, but are never both visible at the same time individual reflection renders can work. If not, reflection is rendered for whichever object was last enabled. You could implement custom logic that disables the Stylized Water component for the object you definitely don't want reflections to render for.

    As for Wavemaker, I haven't exactly tested it, but given the way it works, it'll work with this shader as well.

    The inverted culling happens when the camera goes below the position of the water mesh, which makes up the reflection plane. Normally not a problem, since if the camera is below the water, the top of the water isn't visible anymore. The pivot point of the mesh should be at the same height as the mesh itself in this case. But the "Offset" value pushes the reflection plane up/down, which is why it influences this behavior.

    It depends on the technique used for the outline effect. Some outline shaders draw the mesh again, behind the original mesh, but slightly larger and with inverted faces/culling. For planar reflections to work, the reflection is rendered with inverted culling, so it's likely that the outlines meshes are inverted and draw over the mesh, resulting in a black silhouette. That's unfortunately unavoidable with these two techniques combined.
     
  33. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    I see. thanks for the explanation.

    So as you saw on my above, later post, I fixed the culling issue setting the offset to 0 a opposed to any higher number. which is great! I went to sleep REALLY happy.

    I'm gonna try to see if I can implement a system where I disable certain reflections from certain waters at a certain distant in order to have the reflections working on the other body of water of choice. basically only have one reflection working at a time. should be easy to implement, just hoping that it works lol not a huge deal but would be nice to get this working :p

    I'll report back.

    and I'll have to give wavemaker a try.

     
  34. EL-soNK

    EL-soNK

    Joined:
    Jul 13, 2015
    Posts:
    28
    Love the water effect! Thank you for your work.

    Is there a possibility to make it work on a XY mesh, like if the water is on a wall/quad?
     
  35. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Happy to hear you like it!

    If the water appears to stretch when you rotate it on its side, you'll have to set the Tiling Method to "Mesh UV" under the Surface tab. The "World-aligned" method creates a UV projected on the XZ plane.

    Though you can open up the shader file and replace every instance of "(ase_worldPos).xz" with "(ase_worldPos).xy"
     
    protopop likes this.
  36. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    Hey Staggart!

    What tips to you recommend to get better framerate when using planar reflections? i have everything at lowest quality, Fresnel strength is low and visibly is low (subtle reflection on a big body of water). also If i only reflect one layer as oppose to all of them, i get better framerates, but still in the 20's. any advice?

    Any more love coming to SW1? I see you are having a blast with SW2 as I have that as well and loving the updates. but this project I'm asking for is not URP.

    Also,
    what exactly does the depth buffer do? i get this error, despite it already being added to the main cameras. I click "fix " and it stays there. nothing happens. also it flickers in out sporadically quickly and randomly. is this a bug?

    upload_2021-2-17_15-39-12.png
     
    Last edited: Feb 17, 2021
  37. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    Bump for below?

     
  38. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Apologies, you post seemed to have been buried in my notifications.

    The best way to determine why planar reflections is gobbling up performance is to check the Frame Debugger. To render the reflections, a second mirrored camera is used. So if rendering the scene normally takes a lot of draw calls, reflections will be expensive as well. Draw call optimization is quite a subject on its own, but definitely the most important when it comes to rendering optimization. Using the layer mask as you have, is already a good way to limit this. The material properties only control the visibilty of the reflections on the water, so these have no effect on performance. A reflection at 1% strength costs the same as 100% strength.

    Anything I wanted to do with SW1, and had been on my backlog for at least a year, required an overhaul. Which is what sprouted SW2, so I'm honestly not planning to change or add any features, only viable bug fixes and keeping it working in newer Unity versions.

    As for the warning, it may be that the camera is set to render a depth normals texture, which automatically includes a depth texture, so it's a false positive. I'll be able to correct this ;)

    The depth texture holds the depth value for every opaque pixel, and looks something like this: upload_2021-2-25_10-0-10.png

    It is used by the water to determine how far away something is below the water, so is required to be rendered. In Forward rendering, this has to be explicitly done for a camera, which is what the "EnableDepthBuffer" camera component takes care of. In Deferred rendering, this is done through other means, so isn't necessary.
     
  39. QbAnYtO

    QbAnYtO

    Joined:
    Dec 18, 2016
    Posts:
    223
    I see. thanks for the detailed explanation. I also use the Asset "Mesh combiner MT" and it works wonders for this draw call issue I have. I just wanted to figure out what other tricks I can apply. thanks agian.

    And honestly I'm not sure what else you can add to stylize water 1, I was just curious as too what else youy can add.

    I'm doing some black voodoos magic with the SC post process and the caustic to get under water caustics.. I basically just turn it on once the camera is under water. lol


     
  40. kinklade

    kinklade

    Joined:
    Jan 25, 2015
    Posts:
    3
    Hey Staggart,

    Thanks for the great asset.

    I was wondering if there was a way to make the water appear paused? I tried manually setting _Wavesspeed and _Foamspeed to 0, but that moves the offset when you do it, which doesn't look right.
     
    Last edited: Apr 9, 2021
  41. Artini

    Artini

    Joined:
    Jan 29, 2016
    Posts:
    182
    StylizedWater01pic01.jpg Just wonder, if swim effect suppose to look like the white stylized ring (behind the ship)
    or am I missing something?
     
  42. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Yes, but in comparison you're ship seems to have a scale of x0.01, so it looks huge ;)
     
  43. Artini

    Artini

    Joined:
    Jan 29, 2016
    Posts:
    182
    Thanks for the answer. Yes, it was just a quick scene made from your demo.
     
  44. rise9912

    rise9912

    Joined:
    Feb 19, 2018
    Posts:
    10
    Hello, we are using your asset, and everything good, but we have a constant problem from one project to another, that water for some reason being not visible in the android build. So we had to downgrade the asset version to 2.0.4 where we were able to get water to work in the android build
    Unity version 2019.4.10f
     
  45. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    Mobile devices tend to have a lower precision depth texture, it may be that transparency sorting breaks and the water is inadvertently rendering underneath the terrain/geometry. Increasing the camera's near clip value, and decreasing the far clip value will shorten the camera's rendering range, and increase the precision of the depth texture. After which, the water should appear as it does in the editor.
     
  46. davitsedrakian

    davitsedrakian

    Joined:
    Jun 23, 2018
    Posts:
    31
    Hello! @StaggartCreations ! I'm using your awesome shader but somehow it's not visible on android!
    How can I fix that?

    Unity 2019.4.26
    Galaxy S5 Device

    Build on macbook
     
  47. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    I recommend checking the first item in the troubleshooting section. So far, in all cases, this happens when Unity strips the depth texture from a build.
     
  48. SnaiperoG

    SnaiperoG

    Joined:
    Apr 6, 2015
    Posts:
    66
    This shader can work without depth buffer? Because it doubles the amount of vertecies in scene, which is very bad idea for mobile devices
     
  49. Gerlich

    Gerlich

    Joined:
    Nov 3, 2015
    Posts:
    37
    Hey @StaggartCreations
    I just wondered, is there any way to rotate the water plane on the Y axis?
    If you rotate the water plane, the object itself is rotating, but the way the water looks always stays the same.
    Might be a strange question, but I'd really need that for a project :D
     
  50. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    2,290
    To some extend, yes. The depth texture is used for the color gradient and edge fading, as well as the intersection foam effect. When using the mobile shader, a "Disable depth texture" option will be available under the "Advanced" tab.

    These effects will then be lost, though the intersection foam can be added through vertex painting as an alternative.

    Sure thing. By default the shader uses world-space coordinates, so that everything remains persistent when moving or scaling the water mesh.

    Under the "Surface" tab, you can set the tiling mode to "Mesh UV". After which, everything will align will the mesh's UV's. You may need to readjust the tiling value for several effects when switching to this (or adjust the mesh's UVs instead)
    upload_2021-10-4_14-27-51.png