Background Images & Animation! DIY TWITCH CHAT tutorial! OBS Do-It-Yourself #obs #twitch #twitchchat

Channel:
Subscribers:
967
Published on ● Video Link: https://www.youtube.com/watch?v=cHYtKJyLms4



Category:
Tutorial
Duration: 13:29
4,094 views
188


Create your own (very) styleable Twitch chat overlay for OBS! I know Streamlabs and StreamElements exist but you'll have TOTAL control over the appearance of your chat overlay! You'll also get to learn some CSS on the way!

This is a follow-up to a previous tutorial. If you are not aware of what jChat is or especially if you don't know CSS yet, I highly suggest you check out that video here: https://youtu.be/K3Fix4MhA0U

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

== ⚠ ADDITIONAL NOTES ==
If you're using jChat, I suggest not enabling "Fade" so that you can test freely for as long as you need without the chat messages disappearing. Feel free to join my Discord if you want to discuss this or if you have questions!

Also, my brain died trying to think of a thumbnail for this video so here's cat-ear Shirou for you.

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

== 🙏THANK YOU ==
jChat by giambaJ - https://giambaj.it/twitch/jchat
OBS - https://obsproject.com

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

== 📃SECTIONS ==
00:00 - Intro
00:27 - Preps for editing
02:20 - Adding background images
03:32 - Designing the chat line
04:06 - Separating the user name and the message
05:36 - Animation
08:17 - Customizing animation
11:54 - Applying to OBS
12:30 - Bonus shenanigans!

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

== 📺JOIN ME ON ==
Twitch: https://twitch.tv/honganqi
Discord: https://discord.gg/G5rEU7bK5j

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

== 🙏SUPPORT ==
If you want to send some support, visit https://buymeacoffee.com/honganqi

#obs #twitch #twitchchat







Tags:
twitch
twitch chat
obs
stream overlay
chat overlay obs
do it yourself
diy
css
tutorial
content creation
content creation ideas