Unity UI UI Effects and Particles

Hi!

I am trying to add shimmers, shines, sparkles, particle awesomeness to my games UI, but cannot find any information regarding the subject online.

My simplest guess would to just have tons and tons of sprite animations, but that is very file size and memory heavy.

Does anyone have links, references, ideas how to tackle this? I find it quite surprising that there's nothing online about this...

 

As for particles:
Going the easy way with screenspace -camera you can just add a normal particle system.
As for screenspace overlay you could use this:
https://github.com/mob-sakai/ParticleEffectForUGUI
or
https://bitbucket.org/UnityUIExtensions/unity-ui-extensions/wiki/Controls/UIParticleSystem
or a separate camera rendering the particles: https://techblog.king.com/showing-particles-in-a-screen-space-overlay-canvas/

As for other effects, I would say a lot can be done with shaders. Here is a nice example:

 

Thanks for your reply.

That was an extremely interesting video! It seems like shaders are the way to go, though even this I cannot find any information on (for UI specifically).

Anyone else have links/resources/documentation on shaders for pimping up UI?

 

Some specific examples:

1) UI image sequence or mesh warp+shader or other?


2) how does one do this to UI images?


3) how to achieve animatable lighting effects like this for UI images?


4) this tutorial used a sprite sheet animation but is it possible to achieve with particles?


Remember I am asking how to achieve this in a UI Canvas. I know this is pretty straight forward with 2D SpriteRenderer but not so much in the UI Canvas.

 

The lack of activity on this thread tells me no one knows anything about this or it's simply not possible, both being very problematic...

 

1.) Pretty sure just an image sequence (Changing the color inside, writing a shader for that would be too much overhead for just this little detail)
2.) Those are all shaders
3.) You could just blend between two graphics (one with glow, the other one without)
4.) For sure you can do that with just particles. To see how you connect them to the canvas, see my first post.

I would say the lack of activity is because not that many developers know how to write shaders (and those who do are probably more active in the shader subforum) and because you are not very precise with your second question.
I would recommend, to take a closer look at shaders. The example I posted could be easily adapted to a ui shader.

So here are the steps I would recommend:
1.) Learn writing shaders in general (take a look at this link collection, especially Shaderslab and Alan Zucconi will be interesting for you).
2.) Take a look at the default ui shader from unity, you can download it here: https://unity3d.com/unity/qa/patch-releases
Download Built In Shaders from the unity version you are interested in. The default shader is in DefaultResourcesExtra\UI\UI-Default.shader
3.) Play around with that shader and try to do some simple stuff with it
4.) Implement effects you learnt in step one on the ui shader.

I hope that helps

 

You can get it to work with a screenspace camera canvas with a normal particle System:


And those are the simple settings for the Particle System:


Sorting will be not that easy though. I think it is not possible to be paritally in fornt and partially behind an UI element, you would need two particle systems for that. But particle Systems do support sorting through sorting layers and sorting order, so you can get more complex. Since I really like Screenspace Overlay Canvases I think this solution is the better choice: https://github.com/mob-sakai/ParticleEffectForUGUI

 

Why did nobody link this one? https://github.com/mob-sakai/UIEffect
It's exactly what OP was looking for.

 

If you use camera stacks in URP, you can position your particle systems either behind or in front of UI elements, but still have them overlay the main scene cam: https://bdts.com.au/tips-and-resour...p-using-overly-cameras-and-camera-stacks.html

 

Is there way to fade the particle system according to the canvas group alpha value?

 

Take a look at the repo linked above (https://github.com/mob-sakai/ParticleEffectForUGUI). There you can see which methods support canvas group alpha out of the box. The normal particle system would need some kind of listener script to refresh its transparency on changes.

 

Oh man that first link (Particle Effect for uGUI by mob-sakai) is awesome! Super easy to use. My mobile game is already using Screenspace - Overlay and when I've changed that in the past to another option it messes up the whole UI so I really didn't want to do that. Thanks for the links!

 

Check this video it has everything about particles system on the UI Canvas on unity