Question Move particle on Edge of Sliced Sprite

Hi ,


I am looking for some starting tips and ideas how i can accomplish this .


First of all i have this slized UI image sprite wholes height and width might change according to text



its a transparent image with white rectangle . open in the broswer to see it

the above image is more like a path for my particle to follow .

is it possible to extract a path using above image and make an animated image or Vfx particle to follow this path ?

i am trying to accomplish this effect in the end

i wan to achive this using shader graph . some starting tips and hints will help a lot

 

the normal way would be using a plane strip that has UV coordinates in a line, when you then curve accordingly but that would not work with sliced frames, but you could have multiple sized planes, there is a bit of leeway with stretching you would hardly notice

Based on a sprite I wouldnt know how this would be possible, maybe try align a particle to a spline, or curve a plane strip along a spline and animate that

 

hi i did manged to achive some what but i am stuggling with excessive alpha cutting and non uniform lines speed

 

anyone ?

 

It seems like you’ve got a texture with a gradient in the RGB and an alpha mask that also has the gradient? You’re on the right track, but don’t have the gradient in the alpha, just use that as the line mask.

Use the animation gradient you have in the G channel as is to sample the color ramp texture, then multiply the alpha from the color ramp by the alpha from the animation gradient texture.