User Tag List

Results 1 to 39 of 39

Thread: Under water / above water split view, is this possible?

  1. #1
    0
    Promoter
    Join Date
    Oct 2015
    Posts
    210

    Under water / above water split view, is this possible?

    Hi,

    I was wondering if anyone knows of some way to split post process effects over two halfs of your camera. I've been watching the new fluid simultations videos on the community hub and everytime they showcase water they have this insanely beautiful transition where your camera is at some point showing above water and the lower half is showing the underwater. They seem to have two seperate post process effects active and have them split by a mesh. This looks really really cool and I would kill (not really lol) to get this effect in my game project (signature).

    Here is a screenshot I took from the fluid simulation by render target video.
    Name:  898897e253e38a5aac9517b0f32cad31.png
Views: 1210
Size:  555.0 KB

    Oh Unreal lords, please share your knowledge. I just need to have this in my project. xD

    Cheers.

    EDIT: Waaiiit a min.... Are they using a atmospheric fog for this? And just setting the altitude value at exactly the height of the water surface? Meaning it's fake? Please tell me I'm wrong. Tell me there is some magical trick to do this.
    Last edited by WixZ; 03-20-2017 at 03:31 PM.


  2. #2
    2
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    I did that material by using the world position of the near clip plane. Since doing screenpos-> transform caused a crash I had to create a custom node to do it. I have an image from my twitter feed where somebody asked this same question:

    Name:  C698nz7XAAQvyOa.jpg
Views: 1106
Size:  32.1 KB

    Note that the 10 is hardcoded to match the default near clip plane. In VR editor the near clip plane changes based on world to meters scale. There is a way to access the frame's actual near clip if you need that but I will have to search for it later.

    No atmospheric fog. Just manual shader fog using scene depth.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  3. #3
    0
    Promoter
    Join Date
    Oct 2015
    Posts
    210
    Quote Originally Posted by RyanB View Post
    I did that material by using the world position of the near clip plane. Since doing screenpos-> transform caused a crash I had to create a custom node to do it. I have an image from my twitter feed where somebody asked this same question:

    Name:  C698nz7XAAQvyOa.jpg
Views: 1106
Size:  32.1 KB

    Note that the 10 is hardcoded to match the default near clip plane. In VR editor the near clip plane changes based on world to meters scale. There is a way to access the frame's actual near clip if you need that but I will have to search for it later.

    No atmospheric fog. Just manual shader fog using scene depth.
    Thanks for answering yourself Ryan. I kind of semi-understand your approach. Not entirely sure how the near clipping planes gives you the water surface and how you apply a fog beneath it though. Or did you just hardcode it at a certain height? Which would mean it will not work at all with displaced water?


  4. #4
    2
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    It gives you the world position to then access anything else you need. The start is to subtract the water Z, and then you add whatever displacement. You can map a world aligned texture to the world position of the screenpos and then use the result to offset the water Z. Then you have a black and white mask to blend between whatever you end up doing underwater and the raw SceneTexture for above water.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  5. #5
    0
    Promoter
    Join Date
    Oct 2015
    Posts
    210
    Quote Originally Posted by RyanB View Post
    It gives you the world position to then access anything else you need. The start is to subtract the water Z, and then you add whatever displacement. You can map a world aligned texture to the world position of the screenpos and then use the result to offset the water Z. Then you have a black and white mask to blend between whatever you end up doing underwater and the raw SceneTexture for above water.
    Sweet. I will definitely give this a try. I hope to God I can make it work. Would be so awesome. Thanks for the info!


  6. #6
    0
    Hey, I have a slightly off-topic question:
    Ryan, you helped me earlier with the underwater fog. Which was really nice.
    However, Translucent sprites (Bubbles for example) that are near are occluded by this Fog. Is there a possibility to avoid this?

  7. #7
    0
    Quote Originally Posted by Raildex_ View Post
    Hey, I have a slightly off-topic question:
    Ryan, you helped me earlier with the underwater fog. Which was really nice.
    However, Translucent sprites (Bubbles for example) that are near are occluded by this Fog. Is there a possibility to avoid this?
    Normal fog and transparency works in this order. Opaque -> Fog -> Transparents with vertex fog.
    So you just need to make sure that bubbles are rendered after water and then you need to reapply water fog to your bubbles at material level.

  8. #8
    0
    Infiltrator
    Join Date
    Jun 2015
    Posts
    11
    Are you guys going to share any material from gdc presentations? It would be very very nice to have! Thanks!

  9. #9
    1
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    I have been preparing it, but it has been going a bit slower than I expected. The main reason is that I am using some of this stuff in various game branches now and my changes I make there are not backwards compatible with the 4.14 version I am also polishing before release. So every few days I have to go back to the 4.14 version and redo my changes there. I still have materials to clean up but so far this is what the plugin is looking like:

    Name:  stuff.JPG
