4/22/2023 0 Comments Add overlay to obs![]() ![]() On the flip side, it also means that you can't read any files from your hard drive, including JavaScript files, so you'll need to place all of your JavaScript inside the HTML file itself. If you put everything into a standalone HTML file and load Phaser from a CDN, you won't need a web server running anywhere. There are three ways you can set up your webpage: Single HTML file If you want a more visual game engine that can still export to HTML, consider Godot, which I made a great course on! Setting up your webpage Phaser itself can be loaded as a single JavaScript file. It's also specifically intended for WebGL games, which means you can just save your JavaScript file as you're working and click "refresh cache of current page" in OBS to see your changes (as opposed to having to export a build from your game engine). I prefer to use Phaser since it's relatively easy to learn. Name the new overlay, and browse your computer to where you downloaded the files. Download the files attached, add a new source (media source for MP4/animated or image for PNG/static source). streamlabs OBS, OBS, Stream Elements etc. However, this is where game engines really shine since they're built to handle graphics, animations, and even sounds! As long as the game engine can export to HTML, then you can use it to make overlays. Simply open up your streaming content of choice i.e. If you wanted something basic enough, you could write a simple HTML file with CSS animations. That means that you "only" have to make a webpage with your overlay's contents. OBS has a built-in "Browser" source that lets you show the contents of a webpage:įrom there, you type in a file path or URL, and OBS will render whatever you would see if you had pointed your actual browser at the same page: ![]() I use OBS, so I'll talk about its specifics here, but software like XSplit also supports this method. With my streaming software, I only would have been able to render static text on the stream. For example, I made a custom overlay that reads a file from my system, fades in a marquee with that text every so often, then fades it out when enough time has elapsed. However, it may not allow for event-based triggers or animations. ![]() Regarding the dynamic aspect-your streaming software can already render text and graphics. Advertising your social-media platforms.Commands of interest like !game or !help.This post is for people who want a custom, dynamic overlay and know how to program.Īs for why you'd want an overlay in the first place, here are common uses:
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |