Development of a cloud-based interactive overlay TikTok
Platform: TikTok LIVE
Stack: Node.js, Socket.io, TikTok Live Connector, HTML/CSS/JS, OBS Studio, Render.com
Task
Create a cloud solution for live streaming that:
Works from any device (phone, tablet, laptop) without the need to install additional software.
Automatically counts the total bank (BANK) based on viewer gifts.
Conducts voting "Judges 0-1-2" (only for subscribers).
Converts gifts into points on a scale of "2" during the performance.
Has a "Fan Battle" mode (3 minutes, two participants).
The host can manage the entire process through a separate admin panel from anywhere in the world.
Solution
A cloud web application has been developed, hosted on Render.com, which:
Connects to TikTok LIVE and analyzes chat and gifts in real-time (without the need for OBS to collect data).
Displays 3 voting scales (0 / 1 / 2), which are updated instantly via WebSocket.
Automatically adds points for gifts to the scale of "2" (formula: 1 coin = +10 points).
Maintains a total BANK that increases with each gift (user coefficient).
Allows launching a "Fan Battle" with a 3-minute timer.
The admin panel (controller) is accessible via a browser on any gadget — phone, tablet, PC.
Each module is separated into its own browser file for flexible configuration in OBS and managing visibility from the remote.
Feature: The chat and gift parser does not require OBS Studio to operate. OBS is only used for the final overlay output on the screen (as a browser source).
Result
#prototyping Cloud hosting — access 24/7 from any device, without software installation.
The bank updates in real-time with animation upon change.
Subscriber voting increases instantly without delays.
Gifts automatically affect the scale of "2," creating dynamics.
The Fan Battle is activated with one button.
The admin panel is accessible from anywhere — the host manages the broadcast even from a phone.
The client was satisfied — the overlay fully automated judging and donation motivation.
Main overlay screen (3 scales, timer, participant name)
Admin panel (controller) with all buttons
BANK block (close-up)
Fan Battle mode (3 minutes, two teams)
Queue of performances for viewers (optional)
Technologies
#prototyping Node.js · Socket.io · TikTok Live Connector · HTML/CSS/JS · Render.com (Cloud) · OBS Studio
Stack: Node.js, Socket.io, TikTok Live Connector, HTML/CSS/JS, OBS Studio, Render.com
Task
Create a cloud solution for live streaming that:
Works from any device (phone, tablet, laptop) without the need to install additional software.
Automatically counts the total bank (BANK) based on viewer gifts.
Conducts voting "Judges 0-1-2" (only for subscribers).
Converts gifts into points on a scale of "2" during the performance.
Has a "Fan Battle" mode (3 minutes, two participants).
The host can manage the entire process through a separate admin panel from anywhere in the world.
Solution
A cloud web application has been developed, hosted on Render.com, which:
Connects to TikTok LIVE and analyzes chat and gifts in real-time (without the need for OBS to collect data).
Displays 3 voting scales (0 / 1 / 2), which are updated instantly via WebSocket.
Automatically adds points for gifts to the scale of "2" (formula: 1 coin = +10 points).
Maintains a total BANK that increases with each gift (user coefficient).
Allows launching a "Fan Battle" with a 3-minute timer.
The admin panel (controller) is accessible via a browser on any gadget — phone, tablet, PC.
Each module is separated into its own browser file for flexible configuration in OBS and managing visibility from the remote.
Feature: The chat and gift parser does not require OBS Studio to operate. OBS is only used for the final overlay output on the screen (as a browser source).
Result
#prototyping Cloud hosting — access 24/7 from any device, without software installation.
The bank updates in real-time with animation upon change.
Subscriber voting increases instantly without delays.
Gifts automatically affect the scale of "2," creating dynamics.
The Fan Battle is activated with one button.
The admin panel is accessible from anywhere — the host manages the broadcast even from a phone.
The client was satisfied — the overlay fully automated judging and donation motivation.
Main overlay screen (3 scales, timer, participant name)
Admin panel (controller) with all buttons
BANK block (close-up)
Fan Battle mode (3 minutes, two teams)
Queue of performances for viewers (optional)
Technologies
#prototyping Node.js · Socket.io · TikTok Live Connector · HTML/CSS/JS · Render.com (Cloud) · OBS Studio