Realtime / EventTech / WebSocket

TNT Live Voting

Система онлайн-голосования для зрителей TNT Standup Fest в Зелёном театре на ВДНХ. Зрители голосовали за комиков в реальном времени, а результат через несколько секунд выводился на большой экран с анимацией.

Роль

Realtime System Developer / Solution Architect

Период

2021

1000+

одновременных live-подключений

Секунды

от голоса до экрана

ТНТ

связан с ТВ-программой

01

Контекст

Для мероприятия нужно было сделать интерактивный механизм: после выступления комика зрители в течение короткого времени голосуют «да» или «нет», а результат сразу появляется на большом экране. Система должна была выдержать несколько тысяч live-подключений и работать без критических задержек.

02

Моя роль

TNT Live Voting — это небольшой, но технически интересный realtime-проект. Его сложность была не в интерфейсе, а в нагрузке, скорости реакции и синхронизации с live-сценарием мероприятия. Нужно было собрать голоса тысяч зрителей и почти мгновенно показать результат на экране.

03

Решение

Что было реализовано:

  • realtime-приложение на Node.js
  • WebSocket-соединения, массовое подключение зрителей
  • механика голосования «да / нет»
  • таймер голосования
  • сбор результатов и быстрый вывод итогового числа
  • экранная анимация результата
  • сценарий для использования на live-мероприятии
04

Архитектура

Стек: Node.js, WebSocket, JavaScript, HTML/CSS.

Лёгкий Node.js-сервер с WebSocket-шиной: мобильные клиенты зрителей, агрегатор голосов в памяти, экранный клиент с анимацией результата.

Video walkthrough

Короткий видеоразбор проекта: какую задачу решали, как устроена система, какие модули были реализованы и какой результат получил бизнес.

Видео скоро появится

05

Результаты

  • система использовалась на мероприятии TNT Standup Fest
  • голосование работало в реальном времени
  • результат выводился на большой экран
  • проект был связан с телевизионной программой на ТНТ
06

Что я понял

В realtime-системах главное — простота: чем меньше движущихся частей между голосом зрителя и экраном, тем надёжнее работает система под нагрузкой.

Стек

Node.jsWebSocketJavaScriptHTML/CSS