Views: 1006
Size:  17.4 KB

    The caustics stuff will be a lot harder to separate out so that will probably come much later.

    Originally I was going to break this into 4 or 5 separate packs, but it has turned out many of the functions are re-used across them all so I think I am just going to group them together like above. Might name it something more general like ShaderBits GDC Pack 1 or something.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  10. #10
    0
    Quote Originally Posted by Kalle-H View Post
    Normal fog and transparency works in this order. Opaque -> Fog -> Transparents with vertex fog.
    So you just need to make sure that bubbles are rendered after water and then you need to reapply water fog to your bubbles at material level.
    The Fog is a post Process though

  11. #11
    0
    Infiltrator
    Join Date
    Jun 2015
    Posts
    11
    Quote Originally Posted by RyanB View Post
    I have been preparing it, but it has been going a bit slower than I expected. The main reason is that I am using some of this stuff in various game branches now and my changes I make there are not backwards compatible with the 4.14 version I am also polishing before release. So every few days I have to go back to the 4.14 version and redo my changes there. I still have materials to clean up but so far this is what the plugin is looking like:

    Name:  stuff.JPG
Views: 1006
Size:  17.4 KB

    The caustics stuff will be a lot harder to separate out so that will probably come much later.

    Originally I was going to break this into 4 or 5 separate packs, but it has turned out many of the functions are re-used across them all so I think I am just going to group them together like above. Might name it something more general like ShaderBits GDC Pack 1 or something.

    Wow!! thank you so much!!!

  12. #12
    0
    Quote Originally Posted by Raildex_ View Post
    The Fog is a post Process though
    Post process effect can be rendered before transparent.

  13. #13
    0
    Quote Originally Posted by Kalle_H View Post
    Post process effect can be rendered before transparent.
    Got it. Thanks

  14. #14
    0
    Quote Originally Posted by RyanB View Post
    I have been preparing it, but it has been going a bit slower than I expected. The main reason is that I am using some of this stuff in various game branches now and my changes I make there are not backwards compatible with the 4.14 version I am also polishing before release. So every few days I have to go back to the 4.14 version and redo my changes there. I still have materials to clean up but so far this is what the plugin is looking like:

    Name:  stuff.JPG
Views: 1006
Size:  17.4 KB

    The caustics stuff will be a lot harder to separate out so that will probably come much later.

    Originally I was going to break this into 4 or 5 separate packs, but it has turned out many of the functions are re-used across them all so I think I am just going to group them together like above. Might name it something more general like ShaderBits GDC Pack 1 or something.
    Well, where can i download it ?

  15. #15
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    If you read my post, I was pretty clear that I am still preparing it and its a lot of work. Sometime in the next week or two is my goal.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  16. #16
    0
    Quote Originally Posted by RyanB View Post
    If you read my post, I was pretty clear that I am still preparing it and its a lot of work. Sometime in the next week or two is my goal.
    Sorry, my English is not good! Anyway, thanks your reply

  17. #17
    0
    Quote Originally Posted by RyanB View Post
    If you read my post, I was pretty clear that I am still preparing it and its a lot of work. Sometime in the next week or two is my goal.
    Awesome that you're putting this together. Have these been released yet? If so where can they be (or will they be in the future) downloadable from? Thanks.

  18. #18
    0
    Quote Originally Posted by RyanB View Post
    I did that material by using the world position of the near clip plane. Since doing screenpos-> transform caused a crash I had to create a custom node to do it. I have an image from my twitter feed where somebody asked this same question:

    Name:  C698nz7XAAQvyOa.jpg
