Перейти к содержанию
Все работы / Собственные продукты

Promptix Stream Tools / от события до экрана

Всё, что за эфиром.
В одном месте.

Кабинет для подключений, донатов, целей, команд чата и OBS-виджетов. Собственный продукт, где красивый интерфейс опирается на работу с реальными событиями.

Как работают инструменты
OBS / ЛИНИЯ ЭФИРАТРИ ВИДЖЕТА · ОДНА СЦЕНА

Шкала доната · время эфира · зрители онлайн

Настоящие шаблоны из каталога Stream Tools с демонстрационными данными. Настройки и свой дизайн — в кабинете.

Задача продукта

Во время стрима
некогда чинить
связи между сервисами.

Сейчас поддерживаются Twitch, YouTube и DonationAlerts; новые платформы и донат-системы — направление развития. Эти сервисы и OBS решают разные задачи. Подготовка эфира требует связать подключения, историю событий, визуальное оформление и взаимодействие с чатом.

Promptix Stream Tools собирает управление в закрытом кабинете. Автор подключает свои платформы, выбирает цель, настраивает виджеты и проверяет отображение тестовым событием. В OBS остаётся вставить защищённый адрес Browser Source.

Публичной регистрации нет: аккаунты создаёт владелец. Это действующий рабочий инструмент с собственными ограничениями доступа, а не обещание будущей универсальной платформы.

Путь события

  1. 01 / ИСТОЧНИК

    Платформа

    OAuth, вебхуки и фоновые подключения принимают события провайдеров.

  2. 02 / ОБРАБОТКА

    Состояние

    События связываются с пользователем, историей и текущим эфиром.

  3. 03 / ПОКАЗ

    Виджет

    OBS получает только нужное представление по индивидуальному адресу.

Самое интересное
происходит между экранами.

События могут повторяться

Webhook и сетевое подключение не гарантируют идеальный порядок. Дедупликация и журнал обработки защищают сценарий от повторного исполнения.

Платные команды требуют точности

Списание баллов связано с записью доставки. Повтор команды не должен списывать стоимость второй раз; при неподтверждённой отправке важны понятный статус и возврат.

Виджет живёт долго

OBS-источник может оставаться открытым весь эфир. Поведение после переподключения, тестовое событие, обновление данных и состояние без новых событий — часть продукта.

Доступ должен оставаться личным

Секреты подключений хранятся зашифрованными. URL виджета можно перевыпустить, а данные кабинета ограничены владельцем аккаунта.

Реальная техническая основа

Laravel + Vue.
Очереди, события
и внимательный UI.

LaravelVue 3InertiaOAuthEventSubOBS
Скриншот редактора виджета Promptix Stream Tools на демонстрационных данных

Проект в деталях

Настоящие экраны локального кабинета Promptix Stream Tools. Аккаунт и данные демонстрационные, подключения к внешним сервисам не используются.

Скриншот приложения · демоданные

Обзор рабочего пространства

История поддержки, активная цель и состояние подключений собраны в кабинете.

Скриншот приложения · демоданные

Каталог виджетов

Фильтры по назначению, источнику и стилю помогают выбрать оформление сцены.

Скриншот приложения · демоданные

Настройки виджета

Размеры, источник данных и действия управления доступны у выбранного виджета.

Скриншот приложения · демоданные

Свой виджет

Редактор разметки и оформления с предпросмотром позволяет создать собственный вариант.

Работа над проектом

За интерфейсом.

Собственный продукт на Laravel и Vue: закрытый кабинет для эфиров, подключений, чата и OBS-виджетов.

Связь с платформой может оборваться

Для YouTube реализованы обновление токена, сохранение позиции чтения чата и резервный REST-опрос. Интервалы учитывают ограничения платформы, а повторные ошибки приводят к паузе и понятному статусу подключения.

Повтор события — отдельный сценарий

Обработка команды связана с записью её доставки и изменением баланса в транзакции. Доставка выполняется отдельно. Это позволяет отслеживать результат и обрабатывать ошибки без смешивания с действиями в интерфейсе.

Развитие работающего инструмента

Базовые подключения, цели и виджеты используются в собственных эфирах. Работа над продуктом продолжается: восстановление связи, обработка ошибок и удобство управления во время трансляции остаются частью разработки.

Ваша задача — следующий проект

Свяжем ваш интерфейс с реальными процессами.

Обсудить разработку

Веб-сервисы, API, события и сложные интеграции — разработаю не только экран, но и систему, которая стоит за ним.

Следующий кейсFlowBoard