Онлайн-трансляция ACM ICPC: Как это устроено

в 9:28, , рубрики: ACM ICPC, Алгоритмы, Блог компании Университет ИТМО, ненормальное программирование, Программирование, Спортивное программирование, Университет ИТМО

Онлайн-трансляция ACM ICPC: Как это устроено - 1

Про чемпионат

Международная олимпиада ACM ICPC – крупнейшее мероприятие среди командных студенческих соревнований по программированию в мире. Проводится олимпиада с 70-х годов (тогда это было скорее соревнование между университетами США), с конца 90-х в ней активно участвуют и другие страны. Университет ИТМО в 2015 году стал шестикратным победителем ACM ICPC.

Естественно, интерес к олимпиаде проявляют не только сами вузы-участники, но и тысячи людей по всему миру. И для того, чтобы ACM ICPC было не «камерным» мероприятием для участников и их тренеров, существует онлайн-трансляция финала олимпиады, за которой можно наблюдать «в прямом эфире» и по окончании мероприятия (трансляцию финала 2015 года можно посмотреть здесь). О том, как организована трансляция, какие интересные технические решения используются в процессе ее проведения, мы и расскажем сегодня «из первых уст» – от лица ее организаторов.

История трансляций ACM ICPC

В первый раз онлайн-трансляция финала чемпионата мира была представлена в 2009 году в Стокгольме. С 2009 по 2012 год трансляцией занималась команда Центра устойчивых коммуникаций Королевского технологического института (Швеция). Их специализацией был удаленный монтаж видео, однако съемка и передача велась традиционным видео способом: SDI-камеры и видеомонтаж.

Онлайн-трансляция ACM ICPC: Как это устроено - 2

Так выглядела студия в 2011 году

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

Онлайн-трансляция ACM ICPC: Как это устроено - 3

Студия в 2012 году – работа все еще ведется традиционным способом

Поэтому когда за онлайн-трансляцию чемпионата стала отвечать команда Университета ИТМО, было решено перейти от стандартных технологий видеопроизводства к более интересным решениям – стримингу трансляции на Youtube и twitch, использованию мощных компьютеров и VLC/ffmpeg для обработки и монтажа видео (в противовес ранее использовавшимся аппаратным решениям от Blackmagic).

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

Схема устройства трансляции: Этап получения контента

Tехнологии и аппаратное обеспечение

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

Для съемки общих видов зала используются две сетевые PTZ-камеры AXIS V5915. Такая камера позволяет снимать видео в разрешении 1080p и регулируется с помощью веб-интерфейса. Для того, чтобы запитать камеры, установленные в труднодоступных местах, мы используем PoE-инжекторы (это удобный способ подачи электропитания на сетевые устройства: к PoE-инжектору подключается штатный блок питания, сам инжектор подсоединяют к Ethernet-кабелю, после чего со второго переходника можно подключить камеру, при этом питание будет передаваться по Ethernet-кабелю).

Онлайн-трансляция ACM ICPC: Как это устроено - 4

Онлайн-трансляция ACM ICPC: Как это устроено - 5

Кроме перечисленного мы используем четыре портативные видеокамеры, сигнал с которых передается с помощью четырех Teradek Clip, запитанных от аккумуляторов SWIT (на этих аккумуляторах они могут работать в течение всего контеста).

Онлайн-трансляция ACM ICPC: Как это устроено - 6

Онлайн-трансляция ACM ICPC: Как это устроено - 7

На базе одного из Clip’ов мы собрали мобильный комплекс. Он представляет собой рюкзак с аккумуляторами, на одной из лямок которого с помощью липучки прикреплен Clip и GoPro. Его мы планируем надеть на волонтера, который разносит шарики командам.

Онлайн-трансляция ACM ICPC: Как это устроено - 8

Воздушные шарики командам разносят за правильно решенные задачи

ICPC Analytics

Команда аналитиков постоянно развивает свое приложение Katalyzer, которое получает на вход не только лог посылок, но и регулярные бекапы с компьютеров участников. Их анализ позволяет понять, над какой задачей сейчас работает команда (например, если активно изменяется файл a.cpp – наверняка над задачей А). Кроме того, аналитики следят за экранами команд-лидеров, знают, кто в команде на каком языке программирования пишет, и регулярно дают оценку всего происходящего.

Команда

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

Онлайн-трансляция ACM ICPC: Как это устроено - 9

Зал для проведения чемпионата

Команда аналитиков обычно состоит из пятнадцати человек, которые (помимо подготовки и записи разборов) отсматривают интересные события от автоанализатора (AutoAnalyst – приложение, разработанное специально для чемпионата ACM ICPC, отслеживающее список посылок, бэкапы компьютеров и экраны участников) и добавляют в лог событий интересные новости вручную. Кроме того, аналитики заранее готовят для каждой команды и для каждого участника профайл, который мы показываем при представлении команды.

Онлайн-трансляция ACM ICPC: Как это устроено - 10

