Also available for Rivals of Aether and Rushdown Revolt!
So you're interested in doing SSBMelee streams, huh? Luckily for you, with this tool you'll be able to update all the variables you need for the provided overlays with the provided GUI, and easily customize the overlays to make them your own!
Any doubts? Join the Discord Server!
- Handy interface to quickly change everything you need, like player names, characters, scores, round, casters...
- Easy and fast setup using a browser source. Drag and drop!
- A game overlay is included, with renders for all characters and skins!
- A VS Screen is also included, to be used in pauses between games.
- Easy to customize! Made in html/javascript, every file can be edited at will!
These are instructions for regular OBS Studio, but I imagine you can do the same with other streaming software:
- Get the latest release.
- Extract somewhere.
- Drag and drop
Game Scoreboard.htmlinto OBS, or add a new browser source in OBS pointing at the local file. - If the source looks weird, manually set the source's properties to 1920 width and 1080 height, or set your OBS canvas resolution to 1080p, or make the source fit the screen.
- In the source's properties, change Use custom frame rate ->
60(if streaming at 60fps of course). - Also tick
Refresh browser when scene becomes active. - Manage it all with the
Melee STexecutable.
Repeat from the 3rd step to add the VS Screen.html, though I recommend you to do so on another scene.
- Press
Enterto update. - Press either
F1orF2to increase P1's or P2's score. - Press
ESCto clear player info.
2 basic transitions are included in the Resources/OBS Transitions folder, if you don't have a transition yourself of course. To use them on OBS:
- Add a new stinger transition.
- Set the video file to
Game In.webmorSwoosh.webm. - Transition point ->
350 ms. - I recommend you to set the Audio Fade Style to crossfade, just in case.
- On the scene's right click menu, set it to Transition Override to the transition you just created.
The interface will also update basic text files with the match info at Resources/Texts/Simple Texts/ so you can add them to OBS with ease.
If you drop an image in Resources/Team Logos/ and write the name of the image to the tag of a player, the image will appear on the game overlay.
For the overlays/images, there are PSD files for both the game scoreboard and the VS screen to help you customize them.
For the video backgrounds, you can either replace them with other .webm files or just cover them with an image overlay.
And if you're brave enough to dive into the code, I tried my best to document everything inside the code so you have an easier time, so go grab those html and js files!
If you want to customize the GUI, thats going to be a bit complicated since you will have to learn how electron works yourself. In any case, the source code is also on this github!
And most importantly, this project was created using RoA-Stream-Tool as a base, so if you wanna go crazy on customizations, I really recomend you to check out that first, since it's way more documented (and also has a wiki!), especially if you wanna adapt this to other games. This Melee version is way more locked down.
Do you want to adapt this project to another game but can't figure out how to? I would be happy to help! Contact me on Mastodon or on the project's Discord Server!
Do you want to support this project? Buy me a ko-fi or tip me directly!
This is one of my first projects in Javascript, if you know your stuff and look at the code, you may find ways to make the thing a bit more optimized (because right now... it isn't), and I would be happy to hear how to! Please, use this github to leave suggestions on how to imporve things.
Resources: The spriters resource, the Melee HD Asset Library, and the VS poses.