Интерактивная игра в реальном времени
Мультиплеерная игра в чате Twitch на Canvas API и WebSocket. Зрители взаимодействуют со стримом через команды, OAuth-авторизация, система инвентаря.
Задача
Я стримлю разработку на Twitch и хотел больше интерактива со зрителями. Не просто чат, а чтобы зрители могли делать что-то на экране. Идея - игра через команды в чате: "!join" и твой персонаж появляется, "!chop" - рубит дерево. Нужна синхронизация в реальном времени и сохранение прогресса между стримами.
Решение
Рендеринг на Canvas API с game loop через requestAnimationFrame - стабильные 60 FPS. WebSocket-сервер на Node.js подключается к Twitch IRC и парсит команды. Сервер валидирует команду, обновляет состояние и бродкастит изменения всем клиентам через WebSocket. Авторизация через Twitch OAuth, инвентарь и трофеи сохраняются в базе между сессиями. Для мобильных зрителей сделал Telegram Mini App с тач-управлением.
Результат
Проект набрал 24 звезды на GitHub. На стримах зрители активно играют через чат - вовлечение заметно выше чем просто просмотр. Telegram Mini App дал мобильным зрителям возможность играть не открывая Twitch.
Похожие кейсы
Нужно решить похожую задачу?