How to Design Sub Badges + Emotes for Twitch [CC]

How to Design Sub Badges + Emotes for Twitch [CC]

Hey DreamChasers, it’s Jacey! And today I’m gonna talk about how to design
a sub badge for Twitch. So last year I did a video about how to design
emotes for, and recently I did a follow up to that video to answer frequently asked questions. But one of the most commonly asked questions
I get is “how do you design sub badges?” Sub badges are similar to emotes so a lot
of the same things will apply, but they are a little bit different. Namely that they’re much smaller which makes
them harder to design. If you don’t know what sub badges are, they’re
the little icons that appear next to subscribers in Twitch chat. They used to only be available for partnered
streamers, but recently Twitch has made them available to affiliates as well. Depending on how long someone has been subscribed
the badge will change. So there’s 1 month, 3 months, 6 months,
they recently added a 9 month icon, and 1 year. And when you’re a partner you can unlock
2 years, 3 years, etc. So I’m gonna cover how to design sub badges
in this video, but if you’re not sure you’re up to the task or you’re not that artistic,
you can hire an artist to design them for you. I sometimes take commissions—but they’re
not always open. So if you’re thinking of hiring me, please
do me a favor and check my Twitter or Twitch page to see if they’re currently open and
shoot me a message. If they’re not open, or you want to hire
someone else, you can check out Fiverr. Fiverr recently opened up a Twitch store where
you can hire artists to design your emotes, sub badges, panels graphics, overlay graphics
or anything you need for Twitch. So if you want to find someone who can do
all of that stuff for you check the link in the description.. Full disclosure, this video is not sponsored,
but I do get money if you sign up through that link. Anyway, if you DO want to give it a shot yourself,
here are my tips on how to design a sub badge. So he biggest difference between sub badges
and emotes is the size. Just like emotes you need to upload 3 files
sizes for sub badges. The sizes are 72×72 pixels, 36×36 and 18×18. That’s tiny. I recommend when you’re designing your sub
badges to start at 200×200 and then shrink it down. That way you have enough room to draw everything
and get all your detail in there. But you’re not working at such a large size
that you end up putting way more detail than you need. And my first piece of advice is to keep it
simple. I wouldn’t get very complicated with these. If you’re drawing a mascot or a character
I would try to pick a very straight on pose for the head. Don’t try to include a lot of details like
shoulders and body. Just a face looking straight on or maybe looking
a little to the side. Keep it very simple. Don’t go crazy with expressions because
that small it’s very to get that to read. Just like emotes, I would think of sub badges
more as a design, than an illustration. You want to get the IDEA of something across. It’s an icon. It’s not gonna be a full finished drawing. And a lot of times less is more. To that point, I think that pixel art works
really well as a sub badge because pixel art is designed to be very small and still be
recognizable as whatever object it is. The creative streamer Spookydraws has a really
cute pixel mug emote that illustrates this point really well. Of course there are exceptions to this. JayelDraco, another creative streamer on twitch
has really detailed sub badges. The first one that you get for just being
a subscriber for one month is a dragon egg. Which has a lot of detail in the scales and
then hatches over time and becomes a full dragon. So after a year of being a sub you have a
full dragon portrait. These sub badges are VERY detailed, but I
think the reason they work so well is because the colors and shapes are very recognizable. It’s clear that you’re looking at a dragon,
even if you can’t see every single little detail. And I think because Jayel has a lot of design
and illustration experience that’s why he was able to pull this off. Your linework is really important in a sub
badge. So like I mentioned in the emote video, I
prefer colored linework for emotes and sub badges. The reason is when you shrink down any graphic
to really small, all the pixels kid of merge together. And it’s not as clean and clear as when
you designed it at a larger size. And so a lot of the time when you use black
linework it just becomes this muddy mess and it’s really hard to tell what all the different
shapes and parts of your drawings are. If you use colored linework that is similar
to the color your using to coloring everything in, but maybe a little bit darker, I think
that usually reads a lot better. Using colored linework helps you separate
everything so you can tell what’s going on. Color and value are really important when
designing a sub badge. I would recommend keeping your color palette
limited to just a few colors. Because if you get it really full of color
and it’s elaborate, it’s gonna be kinda hard to read and it’s gonna be muddy when
you shrink it down. I would also recommend that you make sure
you have a decent use of contrast in your work. If you shrink it down and you can’t tell
what everything is, chances are your colors are too close together and your VALUES are
too close together. Meaning your lights and your darks. If you’re finding that a mouth on a character
is blending in with the rest of the face, maybe try making the dark a little bit darker
than the skin on the face. Stuff like that will really make your emotes
and sub badges pop. Some people like to do text for their sub
badges. But personally I think it’s very difficult
to pull off and have it read well. If you have a logo or something that’s 1
or 2 letters, you might be able to pull of text. But anything bigger than that kinda doesn’t
work. You can’t really read it. So I kinda would stay away from that. If you have a logo you might want to use that
as your sub badge. But just keep in mind that not every logo
is gonna shrink down and look really good or read well. So it’s gonna depend on what your logo looks
like. One of my favorite examples of a logo as asub
badge is by the creative stream stevieraedrawn. Stevie has a very simple outline of a bull’s
head and it’s a single color with a gradient and some highlights. And it changes color at each level of subscription
It’s instantly recognizable and looks really professional. Ideally if you’re going to use a logo, it
should be something simple and bold like what Stevie has. But Stevie’s emotes don’t just work because
they’re simple. A big part of why they work is because they
have such a strong silhouette. A more detailed logo could still work. Case in point, KaelMcDonald’s sub badges
are a lot more detailed, but they still read really well. The reason for that is they have very strong
shapes that read well. The 1 month bad is basically a circle with
a big V in the center and the other details are there but those shapes read pretty well
even at this size. And Kael’s 1 year design also has a lot
of small details and lines, but the overall shape of a coyote head make it really strong
and it’s easy to tell what it is just by glancing at it. And lastly, I think one of the things people
struggle with with sub badges is coming up with a concept. And I would say don’t over think it too
much. Just have fun with it. There’s really no right or wrong answer
for a sub badge concept. Do you like coffee? Make a coffee sub badge. Do you have a pet? Make your pet your stream mascot and just
use them as a sub badge. Some streamers just use their face in different
colors. There’s really no wrong answer here. Just have fun with the concept and make it
your own. And then finally if you want to test your
sub badge design there’s a website that I recommend that makes it really easy to test
emotes and badges. I use the Twitch contrast tool at The top box is for uploading emotes, but there’s
a smaller box underneath is and that’s for testing sub badges. The site makes it really easy to see what
your sub badges will look like in chat in either dark or light mode. Ewwww. Who’s using light mode? Anyway that’s my advice for designing Twitch
sub badges. I hope it was helpful. If you’re interested in learning how to
design emotes I made a few videos about that in the past. There’s links in the description. I also have a link to that contrast tool where
you can test your emotes. And a link to Fiverr if you want to hire someone
to design an emote for you. Anyway, that’s it for me. Until next time, chase your dreams! Peace!

