Filter Animation bleeds at edges (flames)

[Vision9000]

I imported 30+ PNG files of a fireball output from the fun TimelineFX tool.

I did the import as layers option.

I've tried with and without filter animation blending.

When I do filter animation playback, the edges of the animation coming from the separate fireball layers which have alpha transparency...

bleed solid orange all around the circumference.

This seems very strange. I did the "replace" option for each image/layer in the playback and it still does it.
My expectation for the animation is that the tiny particles at the edges would disappear layer to layer as it was being displayed, giving the effect of fluid fire particles.

Thoughts?

In the past I've taken sequences of images like that and animated like in JavaFX and it was smooth and accurate.

I would just use the GIF that can be output from TimelineFX but it is just a little bit slow with no way of adjusting.
So I wanted to create a GIF using Gimp.
I'm using 2.10.34

[rich2005]

I looked up TimelineFX and see that it is a particle effects editor.

Are the png images in color indexed mode.

Can you post one of the png images, if large file size use dropbox or similar. From your description I have seen similar but with indexed images where transparency is either on or off.

[Vision9000]

Thanks for replying, Rich!

I added the first png in the series to Box
https://app.box.com/s/0bcdiac61ie7kjfyuvpaxung1p667z87

It appears to be on a transparent background. The gif the TimelineFX can output does look okay...just slow.

The PNGs also appear to have a transparent background.

But if I need to tweak a setting to animate them in Gimp, I'm all for it.

I've used Gimp in the past a lot for compositing multi-layer art using images with alpha transparencies, but I haven't done animations yet with Gimp.

Any help/insights would be much appreciated.

Thanks!
Tom

P.S. I was happy to become a Patreon sponsor for the Gimp team today. And I'm glad I found this forum, because I would prefer to use Gimp for my animation needs. (Making game animations for personal use on The Forge for the Foundry VTT... token animations) [target WEBP and WEBM]

[rich2005]

It might be this:

   

1. Is your png image, it is RGBA, nothing wrong with it.

2. If it is converted to an indexed image, typically a gif (but can be a png) then alpha < 50% is thrown away alpha > 50% is solid.

3. The work-around for that is 'dithering' there is a setting in the gif export dialog and that is the effect. It works reasonably in an animation. Make sure the disposal is set to one-frame-per-layer-replace rather than one-frame-per-layer-combine.

If you are using the original png's for an animated webp there should be no problem. See what other replies come up.

[PixLab]

(08-21-2023, 12:23 PM)rich2005 Wrote: If you are using the original png's for an animated webp there should be no problem. See what other replies come up.

Why GIF is still a thing, it's a mystery to me, but I thing it's because up to last year, Photoshop did not export to webp , and it seems they do not export as animated webp yet as seen on their export dialog here > https://helpx.adobe.com/photoshop/kb/sup...ormat.html

I'm webp, animation for webp do NOT need to have an indexed image (256 colors is ugly), webp look smoother, webp is visually a LOT more appealing, the file size is way lower, no transparency problem...

GIF 744 kB 256 colors max


WEBP 412 kB 16 777 216 (16.8 millions) different colors at a time.


Webp also uses 8 bits for alpha channel and supports 0~255 levels of opacity...
Do I continue?

[Vision9000]

(08-21-2023, 12:23 PM)rich2005 Wrote: It might be this:



1. Is your png image, it is RGBA, nothing wrong with it.

2. If it is converted to an indexed image, typically a gif (but can be a png) then alpha < 50% is thrown away alpha > 50% is solid.

3. The work-around for that is 'dithering' there is a setting in the gif export dialog and that is the effect. It works reasonably in an animation. Make sure the disposal is set to one-frame-per-layer-replace rather than one-frame-per-layer-combine.

If you are using the original png's for an animated webp there should be no problem. See what other replies come up.

Much better!!! Instead of trying an animation, I just imported the series of PNGs (in order by name this time) as layers, and exported as WEBP. I tried a few settings, and ended up using lossy, as animation, 50 ms delay, apply settings to all frames. Ended up turning 32 PNGs 400x400 into a 1 MB file... and it loops smoothly and shows the wispy flames at the edges.

https://app.box.com/s/85vuu4h99lzv354nqkaqpc1lckk751nd

Thanks for the tips!

---

(08-21-2023, 05:22 PM)PixLab Wrote: Why GIF is still a thing, it's a mystery to me, but I thing it's because up to last year, Photoshop did not export to webp , and it seems they do not export as animated webp yet as seen on their export dialog here > https://helpx.adobe.com/photoshop/kb/sup...ormat.html

. . .

Webp also uses 8 bits for alpha channel and supports 0~255 levels of opacity...
Do I continue?  

Thanks Patrice!  

Your comments also inspired me to just try to go directly from the PNG series to a WEBP, and it worked fantastically!

I was using the (very fun) particle engine tool from about 10 years ago since I had it on hand, and it hasn't really had many updates. It can ouput sprite, sheet, gif or png series.

Yes, I really like the newer formats!!