Views: 1106
Size:  32.1 KB

    Note that the 10 is hardcoded to match the default near clip plane. In VR editor the near clip plane changes based on world to meters scale. There is a way to access the frame's actual near clip if you need that but I will have to search for it later.

    No atmospheric fog. Just manual shader fog using scene depth.
    Would It be possible to have a screen grab of the material since it's not in the GDC package.

    Thanks

    EDIT:
    This is what I've got so far but I don't know how to setup a Blueprint that would automatically input the world position of the water plane and can't figure out how to make the water line follow the mesh of the water plane.
    Name:  edgeTest.jpg
Views: 534
Size:  250.9 KB
    Last edited by XavierPlaymind; 05-17-2017 at 06:26 PM.

  19. #19
    0
    Finally I don't know why I didn't figure this out yesterday but no need for a complicated pp here's the solution if anyone was wondering. Thanks to Ryan.
    Name:  waterintersecting.jpg
Views: 503
Size:  499.3 KB

  20. #20
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    That will work for basic tranlucency, but for the extinction you really want to multiply the scene color by the extinction color. I originally was doing that via a mesh material as above, but the engineers have reworked the translucency as of ~4.16 so that scene texture does not include any other translucency in it which makes modulative effects tricky. That is why I have suggested it as a post process but either can work depending on what you need.

    To get the PP working, you just need to sample your displacement using the same screen to worldposition function and offset the Z of the result by whatever your wave displacement is.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  21. #21
    0
    Thanks! I'll look into how to make it work with a blueprint I've still got a lot to learn about blueprint but that should make for a nice experiment.

  22. #22
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    Blueprint shouldn't be necessary for that part. It should just work if you use world coordinates for both your water and post process material.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  23. #23
    0
    I can't seem to figure out how to make the 2 noises fit each other even after offsetting them by the same amount :/
    Name:  edgeTest2.jpg
Views: 459
Size:  544.5 KB

    EDIT
    I've come a little closer to a perfect match but it still got a bit of work to make them match at 100%
    Name:  edgeTest3.jpg
