{"id":22809013,"url":"https://github.com/ccuffs/live-broadcast-kit","last_synced_at":"2025-04-22T13:25:22.412Z","repository":{"id":58056718,"uuid":"295251277","full_name":"ccuffs/live-broadcast-kit","owner":"ccuffs","description":"Easily and effortlessly create overlays and video content right in your browser.","archived":false,"fork":false,"pushed_at":"2022-01-10T22:38:08.000Z","size":5107,"stargazers_count":32,"open_issues_count":1,"forks_count":7,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-29T15:34:31.981Z","etag":null,"topics":["broadcast","broadcasting","obs","openbroadcaster","openbroadcastersoftware","overlays","uffs","universidade-federal","university","youtube"],"latest_commit_sha":null,"homepage":"https://livebk.app.uffs.cc","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ccuffs.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE-OF-CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-09-13T22:47:54.000Z","updated_at":"2025-01-10T19:34:27.000Z","dependencies_parsed_at":"2022-08-28T23:12:28.797Z","dependency_job_id":null,"html_url":"https://github.com/ccuffs/live-broadcast-kit","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":"ccuffs/template-english","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ccuffs%2Flive-broadcast-kit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ccuffs%2Flive-broadcast-kit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ccuffs%2Flive-broadcast-kit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ccuffs%2Flive-broadcast-kit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ccuffs","download_url":"https://codeload.github.com/ccuffs/live-broadcast-kit/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250247211,"owners_count":21399030,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["broadcast","broadcasting","obs","openbroadcaster","openbroadcastersoftware","overlays","uffs","universidade-federal","university","youtube"],"created_at":"2024-12-12T11:13:14.823Z","updated_at":"2025-04-22T13:25:22.370Z","avatar_url":"https://github.com/ccuffs.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n    \u003cimg width=\"800\" src=\".github/logo.png\" title=\"Project logo\"\u003e\u003cbr /\u003e\n    \u003cimg src=\"https://img.shields.io/maintenance/yes/2022?style=for-the-badge\" title=\"Project status\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/workflow/status/ccuffs/live-broadcast-kit/ci.uffs.cc?label=Build\u0026logo=github\u0026logoColor=white\u0026style=for-the-badge\" title=\"Build status\"\u003e\n\u003c/p\u003e\n\n# About\n\n**Live Broadcast Kit** (LBK) is a web app to easily and effortlessly create overlays for video content. It has been originally designed to work in conjunction with [OBS](https://obsproject.com) to add and control overlays on live feeds, however it can be used as a standalone app as well.\n\n\u003e **NOTICE:** the app can be used directly in your browser at [livebk.app.uffs.cc](https://livebk.app.uffs.cc). If you want to see it in action (results), check out [this YouTube video](https://youtu.be/ZgWojT5qlpc).\n\nLBK has been developed to help with broadcast and video content creation within the [Computer Science program](https://cc.uffs.edu.br) at [Federal University of Fronteira Sul](https://www.uffs.edu.br), Chapecó, Brazil.\n\n## Features\n\nYou can use LBK to create different types of content, not only overlays. For instance, use it to create intros/outros for YouTube, social media clips, etc. Out of the box, it contains the following features:\n\n* Web app (no instalations, runs directly in the browser);\n* Create and control how items are displayed;\n* Wide variety of ready-to-use overlays and effects;\n\n![Main screen](.github/images/lbk_screen01.png)\n\u003cimg width=\"400\" src=\".github/images/lbk-bottom-left.gif\" title=\"Overlay at bottom left corner.\" align=\"left\"\u003e\n\u003cimg width=\"400\" src=\".github/images/lbk-top-corner.gif\" title=\"Overlay at the upper right corner.\"\u003e\n\n## Getting started\n\nThe following sections explain how to use LBK in different ways.\n\n### Use as a web page (standalone)\n\nThe fastest and easiest way of using LBK is accessing [livebk.app.uffs.cc](https://livebk.app.uffs.cc). It will work in your browser without any instalation or dependencies. Use the control panel to create content, e.g. overlays or clips for your videos, then record it and add to your video project.\n\n### Use with OBS\n\nWhen using [OBS](https://obsproject.com), for live broadcasting or recording, add a [Browser Source](https://obsproject.com/wiki/Sources-Guide#browsersource). Set the URL of your browser source as [https://livebk.app.uffs.cc](https://livebk.app.uffs.cc). Then, use your browser window/tab with LBK to control the content displayed on OBS (within the browser source).\n\n### Use with Streamlabs OBS\n\nWhen using [Streamlabs OBS](https://streamlabs.com), for live broadcasting or recording, add a [Browser Source Interaction](https://blog.streamlabs.com/introducing-browser-source-interaction-for-streamlabs-obs-d8fc4dcbb1fb). Set the URL of your browser source as [https://livebk.app.uffs.cc](https://livebk.app.uffs.cc). Then, interact with LBK right within the Streamlabs OBS screen.\n\n## Development\n\nThis section is intended for contributors who plan on adding features, documentation, fixing bugs, etc. If you just want to use LBK, check the previous section or head to [https://livebk.app.uffs.cc](https://livebk.app.uffs.cc).\n\n### 1. Prerequisites\n\nBefore you begin, ensure you have a machine with git, node and npm. Then clone this repo:\n\n```\ngit clone https://github.com/ccuffs/live-broadcast-kit\n```\n\nEnter the project folder:\n\n```\ncd live-broadcast-kit\n```\n\nLBK already comes with all the JS libs it needs for basic operations, so node and npm are not totally required. \n\nYou only need a web server or a way of servering LBK as a web page. Node and npm might help though.\n\n### 2. Installing dependencies\n\nInstall all JS libs using npm (if you plan on working on features that depend on them):\n\n```\nnpm install\n```\n\nIf you intent to work on feature that have no external dependencies (basic operation features, for instance), you don't need `npm install`.\n\n### 3. Running the app\n\nIf you are using node/npm, at the root of the project folder, run:\n\n```\nnpm serve\n```\n\nPoint your browser to the provided link and start tinkering.\n\n## Contribute\n\nYour help is most welcome regardless of form! Check out the [CONTRIBUTING.md](CONTRIBUTING.md) file for all ways you can contribute to the project. For example, [suggest a new feature](https://github.com/ccuffs/live-broadcast-kit/issues/new?assignees=\u0026labels=\u0026template=feature_request.md\u0026title=), [report a problem/bug](https://github.com/ccuffs/live-broadcast-kit/issues/new?assignees=\u0026labels=bug\u0026template=bug_report.md\u0026title=), [submit a pull request](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/about-pull-requests), or simply use the project and comment your experience. You are encourage to participate as much as possible, but stay tuned to the [code of conduct](CODE_OF_CONDUCT.md) before making any interaction with other community members.\n\nSee the [ROADMAP.md](ROADMAP.md) file for an idea of how the project should evolve.\n\n## License\n\nThis project is licensed under the [MIT](https://choosealicense.com/licenses/mit/) open-source license and is available for free.\n\n## Changelog\n\nSee all changes to this project in the [CHANGELOG.md](CHANGELOG.md) file.\n\n## Similar projects\n\nBelow is a list of interesting links and similar projects:\n\n* [Open Broadcaster Software (OBS)](https://obsproject.com)\n* [Streamlabs OBS](https://streamlabs.com)\n* [Pixabay](https://pixabay.com/videos)\n* [Coverr](https://coverr.co)\n* [Green Screen Brasil](https://www.youtube.com/channel/UCk90quCzMYSp36ZfWeov3Dg)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fccuffs%2Flive-broadcast-kit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fccuffs%2Flive-broadcast-kit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fccuffs%2Flive-broadcast-kit/lists"}