Highlighted

Export an animated gif to be transparent? (Specific issue below)

New Here ,
Nov 29, 2019

Copy link to clipboard

Copied

Transporting as a transparent gif is easy, you just select the box, and you're good, but I can't get rid of that white ring around the outside.
Does this program support partial transparent pixels on every color? My image has a solid black outline, so there's a gradient from black to white shown in the color range, but I simply need partially transparent black pixels.
Most fixes cause the outline of the image to be very jagged and lack any sort of dithering or antialiasing.

To amend Nick's answer: Gif images only support 1-bit transparency. It is either on or off, with no in-between transparent values possible. And as such, when you export a semi-transparent pixel to Gif, the software must multiply that pixel with the background matte colour (which in most software can be selected during export).

 

The result is often a white aliased edge surrounding the graphic where the original semi-transparent anti-aliased pixels sat.

 

In short, it is a limitation of the Gif format. You will always have to live with aliased edges where the edges meet transparent areas in Gif.

 

The most acceptable solution is to switch to APNG (animated PNG) instead, which is supported in all major modern browsers, including Edge. APNG does support partial transparency.

Of course, with Adobe traditionally lagging behind the times, users can rely on AnimateCC not supporting output to APNG, and you will have to export your animation as a PNG sequence first, and then use a converter to save an APNG animation.

 

Some suggestions: http://littlesvr.ca/apng/

 

Support for APNG is now at almost 90% global:

https://caniuse.com/#search=apng

TOPICS
How to, Import and export, Missing feature

Views

1.2K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Export an animated gif to be transparent? (Specific issue below)

New Here ,
Nov 29, 2019

Copy link to clipboard

Copied

Transporting as a transparent gif is easy, you just select the box, and you're good, but I can't get rid of that white ring around the outside.
Does this program support partial transparent pixels on every color? My image has a solid black outline, so there's a gradient from black to white shown in the color range, but I simply need partially transparent black pixels.
Most fixes cause the outline of the image to be very jagged and lack any sort of dithering or antialiasing.

To amend Nick's answer: Gif images only support 1-bit transparency. It is either on or off, with no in-between transparent values possible. And as such, when you export a semi-transparent pixel to Gif, the software must multiply that pixel with the background matte colour (which in most software can be selected during export).

 

The result is often a white aliased edge surrounding the graphic where the original semi-transparent anti-aliased pixels sat.

 

In short, it is a limitation of the Gif format. You will always have to live with aliased edges where the edges meet transparent areas in Gif.

 

The most acceptable solution is to switch to APNG (animated PNG) instead, which is supported in all major modern browsers, including Edge. APNG does support partial transparency.

Of course, with Adobe traditionally lagging behind the times, users can rely on AnimateCC not supporting output to APNG, and you will have to export your animation as a PNG sequence first, and then use a converter to save an APNG animation.

 

Some suggestions: http://littlesvr.ca/apng/

 

Support for APNG is now at almost 90% global:

https://caniuse.com/#search=apng

TOPICS
How to, Import and export, Missing feature

Views

1.2K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Nov 29, 2019 0
Guide ,
Nov 29, 2019

Copy link to clipboard

Copied

Hi mate,

 

You need to learn more about the GIF file format and the difference between 8-bit and 32-bit files, esp. in the way they can handle transparency.

 

- Nick: Character designer and animator, Flash user since 1998
Member of Flanimate Power Tools team - extensions for character animation

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 29, 2019 1
Guide ,
Dec 01, 2019

Copy link to clipboard

Copied

To amend Nick's answer: Gif images only support 1-bit transparency. It is either on or off, with no in-between transparent values possible. And as such, when you export a semi-transparent pixel to Gif, the software must multiply that pixel with the background matte colour (which in most software can be selected during export).

 

The result is often a white aliased edge surrounding the graphic where the original semi-transparent anti-aliased pixels sat.

 

In short, it is a limitation of the Gif format. You will always have to live with aliased edges where the edges meet transparent areas in Gif.

 

The most acceptable solution is to switch to APNG (animated PNG) instead, which is supported in all major modern browsers, including Edge. APNG does support partial transparency.

Of course, with Adobe traditionally lagging behind the times, users can rely on AnimateCC not supporting output to APNG, and you will have to export your animation as a PNG sequence first, and then use a converter to save an APNG animation.

 

Some suggestions: http://littlesvr.ca/apng/

 

Support for APNG is now at almost 90% global:

https://caniuse.com/#search=apng

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 01, 2019 2
Adobe Community Professional ,
Dec 02, 2019

Copy link to clipboard

Copied

Welcome to this Big 100 Project tutorial. If you don't know what that is, find out: http://thebig100project.co.uk/ Intro to Adobe Animate Series: https://www...

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 02, 2019 1