Are you a streamer, and do you use Owncast? Then we have something special for you!
We made an emoji wall (also known as a "on-screen emotes overlay") which takes the emojis and custom emotes sent in the chat and displays them bubbling up the screen!
If you're interested, great! We made this emoji token just for you: ๐โโ๏ธ๐ฆ๐๐คฆ๐๐๐ฆ๐งโโ๏ธ๐๏ธ๐ You will use it to set up your own emoji wall below!
It's easy! You only need to configure a browser source in OBS Studio, and a webhook in Owncast.
Keep reading for step-by-step instructions. You can also check out ๐บ a two minutes video tutorial or read ๐ the FAQ. If you need help, reach out on the Fediverse at ๐ฆฃ @lefractal@mstdn.social or send en email to ๐ง support@smol.stream.
Fill in the URL of your Owncast server below, including "http://" or "https://" and any custom port: Why do we need this?
https://smol.stream/emojiwall/๐โโ๏ธ๐ฆ๐๐คฆ๐๐๐ฆ๐งโโ๏ธ๐๏ธ๐//
https://smol.stream/emojiwall/๐โโ๏ธ๐ฆ๐๐คฆ๐๐๐ฆ๐งโโ๏ธ๐๏ธ๐//
It's done! All emojis and custom emotes sent in your Owncast chat should now show up in your OBS Studio and
on your stream!
If you need any help, reach out on the Fediverse at @lefractal@mstdn.social or send en email to support@smol.stream.
From their website: "Owncast is a free and open source live video and web chat server for use with existing popular broadcasting software."
Why would you use it?
Owncast does not send the absolute address of custom emotes (e.g. "https://foo.com/path/emote.gif"), but only the relative address (e.g. "/path/emote.gif").
Thus, we need to know where your instance resides in order to display these images.
Yes, we are. But we discard each message as soon as we have extracted the emojis from it, and don't use it for anything else.
You don't! The web interface is only a handy tool you can use to generate the URL you need to setup the webhook and browser source. You can generate the URL yourself:
https://smol.stream/emojiwall/
+ a secret token + /
+ Your Owncast instance's URL in base64 encoding.
The secret token can be any string you chose. You should keep it a secret because anyone knowing it can send emojis to your emoji wall!
Yes, you can POST emojis directly to the emoji wall following this example:
curl -X POST --header "Content-Type: application/json" --data '{"eventData":{"body":"๐๐"}}' $EMOJIWALL_URL
Probably. However we have not tested it with anything else than OBS Studio! If your software can embed web content, you should be good to go.
Of course! The emoji wall is free software and can be found in our git repository. You can find detailed instructions about self-hosting the emoji wall in Ruffy's excellent blog post.
There are a few things you can customize such as the size and speed of the emojis, by adding parameters to the URL you use to setup the browser source in OBS Studio. The following parameters are supported:
minsize
: The minimum size of the emojis in pixels.maxsize
: The maximum size of the emojis in pixels.mintime
: The minimum time the emojis take to cross the screen, in seconds.maxtime
: The maximum time the emojis take to cross the screen, in seconds.maxcount
: The maximum number of emojis to display at the same time.effect-rotation
: Set to 1
to make emojis slightly rotate as they travel up the screen. Depending on your configuration and the number of emojis, this can be ressource intensive โbut it looks great!Example:
https://smol.stream/emojiwall/๐ฅ๐ฅณ๐พโค๏ธ/aGV5IQ==/?minsize=20&maxsize=40&mintime=5&maxtime=10&effect-rotation=1
You can also add custom css in the properties of the OBS browser source.
All emojis elements have the .emoji_item
class. Unicode emojis are span.emoji_item
, while custom emotes are img.emoji_item
.
The smol.stream emoji wall is free libre software brought to you with ๐ฅฐโค๏ธ by Hejo, ruffy and Le fractal. Special thanks to Tasartir, cptbichez, Morado and the Owncast development team! ๐