Команда Пекинского университета. Кадр с трансляции чемпионата

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

Дополнительно: ролики медиаслужбы и видеоразборы

В онлайн-трансляции мы используем заранее записанные видео. Они включают в себя ролики медиаслужбы ICPCNews (эти видео далее доступны на их youtube-канале), интервью ключевых людей, фаворитов чемпионата и спонсоров. Большинство этих видео записывают заранее.

С видеоразборами задач дело обстоит иначе. Условия задач – объект повышенной секретности, поэтому запись видеоразборов начинается одновременно с началом соревнования, когда все команды уже надежно изолированы от окружающего мира на площадке. Аналитики готовят, записывают и вместе с ICPCNews монтируют разборы и передают их в эфир, режиссер принимает решение о том, когда поставить их в эфир.

Этап обработки контента

Tехнологии и аппаратное обеспечение

Наш видеопоток можно разбить на две совершенно разные части: картинку с камер и инфографику, которая накладывается сверху с помощью стандартного хромакея. Начнём с самого простого, а именно с камер. Для управления потоком информации с них самым простым и разумным решением для нас оказалось внешнее программное обеспечение Wirecast.

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

Вся инфографика для проекта также создается in-house, силами команды. В качестве языка программирования был выбран Java. При этом самое простое решение в плане создания инфографики оказалось одновременно и самым элегантным – вся графика отрисовывается на canvas; виджеты перерисовываются каждые 1/25 секунды. Что касается небольших видеоблоков в углу экрана, то для их создания мы обошлись vlcj-библиотекой, которая является оболочкой на Java для нативного вызова функций vlc-плеера.

Основная сложность при работе с видеопотоком заключается не в создании той или иной его составляющей, а в управлении ими. В прошлом году управление велось через стандартные Java-формы, которые сообщали инфографике информацию по tcp. В этом же году мы пошли дальше и написали специальный http-сервер, который поддерживает изменения от нескольких пользователей одновременно и отдаёт всю информацию (что и как показывать) по tcp компьютеру, рисующему инфографику.

Онлайн-трансляция ACM ICPC: Как это устроено - 11

Как это выглядит: видео плюс инфографика

Изучив имеющиеся фреймворки для написания http-серверов на Java, мы выбрали Vaadin. Возможно, это решение не было оптимальным, так как в процессе работы с фреймворком периодически возникали проблемы с потоками и сетью. Однако в итоге нам удалось их решить и получить распределённую систему, которая позволяет кому угодно (при наличии логина и пароля) влиять на выходную картинку.

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

  • Потоковое видео по сети грузится не моментально, поэтому нам пришлось выставить от 3 до 10 секунд ожидания до показа зрителю.
  • Инфографику в виде оверлея оказалось не так просто передать с достаточным числом кадров в секунду по причине нашего желания транслировать картинку в Full-HD. Поэтому для его передачи в Wirecast мы использовали не софтверное, а хардварное (при этом достаточно дорогостоящее) решение, которое просто забирает с монитора картинку по HDMI. Для домашних решений мы рекомендуем избавиться от анимаций появления оверлеев, генерировать их в меньшем разрешении и использовать для захвата видео vlc.
  • Wirecast чрезвычайно требователен к ресурсам, а процесс кодирования видео для отправки на Wowza «ест» немало оперативки, поэтому его мы вынесли на еще один компьютер через аналогичный девайс.

Режим Split Screen

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

  • Команда могла попасть на экран примерно на 10 секунд (это и есть та самая реакция после получения результата), если сдавала задачу.
  • Когда отсутствовали посылки, на экране демонстрировались веб-камеры первых 12 команд по кругу, приблизительно по 20 секунд каждая. Эти 12 команд были отобраны в начале чемпионата как наиболее интересные.

В течение первого часа контеста стало ясно, что данный алгоритм совершенно не отвечает требованиям аудитории: большинство интересовалось не первыми 12 командами, при этом всем было намного интереснее смотреть на код, а не наблюдать за работой команд по веб-камере. Поэтому мы решили переключить Split Screen на ручной режим: мы сами отсматривали комментарии на youtube, twitch и twitter, и выбирали, какие же команды показывать.

Поэтому в нынешнем году именно это направление подверглось наибольшим изменениям. Во-первых, теперь зритель всегда видит два видеопотока – один с экрана и другой с веб-камеры; в большинстве случаев «большое» видео будет содержать код.

Во-вторых, в этом году мы тестируем автоматическую «голосовалку» за команды, которая будет работать по следующему алгоритму: она отслеживает в twitter сообщения с #ICPC2016, «выдёргивает» первый хештег, соответствующий команде на сайте myicpc и увеличивает количество голосов за выбранную команду на единицу.

Онлайн-трансляция ACM ICPC: Как это устроено - 12

Команда Университета ИТМО-2016: Адам Бардашевич, Антон Ковшаров, Андрей Станкевич (тренер) и Владимир Смыкалов