Views: 458
Size:  100.4 KB
    Last edited by XavierPlaymind; 05-19-2017 at 11:43 AM.

  24. #24
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    You shouldn't subtract object position from the left side unless you are actually going to handle that with BP and set it in the corresponding material. I'd just remove it.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  25. #25
    0
    Infiltrator
    Join Date
    Jul 2015
    Posts
    10
    For those who can't make this method to "align the waves" you need a high poly or/and a highly tessellated mesh

  26. #26
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    That is one way, but it also works fine as a post process material, you just need to do the same Z offset on the camera near plane and sample the same wave function. That works perfectly as long as you are only using Z offsets.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  27. #27
    0
    Promoter

    Join Date
    Mar 2014
    Posts
    265
    Quote Originally Posted by RyanB View Post
    That is one way, but it also works fine as a post process material, you just need to do the same Z offset on the camera near plane and sample the same wave function. That works perfectly as long as you are only using Z offsets.
    I tried this, but in PP material world position works badly with far surfaces, especially sky sphere.

  28. #28
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    Then you can use camera relative world position to get more precision back. but not sure what a sky sphere has to do with this. Why would you put this material on a sky?
    Ryan Brucks
    Principal Technical Artist, Epic Games

  29. #29
    0
    Promoter

    Join Date
    Mar 2014
    Posts
    265
    Not on sky, in camera post process.
    It was simple setup like:
    Z of (ScreenPosToWorld - WaterHeight + Sine(AbsWorldPos.X + Frac(Time)))

    When camera on "edge" of this, and I look on sky, mask becomes noisy, like dithered.

    Ok, I will try this with camera relative world position.
    Thanks!

  30. #30
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    You shouldn't do Sine of AbsWorldPos.x , you should use the ScreenPosToWorld for all the world positions there. The sky distance should never come into play.

    Should be more like this

    Z mask = ScreenPosToWorld.z - WaterHeight + Sine(ScreenPosToWorld.X + Frac(Time)))
    Ryan Brucks
    Principal Technical Artist, Epic Games

  31. #31
    0
    Infiltrator
    Join Date
    Jul 2015
    Posts
    10
    This are my materials which works with Ryan's method. (PostProcess + Translucent)
    Attached Images Attached Images   

  32. #32
    0
    Hey I recently was searching for this technique too, and found a ton of really great info in this other, related thread https://forums.unrealengine.com/showthread.php?54733-Is-this-possible

    Hope it helps!

  33. #33
    0
    Infiltrator
    Join Date
    Jul 2015
    Posts
    10
    Quote Originally Posted by BrianMay View Post
    Hey I recently was searching for this technique too, and found a ton of really great info in this other, related thread https://forums.unrealengine.com/showthread.php?54733-Is-this-possible

    Hope it helps!
    Useless, the issue is when you add a displacement to the water plane

  34. #34
    0
    Unreal Engine Developer
    Join Date
    Apr 2014
    Posts
    1,911
    I am not sure what you mean. He just posted that link for reference since it covers some similar issues. Just various ways of handling specific masking issues.

    isn't your issue with displacement resolved now?
    Last edited by RyanB; 05-30-2017 at 07:07 PM.
    Ryan Brucks
    Principal Technical Artist, Epic Games

  35. #35
    0
    Infiltrator
    Join Date
    Jul 2015
    Posts
    10
    Well yes and no, because you need a high tessallation/poly mesh, i was thinking to move it to a depth/stencil to gain some performance (or using that might get worse performance)..
    anyway, even tho, i write the water mesh to depth/stencil and there i am stuck, i can't find a way to get near depth position and then fill rest of screen under it ...
    can you give a hand Ryan?

  36. #36
    0
    Promoter

    Join Date
    Mar 2014
    Posts
    265
    Quote Originally Posted by RyanB View Post
    You shouldn't do Sine of AbsWorldPos.x , you should use the ScreenPosToWorld for all the world positions there. The sky distance should never come into play.

    Should be more like this

    Z mask = ScreenPosToWorld.z - WaterHeight + Sine(ScreenPosToWorld.X + Frac(Time)))
    Yeah, it works. Thank you Ryan!

    Here is very basic setup with sine waves:

    Name:  2017-05-31_1057.jpg
Views: 266
Size:  128.0 KB


    Name:  2017-05-31_1047.jpg
Views: 267
Size:  13.4 KB
    Last edited by redbox; 05-31-2017 at 03:59 AM.

  37. #37
    0
    Infiltrator
    Join Date
    Jul 2015
    Posts
    10
    Actually, even with high poly/tessellated plane, the waves from PP just don't match the water mesh

  38. #38
    0
    In post process material you would need to perfectly mimic the triangulation of the water mesh and then correctly calculate ray intersection with it per pixel. This is just not doable.

  39. #39
    0
    Infiltrator
    Join Date
    Jul 2015
    Posts
    10
    Actually, is quit easy with stencil, you create a box with inverted faces apply water material on it, write to stencil only and get water split line.Name:  water.png
Views: 156
Size:  378.4 KB

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •