Dev.to AI πŸ€– Ai πŸ‘ 0 πŸ“– 3 min read

Building an AI animated emote maker: sizes, limits and what Twitch rejects

I've been building a tool that turns one selfie or character picture into a set of animated emotes for Twitch and Discord. The AI part turned out to be maybe half the work. The other half is boring and important: making

I've been building a tool that turns one selfie or character picture into a set of animated emotes for Twitch and Discord. The AI part turned out to be maybe half the work. The other half is boring and important: making sure every file actually uploads. This post is the checklist I wish I'd had on day one.

The numbers that matter

Twitch (emotes) β€” from Twitch's own emote guidelines:

  • Static emotes are PNG, animated emotes are GIF.
  • Two upload routes: auto-resize (one square file between 112Γ—112 and 4096Γ—4096 px, max 1 MB) or manual (three files: 112Γ—112, 56Γ—56 and 28Γ—28 px).
  • In manual mode an animated GIF can be up to 512 KB per size.
  • Animated GIFs can have at most 60 frames.
  • Square only, and a fully transparent background is what Twitch asks for.
    Discord (custom emoji) β€” from Discord's support page:

  • Under 256 KB per emoji, static or animated. This is the limit that bites hardest.

  • JPEG, PNG, GIF or WEBP. Names need at least 2 characters, letters/numbers/underscores only.

  • 50 static slots by default; animated slots depend on Nitro / server boosts.

  • Animated Twitch sub emotes synced into a server show up static only, so animated ones have to be uploaded by hand.

7TV and BetterTTV β€” these change more often, so check the uploader before you trust any table (including mine):

  • BTTV is shown at about 28 px tall in chat; a 112Γ—112 source is the safe choice, PNG or GIF, keep it under 1 MB.
  • 7TV accepts WebP, GIF, PNG and AVIF and serves 1x–4x versions, so a 128Γ—128 square source works well. Its file limit is far more generous than Discord's. ## What actually gets rejected (or looks bad)
  1. Not square. A 112Γ—110 GIF from a sloppy crop is an instant fail. Pad to square, never stretch.
  2. Too many frames. AI video and GIF tools love 80–120 frames. Twitch caps at 60, so drop frames evenly instead of cutting the loop short; otherwise the loop jumps.
  3. Too heavy for Discord. A 112 px GIF that is fine on Twitch can still be over 256 KB. What helped most, in order: fewer colours in the palette, fewer frames, then smaller dimensions.
  4. Flashing. Twitch's guidelines say animated emotes should not flash more than 3 times a second. Fast "hype" loops trip this easily.
  5. Unreadable at 28 px. Not a hard reject, but it is how most viewers see the emote. Thin outlines and small text disappear. Preview at 28 px before you ship.
  6. A meaningless first frame. Viewers with animated emotes turned off see a still. If frame 1 is a blink or a blank pose, the emote reads as nothing. ## The generation flow

The part that took longest was keeping the emotes looking like one character. Generating each emote straight from the selfie gives you eight slightly different people. What works better:

  1. Lock the character first. From the upload, make one reference character (optionally restyled: chibi, anime, 3D toy, pixel art, flat sticker) and treat it as the single source of truth.
  2. Generate every emote from that locked character, not from the original photo: Hi, GG, LOL, Hype, Love, Sad, Sip, Sleep…
  3. Post-process each animation: cut the background, slice the loop, square it, resample frames to ≀60.
  4. Export per platform: 112/56/28 for Twitch, a 128 px version squeezed under 256 KB for Discord, and validate every file against the limits above before it goes into the ZIP.
  5. Fail honestly. If a generation is broken, the user should not pay for it, so failed runs refund their credits.

Step 4 is pure image processing and costs nothing to run, yet it is the step that decides whether a streamer can use the result at all.

Takeaways

  • Treat platform limits as unit tests: validate every exported file, every time.
  • Discord's 256 KB, not Twitch's sizes, is usually the real constraint.
  • Consistency comes from a locked reference, not from better prompts.

If you want to see the result of this pipeline, the tool is here: https://animatedemotemaker.com

πŸ“° Read the original article on Dev.to AI

Originally published by Dev.to AI. Aggregated on AIWithGhost for educational purposes β€” full credit and traffic to the original publisher.