Skip to main content
J
johnivanwhite
Known Participant
May 3, 2017
Question

My Exported PNGs don't have a clean Alpha transparency

  • May 3, 2017
  • 3 replies
  • 6605 views

Hi All,

I just created a game art character in Illustrator CC, sliced it up, exported the slices to PNG, but my Exported PNGs don't seem have a clean Alpha transparency—such as I'd get in Fireworks for example.

When I bring them into the 'Spriter' animation software, they appear to have ragged edges with white anti-aliasing (like a gif).

Q: Is it not possible to export with a clean Alpha transparency from Illustrator?

I tried PNG 8 and PNG 24, with:

> Save for Web (legacy)

When I tried any other export option, including 'export selection', it failed to save all of the slices. "Unable to export the following files."

But I digress...

Thanks all,

John

    This topic has been closed for replies.

    3 replies

    J
    johnivanwhiteAuthor
    Known Participant
    May 4, 2017

    This is what I'm doing now.

    It's taken me a day to grapple with this problem which shouldn't even exist. If only we could use Firewoks for stuff like this instead of resorting to Illustrator, which was originally for print work.

    It works! Unfortunately though, when they're exported, the names you give them aren't given to the PNG files. Which I really think is pretty poor.

    hexenwerk
    hexenwerk
    Participant
    October 3, 2024

    I've had this problem since a dozen years. My workaround is exporting a .tga with alpha channel and then converting it to png externally with a tool like Xnview. I can't believe I still have to do this.

    Monika Gause
    Community Expert
    Monika GauseCommunity Expert
    Community Expert
    October 3, 2024
    @hexenwerk  schrieb:

    I can't believe I still have to do this.

     

    Me neither. Most certainly you don't have to. Please show your AI file.

    J
    johnivanwhiteAuthor
    Known Participant
    May 4, 2017

    OK, I think I'm getting somewhere now:

    It looks as if the 'Assets Export' panel is only for 'Export to Screens', which as Monika pointed out, doesn't export slices (absolutely nuts).

    If you go 'Export' > 'Save for Web (Legacy)'

    ...and then adjust the settings for every slice individually in the pop-up export window (PNG-24, Anti-alias Art Optimised, and Transparency clicked obviously), that seems to produce the desired PNG files.

    Illustrator also remembers the settings that you made to each slice, afterwards.

    I'm happier now.

    Mike_Gondek10189183
    Community Expert
    Mike_Gondek10189183Community Expert
    Community Expert
    May 3, 2017

    Can you please post a copy of your save for web png settings, and copy of the .png.

    What color background is this going over, cans we take advantage of a matte color setting?

    J
    johnivanwhiteAuthor
    Known Participant
    May 4, 2017

    Hi Mike,

    Thanks for the reply.

    The separate PNG sprite images will overlay eachother so they have to be perfectly edged and transparent. So can't assume a white BG and matte for that.

    Here's what happens:

    1. 'Export > Export for screens' (2 images):

    Whether at the PNG or PNG 8 settings, it fails to export them all. And what is exported is transparent and blank. They can't even be imported or dragged into a dark canvas in Fireworks—to test their transparency and content. Nothing happens.

    * NOTE: 'Export > Selection' has the same effect with the same dialogue boxes.

    2. Export > Save for Web (legacy):

    Whether at the PNG 8 or PNG 24, it exports all of the images transparently, but with jagged, aliased, giffy edges. Having the backgorund in illustrator transparent seems to help. But they're still jagged.

    3. 'Export > Export As'

    This exports one image of everything. As a perfect alpha-transparency, smooth-edged PNG. But, as I say, they're all in one image.

    Thanks

    John

    J
    johnivanwhiteAuthor
    Known Participant
    May 4, 2017

    Are you sure you have the correct settings applied to each of your dozens of slices?


    Hi Monika,

    Here's a screenshot. It's hopeless:

    As you can see: The selected slice is labeled as 39 on the artboard, and as Asset 30 on the panel alongside.

    And when I left-click > Export Selection, it's labeled as Asset 31.

    Total nonsense. I made sure it was 'PNG' — which seems to mean PNG-24. When I export, the file is transparent but empty. PNG–24 should be good for Alpha Transparency, but here it appears to render everything 100% transparent!

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices