How to create Particle Dissolve Effect on SVG with gsap?

[Shalaw Fatah]

Can anyone give me where to start if I want to create Particle Dissolve Effect on SVGs in gsap? I appreciate your help. 

This is an exmaple of the effect, although this is done to video which I don't need, I need it on a simple SVG.

 

 

 

[ZachSaucier]

16 minutes ago, Shalaw Fatah said:

Can anyone give me where to start if I want to create Particle Dissolve Effect on SVGs in gsap? I appreciate your help. 

This is an exmaple of the effect, although this is done to video which I don't need, I need it on a simple SVG.

Hey Shalaw. SVG is not good for this sort of effect. What you should use instead is the <canvas> element or even WebGL. As for how to do so, it depends on exactly what you want to make into particles. What's the end goal?

 

Also keep in mind that GSAP is primarily a value manipulator, so it doesn't have effects like this built in. You'll have to build most of the logic yourself, using GSAP to animate values as needed.