Search Unity

  1. Unity 2019.1 is now released.
    Dismiss Notice

Stylized Water Shader - Desktop/Mobile/VR

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

  1. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    A viable solution could be to use dithering instead of transparency for the fish. That way they are alpha tested, where pixels are either opaque or invisible, nothing in between. This is used in a lot of applications to circumvent transparency sorting, and is generally cheaper too because there is no overdraw involved. If the transition happens fast enough it's difficult to tell the difference between dithering and transparency.

    https://media.giphy.com/media/d1FL4DPUtW1eO8Qo/source.gif
    Amplify Shader Editor has a dither node for something like this. Shader Forge has this functionality as well.

    I had tested a few months ago with a layer filtering feature for the intersection. But this required a secondary camera and essentially meant re-rendering all the scene geometry twice, which is very poor design. This could still be doable for use cases where that is no problem, and water is super important. So I may just add this functionality back in, and make it optional. My to-do list keeps growing :p

    I'm hoping the vertex painting option I posted yesterday provides a decent solution for most people. But this would make the effect static. Meaning it would only show where painted, and not on any "new" objects that intersect with the water at runtime. But that's a concession that has to be made.

    I'm also working on a tool to pre-compute the intersection, so this doesn't have to be manually painted.
     
  2. holdingjason

    holdingjason

    Joined:
    Nov 14, 2012
    Posts:
    85
    Thanks for the information. Dithering just might be the answer so will play with that.

    As for the intersection it might be possible to use a technique similar to how we do running through grass/grass bending. Basically pass into the shader the Vector coord of the object your trying to manipulate and when close to it don't do intersection. Just need to figure out now how and where your doing intersection so I can turn it off when near by. I was doing something similar as a test where I made the water more transparent around a patch. This worked well for that but the intersection stuff is a bit more to unravel.

    float distLimit = 4;// how far away does obstacle reach
    float distMulti = (distLimit - min(distLimit, distance(float3(i.worldPos.x, i.worldPos.y, i.worldPos.z), float3(_Obstacle.x, _Obstacle.y + 0.5, _Obstacle.z)))) / distLimit; //distance falloff

    o.Alpha = clampResult499 * clamp((1 - distMulti), 0.75, 1.0);

    UPDATE

    Ok found it. This effectively turned off the intersection around the object. Could do it as an array if I had more then one to deal with (right now just doing it on the bobber so I can see the fish better while fishing). Wish there was some way to identify the objects on the fly but can't think of anything.

    float distLimit = 5;// how far away does obstacle reach
    float distMulti = (distLimit - min(distLimit, distance(float3(i.worldPos.x, i.worldPos.y, i.worldPos.z), float3(_Obstacle.x, _Obstacle.y, _Obstacle.z))));
    float Intersection42 = clampResult438 * clamp((1 - distMulti), 0, 1.0);

    Here is a picture of it in action.

    fishing.png
     
    Last edited: Apr 5, 2018
  3. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Always nice to see context! :D

    I think I'll try implementing a buffer, where objects of a certain layer determine where the intersection effect should be shown. I could possibly make them add or subtract the effect. These objects could be attached to prefabs. Using a trail renderer for instance would in that case show the effect as a trail.

    If I were to do this, I can just as well use the same system to determine where the water should be invisible. This would be particularly useful for the insides of boats. This was requested at some point.

    But I want such a system to unintrusive and super easy to use, so it's going to take some time. Not sure when I'll get to it, but I just wanted to voice my desire for more control over rendering for cases such as your own :)
     
  4. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727


    Adding in a gradient color feature in version 2.0. Instead of picking a color for the deep and shallow water, you can use a gradient.
     
    dadude123 and brisingre like this.
  5. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Finished the set up for rendering objects into an intersection or opacity mask:





    Essentially you'll be able to tag a mesh (with any texture or shape) to denote where the intersection or opacity should be drawn.

    For instance, a rim mesh around a rock prefab, which would drawn the intersection effect. Or a square inside of a boat to draw opacity. Or a trail renderer:



    The whole system still requires some usability polish, I'll likely include a preliminary version in version 2.0, and continue refining it.
     
    dadude123 and brisingre like this.
  6. brisingre

    brisingre

    Joined:
    Nov 8, 2009
    Posts:
    272
    Wow! That looks amazing.
     
    StaggartCreations likes this.
  7. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    A brief intermediate update on version 2.0, every time I think it's close to finished I find something else to add :p

    I should note that despite a major version bump, this will be a free update to the exciting package. The price point will be increased to $20 when released.

    Demo scenes
    The package will include 3 new example scenes: Island, lake and pond. 2 trees and a rock set are included, you're free to use them!


    Orthographic camera's
    A much requested feature, and a common pain point for water shaders in general. Users with an orthographic camera will now be able to enjoy the full feature set, such as depth and intersection effects. This also enabled compatibility with AR applications like Vuforia.


    Mobile
    The current Mobile Advanced and Mobile Basic shaders have been combined into a single uber shader. Features such as lighting can be toggled to disable unnecessary rendering. It's now up to 37% faster, despite having much more features.

    I have a few more used Android devices on the way, to do more benchmarking. So far I have tested on a Oneplus One and Nvidia Shield.

    VR
    Finally got a headset so was able to test compatibly. I've found no issues, except that reflections do not work. This will be automatically disabled and a warning is displayed when Single-Pass Rendering is enabled in your project.

    Vertex colors
    The shaders now support vertex painting, which can be used to paint the intersection effect and opacity. A vertex painter will not be included as there are plenty of third-party tools for this, including free ones.

    Effects
    4 particle effects will be included that match the style:
    • Big splash
    • Circles
    • Trail effect
    • Small splash (footsteps)


    Effects are using a custom particle shader and are designed to utilize a single material. An optimized mobile shader version is included.

    UX Improvements
    The inspector GUI has had a facelift, panels are now animated and parameters have been clarified (less jargon).

    You'll also be able to check if there's a new version available from within the Editor.

    Under development
    • Mask rendering for intersection and opacity (need to think about how to make it easier to set up)
    • Shadow receiving from directional light (already works)
    Personal wishlist
    • Anisotropic reflection blur
    • Underwater blurring
    • Baking the intersection effect, making it static
    There are several more smaller additions and improvements I will elaborate on in a dedicated blog post.
     
    Last edited: Apr 21, 2018
    Peter77 likes this.
  8. dadude123

    dadude123

    Joined:
    Feb 26, 2014
    Posts:
    782
    This is coming along nicely, looks really good, I like it.
    Seeing those posts makes me glad I bought this asset.
     
    StaggartCreations likes this.
  9. Praetor1968

    Praetor1968

    Joined:
    Oct 17, 2017
    Posts:
    1
    i really want this package, but need 2.0 for the ortho camera support... any idea on when it would be available? i will buy it asap...
     
    Eater_Games likes this.
  10. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    I'm aiming to have everything finished and tidy before the end of next month. You can have a peek at my Trello board here: https://trello.com/b/GGZMi8dh/stylized-water-shader
     
    Eater_Games likes this.
  11. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Latest addition, vertical reflection blurring. It's quite a heavy effect (requires multiple passes), especially when using multiple cameras, but it can simply be disabled entirely.



    Still have some script-related quirks to iron out though!
     
    Peter77 and brisingre like this.
  12. brisingre

    brisingre

    Joined:
    Nov 8, 2009
    Posts:
    272
  13. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Almost finished with the version 2.0 package, so if everything pans out I'll submit the update some time next week!

    Better video of the particle effects:


    On another note, I made a somewhat drastic change to the desktop shader, namely the removal of tessellation. This lowers the required shader model to 3.5 (instead of 4.6), and makes it directly compatible with OpenGL on MacOS and older devices.

    The flip side is, a lot of operations can now be done on a per-vertex basis, so it's a fair increase in performance. I've also managed to implement the option for cheaper lighting rendering.

    Downside is, a mesh needs a decent polycount for detailed wave animations. But this could also be circumvented using water tiles with LODs.
     
    Last edited: May 11, 2018
  14. markoal

    markoal

    Joined:
    Aug 31, 2015
    Posts:
    16
    Just bought the package and can't wait for v2.0.
    Is there any script or a simple way for floating physics (floating objects on the water that follows waves)?
     
  15. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Thanks for your purchase!

    Unfortunately not. I looked into the subject again, since the least I wanted to do was to expose a function to get the wave height at a given position. That way packages like Realistic Water Physics would simply work.

    But since the waves are generated on GPU, there is no way to read this information back to the CPU. At least, not in a fast way, or without stalling.

    There may be another way through compute shaders, but it's bound to be pretty convoluted and complex, which is why I can't add support for buoyancy at the time.
     
    markoal likes this.
  16. brisingre

    brisingre

    Joined:
    Nov 8, 2009
    Posts:
    272
    How complex is the wave generation, and how often do you make changes to it? It seems like it might be possible to do it by just re-implementing the wave generation in C#.
     
  17. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    That would be possible! Though the waves are generated through heightmaps, so it's difficult to reproduce same the animation through script. Ultimately, I'd need to avoid reading texture pixels from script, since it's very slow.

    I have a gerstner wave implementation on my wishlist. It's possible to run these same calculation in parallel on the CPU. That would open up the door to wave-height queries. But this is all for another rainy day :p
     
    brisingre likes this.
  18. brisingre

    brisingre

    Joined:
    Nov 8, 2009
    Posts:
    272
    Those are sure some sexy waves. I bet I could implement this gerstner function, looks like it'd be useful in my procedural texturing library too...
     
  19. brisingre

    brisingre

    Joined:
    Nov 8, 2009
    Posts:
    272
    Aight, I've got a Gerstner Wave function for ASE if you want it. Still a WIP but I think it's working right now.
     
    Last edited: May 14, 2018
  20. brisingre

    brisingre

    Joined:
    Nov 8, 2009
    Posts:
    272
  21. Pescu

    Pescu

    Joined:
    Jun 7, 2014
    Posts:
    15
    Eater_Games likes this.
  22. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Thanks for the file, I appreciate the sentiment! However, I feel like I should figure it out myself, I've been meaning to figure out how it works, and that's the fun part for me :D

    Unfortunately I never saved these settings, I made a few variation, took a screenshot, and then made another one.

    The first screenshot actually looks like the default settings for the "Desktop Beta" material. The second has slightly darker color, the "Foamy" intersection style, "Sharp" heightmap style. The "Wave tint" parameter is increased slighty, which gives the top of the waves a brighter color. And it seems like the fresnel color is set to a light blue. The transparency value also seems to be set to 1 (fully opaque).

    That's what I can make of it ;)
     
    brisingre likes this.
  23. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Submitted version 2.0.0, will elaborate on the new features in a dedicated blogpost once it is approved. Meanwhile, the online documentation has been updated, and the android APK demo has been revised and uses the new mobile shader.

    The mask rendering feature is something I will have to get back to later.

    Added:
    - 3 new demo/example scenes: Island, lake and pond.
    - 4 water VFX assets
    - New Mobile uber shader (up to ~37% faster)
    - Orthographic camera support
    - Lighting modes (Unlit/Basic/Advanced)
    - Vertex painting support for intersection and opacity
    - Support for Single-Pass Stereo rendering
    - Reflection blurring
    - Tiling deduction toggle (Desktop only)
    - Color gradient feature (Desktop only)
    - Additional waves layer toggle, for improved wave animations
    - Surface highlight and Intersection distortion parameters
    - Custom heightmap option

    Changed:
    - Inspector UX improvements, sections now function as an accordion
    - Tiling is now separated for each feature (Normals/Waves/Intersection/Foam)
    - "Surface highlights" is now called "Foam" for clarity
    - Depth and Intersection maximum value ranges have been increased
    - Desktop shader no longer uses tessellation, for wider compatibility
    - Compressed textures option now automatically bakes textures when value is changed
    - Increased UV size of included meshes to be more in line with World-space tiling
    - Wave direction now also allows negative values
    - "Custom" toggles for intersection and waves is now a dropdown menu option

    Removed:
    - Old demo scene and related assets
    - Deprecated desktop shaders
    - Mobile Advanced and Mobile Basic shaders
     
  24. brisingre

    brisingre

    Joined:
    Nov 8, 2009
    Posts:
    272

    Exciting!

    That is the fun part, I agree. And these turned out to be easy -- if/when you do pursue them it'll only take you a couple hours.
     
  25. TheTalkingBoot

    TheTalkingBoot

    Joined:
    Nov 24, 2017
    Posts:
    27
    Hi!

    I just downloaded the update, nice improvement! Especially with the mobile shader.
    But I encounter some issue when I use it:
    Assertion failed: Assertion failed on expression: '(srcData.GetChannelMask() & copyChannels) == copyChannels'

    And when I open it with Amplify : AmplifyShaderEditor.SWS_Depth is not a valid ASE node
    I wanted to use a cubemap to have pre-calculated reflection.
     
  26. holdingjason

    holdingjason

    Joined:
    Nov 14, 2012
    Posts:
    85
    Thanks for the help before. We modified your wave generation algorithm to support buoyancy and just wanted to share a video of that in our WIP game http://play-crittercove.com Thought you might want to see it. Works great so far. Need to update to your 2.0 version.

     
    DrOcto, markoal and brisingre like this.
  27. markoal

    markoal

    Joined:
    Aug 31, 2015
    Posts:
    16
    Looks nice, I like how fishes look. I also need buoyancy but didn't catch time to see how to modify it. How do you detect water level?

    I also have another question, if I'm working on the multiplayer game, is there any way to synchronize water on the clients (like the seed?). I guess that only water level (for waves) is important to avoid in air ships/objects of other clients?
     
  28. holdingjason

    holdingjason

    Joined:
    Nov 14, 2012
    Posts:
    85
    Basically using my own wave generation algorithm that can be synced between cpu (c#) and gpu on the shader. If they use the same basic algorithm and feed in the same time value (and any other values needed) then you can calculate height on both sides. I will try and work up a post on how I did it and where to do the mods.

    Never really considered that before but basically ya you would need to use a timing value that you pass to all the clients, continuously, to keep them in sync. If everyone is using the same time value then it should work. You would not have to pass that value ever millisecond but would need to periodically (think ever second or so) and then lerp locally so you had some dead reckoning going on. That would probably work but again this is off the top of my head.
     
    Stickeyd and markoal like this.
  29. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    markoal likes this.
  30. joelcarlson

    joelcarlson

    Joined:
    Apr 7, 2014
    Posts:
    43
    Beautiful asset you have here! I've been messing around with it for quite a while, but I must admit that I'm in a bit over my head. Any chance you could do a tutorial on using Polybrush to do vertex based intersections? That would be amazing!
     
  31. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    The error only occurs in Unity 2018.1+ in the demo scenes, it has something to do with lightmaps according to some people, other than that it's extremely vague. Fortunately it has no negative effect on the usage of the shader or script.

    For ASE, you can replace the missing node with the regular "Depth Fade" and just leave the Distance input empty. You can pipe the output into the "DepthTexture" register. You can find it in the Reflection/Refraction/Depth box.

    Glad to hear you like it! Could you elaborate on what seems to be unclear? The documentation also has a section about vertex colors, which I've clarified a bit: http://staggart.xyz/unity/stylized-water-shader/documentation/#vertex-colors
     
  32. TheTalkingBoot

    TheTalkingBoot

    Joined:
    Nov 24, 2017
    Posts:
    27
    Thanks for your reply.
    I tested that but when I compile the shader, some of the other features don't work correctly.
    Especially the Foam and Intersection.

    Other nodes have probably been altered on export?
     
  33. MechaWolf99

    MechaWolf99

    Joined:
    Aug 22, 2017
    Posts:
    16
    Hey,
    V2 is great! Love the new VFX. I was going to ask about adding support for waterfalls. But I see on the trello board that you already have it on there. So I was wondering, do you have a rough time line for it? Not looking for a hard time or anything, just trying to get a feel for what you are thinking (3 months, 6 months, 2 years, etc.).
     
  34. joelcarlson

    joelcarlson

    Joined:
    Apr 7, 2014
    Posts:
    43
    Thanks for the response! I guess my question was a bit confusing. I've focused on 2d my entire life, so adding vertex colors was above my head! No worries. I figured it out!

    Next question. Is there a way to change the intersection color to not be additive? I'd love to just select my color in the menu and have an accurate representation in game.
     
  35. TheTalkingBoot

    TheTalkingBoot

    Joined:
    Nov 24, 2017
    Posts:
    27
    I downloaded the update of 30 May and redo the manipulation with the Depth node. everything works now!
     
  36. EnderYoss

    EnderYoss

    Joined:
    Sep 28, 2017
    Posts:
    3
    I've got a question regarding the waves, is there any way of checking the height of the wave at a certain position. I tried to do this with a mesh collider but it doesn't seem to work.
     
  37. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    By default, the intersection color is multiplied by 3 so that's possible to make it more prominent. You can adjust the intersection color alpha amount to control the opacity. So for instance, an alpha value of ~85 should result in a more natural color.

    During development of version 2.0 I tried to add river functionality to the shader, but so many small things had to be changed to get a believable effect that it turned into an unmanageable mess. I'll likely have to create an entirely separate shader which is specifically geared towards rivers and waterfalls.

    Though, in the upcoming three months I'll only have enough time to work on bugfixes and answer support questions so I couldn't give you a timeframe on any new features unfortunately.

    Buoyancy is currently not possible since the waves are generated on the GPU and reading this data back to the CPU is generally convoluted and too slow. You can, however, add a script that animates the mesh's vertices in real-time. That way waves are kept on the CPU side and can be read at a certain position.
     
  38. EnderYoss

    EnderYoss

    Joined:
    Sep 28, 2017
    Posts:
    3
    Thanks for your response! I'll give that a go, also thanks so much for making this quality asset.
     
    StaggartCreations likes this.
  39. Stickeyd

    Stickeyd

    Joined:
    Mar 26, 2017
    Posts:
    22
    Does this asset have some sort of texture water projector available? Can I project the texture I want on the ocean? Also, does it support breaking waves, whirlpools, tornadoes, and water manipulation to create water magic effects? Or will I at least be able to combine it with Mega-Fiers?



    I want to create some sort of water magic effect. Like, creating a graphical wave, or creating a big water spike. But the main requirement is that it will be graphically the same water. Not done with particles. Also, is it possible to make this water effect stop in the air? For example, I want to create a water spike which will not move after created. I'm okay if it will be only graphical, no physics

    Also will this asset work with Dynamic Water Physics asset to create buoyancy? Can it provide water height at a requested position?
     
    Last edited: Jun 6, 2018
  40. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Many of the things you describe are very specific, and the asset is not geared towards achieving any of them. The effects shown in the MegaFiers video will still be possible, simply because it modifies the vertices of the mesh in a procedural manner.

    Also because the shader is transparent it will not handle overlapping with itself nicely. Which can definitely pose an issue when you extrude the geometry far enough. So all in all, I couldn't fully recommend this asset for your use case, it may be a hit or miss...
     
    Stickeyd likes this.
  41. Stickeyd

    Stickeyd

    Joined:
    Mar 26, 2017
    Posts:
    22
    Will such modification of mesh vertices work with the waves also even though they are created on GPU side? I mean, if I use Mega-Fiers on places where there are waves.

    Also, does this asset support reflections of the skybox? For example I want to implement Aurora borealis and reflect it on the water.

    Also, will this asset be working good in simulating large oceans?
     
    Last edited: Jun 7, 2018
  42. EnderYoss

    EnderYoss

    Joined:
    Sep 28, 2017
    Posts:
    3
    Hello again! I noticed that you've mentioned that the models in the demo scenes are free, is there a licence for the materials and other assets in the demo folders?
     
  43. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    The wave animation on the GPU will be added on top of any vertex animations done through script. So if you were to create a buldge or dimple in the mesh, the wave animation would still be seen in those areas.

    If the lighting mode is set to "Advanced" the material will support skybox reflection or reflection probes. In any case, the realtime planar reflections feature will reflect the entire scene. Though a simple cubemap reflection may suffice in some cases.

    If set the tiling method to "World-space" you can scale up the water plane as large as you want, this is useful for oceans.

    If you have any further questions, feel free to ask!

    There is no special license for the demo content, as with any asset store asset, you're free to use them as long as they are not redistributed outside of the game media.
     
  44. Stickeyd

    Stickeyd

    Joined:
    Mar 26, 2017
    Posts:
    22
    Is there a way to make waves higher? If not, would it be hard to edit shader to make them higher? They are not really high even on maximum height. Or am I doing something wrong?

    I can't achieve waves like here
     
  45. unity_kbExcAVcsD4sjg

    unity_kbExcAVcsD4sjg

    Joined:
    Jun 8, 2018
    Posts:
    1
    Hello! I've enjoyed using the product so far. I'm wondering if it is possible with this shader to display ONLY the foam/shoreline interactions and NOT any of the ocean, or just have it set to full transparency. Thank you!
     
  46. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    If the wave height parameter is at its highest and you still want higher waves, you can scale your water mesh on the Y-axis to the same effect.
    Somewhat, the water will still be slightly visible in most cases, except when the lighting mode is set to "Unlit", when it can achieve full transparency. Excerpt from the documentation about this:

     
  47. asger60

    asger60

    Joined:
    Mar 27, 2013
    Posts:
    5
    Hi, I just bought the asset and I'm very happy with it so far :)
    I have a few question though.
    It would in general be nice to be able to set the intersections in other ways than vertex paint. To be specific, I would very much like to be able to do this https://twitter.com/JonnyIO/status/983790215797116928
    Is that feature not in this version, or am I simply going blind?
    Also, as far as I can see, the only way to fade out the intersection foam is with an opacity fade. Is it possible to fade it in other ways. I'm after something like the example in the gif I've attached.
    And also also, is this foam effect possible? https://twitter.com/SpeedyMastretta/status/970152525411307521
     

    Attached Files:

    Asger600 likes this.
  48. StaggartCreations

    StaggartCreations

    Joined:
    Feb 18, 2015
    Posts:
    727
    Ah yes, the mask rendering feature didn't make it for version 2.0. The functionality works, but the setup required is a little convoluted and not very user-friendly. I still need to build a layer of abstraction around it so it's possible to simply attach a script to an object and tell it if it should add intersection foam, draw opacity, or flatten waves. When? As much as I'd like to delve into this, I'm pretty strapped on time until September unfortunately.

    The foam you see in that gif is not reproducable with this shader. The way this asset is built as it is now, doesn't allow for these specific kind of effects. It looks very different, because it works very differently ;)
     
  49. SilverStorm

    SilverStorm

    Joined:
    Aug 25, 2011
    Posts:
    509
    How did you achieve such smooth animation transition of the deer jumping into the lake lol!

    Aww I liked the old bridge demo scene. They look a lot nicer than the new demos and show a very different water variant of use cases of the shader. Was there a specific reason it was removed?
     
  50. mmaclaurin

    mmaclaurin

    Joined:
    Dec 18, 2016
    Posts:
    182
    Hi, recent purchaser, really impressed, it's a fine asset.

    I am having a little trouble with the trail renderer.

    1. I attach a trail renderer to my boat
    2. A set particle type to trail particle
    3. Play on Mac - white lines define both sides of the trail, but the middle is transparent. looks okay but I think not how designed.
    4. Play on iOS - the trail looks much more like the intersection foam pattern, but in this case it also shows a black line underneath the trail

    What am I missing?
    - Matt