Chat Designer for Twitch​

...lets you create a custom overlay chat for your Twitch channel. It provides the following features and many more:
  • Multistream support
    Add multiple Twitch channels to the same overlay chat. (But don’t forget to get the thumbs up from the channel owners first!)

  • Filter out channels and messages
    It is possible to filter out specific channels and messages containing particular content. (Tip: Filter out bots and !commands for a clearer chat experience!)

  • Use the Twitch user color
    Whenever a color can be set, you can consider using the color that the user prefers on Twitch.

  • Animate new and hiding messages
    Create animations for appearing and disappearing messages.

  • Separate design for Subs, VIPs and Mods
    Change the appearance of the messages based on the role the user uses on Twitch.

  • The best of CSS without coding
    This tool provides a simple and rich UI, so you can easily create an overlay chat that differs from every other one.

Important:​

Chromium-based browser:
To use this tool, you have to use a Chromium-based browser (New Microsoft Edge / Google Chrome / New Opera). Because the browser source in OBS is Chromium-based, other browsers like Firefox and Safari may have problems displaying the tool and the chat proberly and are not supported. (If you should see some problems in the tool, try updating your browser and OBS)

Enable Javascript:
If you should see a message that Javascript is disabled in your browser, you have to activate it. (Go to the browser settings, search for JavaScript and enable it. Try to reload the page)

PLEASE FOLLOW THE HOWTO.TXT FILE TO PREVENT PROBLEMS


"How to design" video:

If you want a head start to know how to start designing your chat, you can check out this YouTube-Video here.

Disclaimer:​

This tool is not created or provided by Twitch or Amazon.
UI, icons and coding are done by me, Mirco Schilling.

Examples:​

1.png
2.png
3.png
4.png
5.png
6.png
7.png
8.png

Support:​

This tool took me many approaches and the final approach took me about a few weeks. Nevertheless this tool is completely free to use :D However, if you want to support me financially, you can support me here ❤️ I still have many ideas for Chat Designer and am going to update it in the future. Stay tuned :D
  • Like
Reactions: DistantImpulse
Author
MiiRiiCo
Downloads
15,943
Views
51,437
First release
Last update
Rating
4.33 star(s) 6 ratings

Latest updates

  1. What's next?

    What's next to come? Tooltips to make it clearer what each feature does. Option to change the...
  2. 2.8.1 - Bug fixes

    2.8.1 - Bug fixes BUG FIXES: Fixed an issue where the sizing options for backgrounds and masks...

Latest reviews

Amazing tool in concept, extremely helpful and solves many problems for graphic designers.

Unfortunately, in practice it's way too unreliable for use in commissioned designs. Randomly breaks, and sending out individual updates to my clients is way too much of a hassle and not realistic.
MiiRiiCo
MiiRiiCo
Thank you for your review! After a somewhat longer break from the project, I am now actively continuing it again.

Because I tried a new approach with version 3 (using the TwitchAPI that requires authentication) the tool had several issues with authentication since it's stored locally on your device. As a consequence, I have now removed version 3 and uploaded the stable version 2 again, on which I will add more new features in the future.
I loved it, if there was something like this for event lists and goals that would be amazing too ♡
MiiRiiCo
MiiRiiCo
Thank you for your feedback Actually I am currently working on a feature for the next version, that the Chat Designer shows messages of new subs (and later bits too).

As soon as I fully understand how the responses from the Twitch API are built for each different event, an activity feed designer shouldn't be that difficult. But for that I still need some time
i love u why i was searching something like this so easy
Very nice script for setting up chats, writing everything by hand would take me much more than using this. The only few culprits I noticed are:
- Most buttons that are just icons have no tooltip or description of what they are supposed to do, so it's just trial and error.
- Animations in-out for messages don't seem to work outside of the designer. In it I see that the messages fade in (but do not fade out despite the entry in the Designer), outside they just pop in and out.
Excellent, highly customisable tool that's easy to use.
Top