Когда количество голосов у команды достигает 5, она добавляется в очередь на показ (команда никогда не добавляется в очередь дважды, и если команда в очереди, то количество голосов за неё не увеличивается). Чтобы снизить автоматическое набивание голосов, мы планируем учитывать только по одному твиту от пользователя в минуту. В-третьих, помимо пользовательской автоматики, мы всё равно планируем показывать в какие-то моменты первые 12 команд.

Этап вывода контента в сеть

Поскольку нам нужно было обеспечить трансляцию не только в интернет, но и во внутреннюю сеть на соревновании (из полутора тысяч участников олимпиады соревнуются только 384, остальные – тренеры, гости, организаторы – следят за соревнованием), мы решили использовать в качестве посредника сервер на Wowza, на который приходил видеопоток из Wirecast, передававшийся затем клиентам. Помимо прочего, это решило проблему с записью видео на диск и позволило без особых сложностей собрать комментаторскую студию.

Комментаторских студий в этом году планируется две: одна для англоязычных комментариев, другая для русскоязычных. При этом в рамках эксперимента мы решили собрать их с помощью разного оборудования: для «английской» студии мы закупили хорошие гарнитуры и аудиопульт, а «русскую» студию сделаем из самых дешевых подручных материалов. Главный смысл эксперимента в том, чтобы проверить, что действительно важно для обеспечения качественной трансляции, а что – нет. В дальнейшем мы планируем сделать больше локализованных комментаторских студий.

Для Wowza-сервера и двух основных стримов (главного стрима с Wirecast и второго со Split Screen) мы используем заряженные «под завязку» MSI GE 62 Apache pro. К каждому из них мы щедро добавили usb 3.0 и HDMI-сплиттеры.

С точки зрения софта, обе студии будут работать одинаково: на них будет запущен ffmpeg, который забирает видеопоток из Wowza, добавляет звук с микрофонов и передает полученный видеопоток с комментариями обратно в Wowza. Например, ниже приведена строка, которая добавляет к готовому стриму аудиокомментарии:

ffmpeg -re -i "rtmp://%ip%:1935/icpclive/main" -f dshow -i audio="Microphone" -filter_complex "[0:a][1:a]amerge,pan=stereo:c0<c0+2*c2:c1<c1+2*c3[out]" -map 0:v -map "[out]" -vcodec copy -acodec aac -ab 100000 -ac 2 -f flv rtmp://%ip%:1935/icpclive/comments/rus

Что пришлось изменить

В 2015 году, когда наша команда разработки ICPCLive первый раз делала онлайн-трансляцию, работа с мобильными камерами и окончательный монтаж был реализован руками подрядчиков. Оказалось, что всего один дополнительный узел между режиссером и монтажом видео существенно ухудшает качество канала. Для управления звуком в 2015 использовалось приложение на iMac – как выяснилось, нажимать мышью для выбора канала звука оказалось неудобно и слишком медленно, поэтому в этом году мы используем аудиопульты.

Изначально в качестве HDMI2WiFi-трансмиттеров мы использовали не Teradek Clip, а их «аккумуляторных братьев» Teradek Vidiu, но столкнулись с интересной особенностью. При стриминге видео в локальной сети можно использовать один из множества различных протоколов передачи данных. Компьютер, используя, например, команду ffmpeg может «поднять» на себе http-стрим, который будет доступен компьютерам локальной сети.

Однако достаточно сложно «запихнуть» в размер портативного передатчика возможности хостинга стрима, поэтому передатчики часто ограничиваются поддержкой протокола RTMP, который предназначен для передачи стрима на рестример.

В качестве рестримера отлично умеет выступать используемая нами Wowza, однако оказалось, что передача RTMP-потока через Wowza создает задержку в примерно десять секунд, на которую мы не готовы были пойти, а кроме того, два таких потока нагружают компьютер-монстр с Wowza-сервером до 70% CPU, что не оставляло такому варианту никаких шансов на выживание.

ICPCLive и новый формат трансляций

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

Использование Wi-Fi и компьютеров для всей цепочки трансляции делает ее ультрапортативной – мы можем заглянуть с камерой туда, куда не дотягивались провода, автоматически показывать самое интересное по ходу соревнования, по хештегам в твиттере демонстрировать экраны и вебкамеры интересных зрителям команд и делать специальные трансляции для разных языков.

Код нашего замечательного проекта лежит здесь.

Есть вопросы? Хотите помочь? Пишите нам на icpc-live-team@googlegroups.com!

Утром 19 мая подключайтесь к прямой трансляции финала студенческого командного чемпионата по программированию ACM ICPC 2016 на сайте ICPCLive, подписывайтесь на каналы на youtube и twitch (английская трансляция здесь, русская – здесь, второй экран – здесь) – обещаем спонтанные включения и самые интересные подробности.

И, разумеется, болеем за Университет ИТМО!

Автор: Университет ИТМО

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js