С 10:00 до 20:00

8 (800) 302-05-03

Скопировать

info@appfox.ru

Скопировать

Логотип Appfox
Кодим ваши мечты 8 (800) 302-05-03

Обсудить проект

Verb: WebRTC-видеосервис и LMS для онлайн-обучения

Категория: EdTech, видеосервис, LMS
Разработка: WebRTC-конференции на MediaSoup, расписание, доступы, тарифы, личный кабинет и сценарии ошибок.

логотип Verb для образовательного сервиса
личный кабинет Verb с расписанием ученика
экран регистрации в сервисе Verb
карточка начавшегося урока в сервисе Verb
видеоурок Verb с преподавателем и чатом
личный кабинет Verb с расписанием ученика
экран регистрации в сервисе Verb
карточка начавшегося урока в сервисе Verb
видеоурок Verb с преподавателем и чатом

<300 мс

Целевая задержка передачи аудио и видео для живого онлайн-урока без заметной паузы.

25 участников

Конференция рассчитана на индивидуальные и групповые занятия с управлением ролями.

10 000+

Пиковая одновременная аудитория, под которую проектировались media-ноды и доступы.

Обзор проекта

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

Самая сложная часть проекта — не интерфейс календаря, а real-time видеосервис. Мы спроектировали WebRTC-слой на базе MediaSoup по модели SFU: участники отправляют медиапотоки на media-ноды, а сервис маршрутизирует нужные аудио- и видеотреки без лишней нагрузки на клиентские устройства.

Главная идея кейса: это не кабинет со ссылкой на сторонний звонок, а собственный видеосервис для обучения, интегрированный с пользователями, расписанием, доступами и записью уроков.
СущностьEdTech-платформа с LMS-логикой и собственными WebRTC-видеоконференциями.
АудиторияУченики, преподаватели и администраторы, которым нужен стабильный урок без внешних сервисов.
ЦельСобрать подбор, расписание, оплату, доступы и видеокласс в одну отказоустойчивую систему.

Вызов и решение

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

Мы разделили путь на короткие решения. Каждый экран отвечает на один вопрос, а кнопка следующего шага активируется только после заполнения нужных данных. Ошибки регистрации, авторизации, кода подтверждения и восстановления пароля вынесены в отдельные состояния, чтобы продукт был готов не только к идеальному сценарию.

Какие механики сделали

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

WebRTC-видеоклассПолноценный видеострим для индивидуальных и групповых занятий: микрофон, камера, демонстрация экрана, участники, чат и файлы.
MediaSoup и SFUМедиапотоки обрабатываются по модели Selective Forwarding Unit, чтобы групповые уроки масштабировались без перегруза клиентов.
Signaling-серверУстановление WebRTC-соединений, управление комнатами, ролями, доступами и состояниями подключения.
Media-нодыГоризонтальное масштабирование и балансировка нагрузки между media-серверами для пиковых конференций.
ОтказоустойчивостьПереподключение клиентов, перезапуск сессий и восстановление урока при сетевых сбоях.
Запись уроковАвтоматическая запись на стороне сервера без возможности преподавателя отключить ее вручную.
LMS-интеграцияПользователи, расписание, тарифы, доступы и карточки занятий связаны с видеосервисом напрямую.
Календарь уроковСлоты, доступные занятия, добавление урока, смена преподавателя и статусы ранней или поздней отмены.
Тарифы и оплатаПакеты уроков, подарочный доступ к приложению, разные платежные сценарии и ошибки оплаты.

Отзыв

Отзыв

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

Отзыв о работе над проектом Спасибо команде AppFox за то, что вы собрали для Verb собственный видеосервис для занятий. В одном сценарии сошлись расписание, доступы, WebRTC-комната, чат, файлы и запись урока на стороне сервера.

Этапы разработки

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

1

Сценарии

Описали путь ученика и преподавателя: вход, подбор, расписание, оплата, урок, отмена и помощь.

2

Архитектура

Собрали WebRTC-логику на MediaSoup: SFU, signaling, комнаты, роли и права доступа.

3

LMS

Связали расписание, тарифы, пользователей и карточку урока с доступом к видеокомнате.

4

Видеоурок

Проработали микрофон, камеру, демонстрацию экрана, чат, файлы, участников и настройки устройств.

5

Нагрузка

Заложили media-ноды, балансировку, 500+ активных конференций и 50 000+ потоков.

6

Надежность

Добавили reconnect, восстановление сессий, серверную запись и обработку ошибок доступа.

Результаты

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

Видеоурок<300 мс

Целевая задержка аудио и видео для живого занятия.

Конференции500+

Активных уроков одновременно в расчетном сценарии.

Потоки50 000+

Медиапотоков в реальном времени через SFU-слой.

Аудитория10 000+

Одновременных пользователей на пиковую нагрузку.

Комната25

Участников в одной индивидуальной или групповой конференции.

Записьсерверная

Автоматическая запись урока без ручного отключения.

SignalingWebRTC

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

Media-нодыSFU

Горизонтальное масштабирование и балансировка нагрузки между серверами.

LMSединая

Пользователи, расписание, тарифы и доступы работают в одной логике.

Технологии
которые мы используем

Стек подбирается под сервис с собственным медиаслоем: WebRTC-конференции, маршрутизация потоков, LMS-логика, платежи, запись, мониторинг и production-инфраструктура.

  • UX/UIFigma
  • WEBReact
  • TSTypeScript
  • APIC# / .NET
  • RTCWebRTC
  • SFUMediaSoup
  • SIGSignaling
  • AWSInfrastructure
  • QUEUEAsync jobs
  • CICI/CD
  • PAYStripe
  • PAYCloud Payments
  • DATAAnalytics

FAQ

Это сервис или внешний звонок?

Это собственный WebRTC-видеосервис Verb на MediaSoup и SFU-архитектуре. Он встроен в LMS: доступ к комнате зависит от пользователя, расписания, тарифа и статуса урока.

Зачем нужна SFU-архитектура?

В групповых уроках клиенты не пересылают видео друг другу напрямую. Потоки идут через media-ноды, а SFU отдает каждому участнику только нужные аудио- и видеопотоки, что помогает масштабировать конференции.

Что было самым сложным?

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