A character can look smooth in transparent PNG frames but develop jagged edges or speckled colour in an animated GIF. This is not necessarily a broken source image: the formats preserve different information. Check the intended delivery format before polishing individual frames.

What each format can preserve

A PNG frame can store a full alpha channel, so an edge pixel can be partly transparent. GIF uses indexed colours and a designated transparent palette index; a pixel is either transparent or not. Each colour table has at most 256 entries. An encoder may use different palettes or frame rectangles, so do not assume the entire animation necessarily shares one simple global palette. The MDN image-format guide explains the format constraints.

The practical consequence: a GIF made from soft, antialiased frames must approximate partial transparency. An encoder may use a threshold, a matte or dithering; the exact result depends on its settings. A matte chosen for a dark page can produce an edge halo on a light page.

A repeatable comparison

  1. Keep the original transparent PNG frames and make a separate GIF preview. Do not overwrite the source frames.
  2. Preview both over black, white and a representative game background. Inspect hair tips, feathers and translucent effects as well as broad body areas.
  3. Play the GIF at its intended size and speed. Dithering or palette changes that are unobtrusive in one frame can shimmer between frames.
  4. If the destination supports it, compare a lossless animated format with alpha, such as APNG, or ship the PNG frames or sprite sheet to the game instead. Confirm the target engine and browser support before choosing a format.
  5. Recheck timing and looping after export: the preview is a separate artifact and can behave differently from the runtime animation.

For native pixel art, preserve the intended limited palette and hard transparency; avoid smoothing or adding half-transparent pixels merely to make a preview appear larger. For painted 2D art, preserving soft edges may be more important than GIF compatibility.

MotifDeck is an AI game-art workspace where creators can inspect transparent extracted character frames and choose their timing. These format checks apply regardless of how the frames were made.

By Allen Zhao for MotifDeck, with AI assistance. The author is affiliated with MotifDeck.