21 thoughts on “How to Design Sub Badges + Emotes for Twitch [CC]

  1. Thanks for watching! Looking to hire someone to design your sub badges and emotes? Check out the Twitch Store on Fiverr (Affiliate link):

    Also, here's the contrast tool site I mentioned for emote testing:

  2. Awesome info! Though I appreciate you featuring me as a 'good' example (thank you <3), I often think I should do simpler sub badges, so this'll be handy when I get some time to revamp things! Do you find that there's a good method to balancing between users of Dark mode vs Light mode? I pretty much just design for Dark mode, but I understand some folx prefer Light and I imagine my badges look nearly invisible that way.

  3. I like when you mentioned a pet and the dog just looked up like "so why you no use me". I appreciate the information and thank you so much for it!. been learning design on my own and thought designing sub badges and stuff for twitch would be fun but the concept part is tough.

  4. THX SO MUCH. I saw that in the size 28×28 it looked so blurry but this page has confirmed to me that it will still be sharp in twitch chat.

  5. i always fail at adding text to it, short words like "oof" "rip". they are unreadable because they are way to blurry at 56×56 already

  6. hello! i just stubled upon your channel and i really like how u explain things! I have a question about emotes that arent "cartoon-ish". how do i create them to show up well in chat?

  7. THIS VIDEO DOES NOT GET ENOUGH HYPE. FINALLY someone is giving me the details that I need to know in creating all of this. Keep up the remarkable work, dude! I really hope you are rewarded 😀

  8. I wanted to try and become an emoji artist but How do artists live off such small income?? ie fiver 😥😥😥 Art takes time #feelsbadman

  9. Can anyone help? So I start off with 600 x 600 pixels and every time I save for web at the various twitch emote sizes, they are blurry. Any suggestions for what I should do? thanks!

Leave a Reply

Your email address will not be published. Required fields are marked *