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

a2b5fd84dc5040fca4e371ac31904ba8.png

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


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

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

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


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

b19db2a652b146df845e04fa5f0829c3.png

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

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

23f55ae8ae70410b9ce6490e519a707a.png

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

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

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

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


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

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

5859a80d603f411e995e812c4bb8ce87.png

c65064eeba58445b9c61f87d84b6e9a7.png

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

ef052e097af24d76a0bd2773e9599a03.png

2f995e2ebcee4fb78defee02cd2d2030.png

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

d311b54241e24cff8a940065a0c4eaa7.jpg

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

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

0b4f4157b9544f61ad1b63502347eae5.png

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

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

6327676b9a6d434eb73ccfa8237fbc69.png

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

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

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

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

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


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

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

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

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

a2b5fd84dc5040fca4e371ac31904ba8.png

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

Изучив имеющиеся фреймворки для написания 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 и увеличивает количество голосов за выбранную команду на единицу.

667b2dc21da84ec1b09eec0e5ca51983.jpg

Команда Университета ИТМО-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

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


В 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 (английская трансляция здесь, русская — здесь, второй экран — здесь) — обещаем спонтанные включения и самые интересные подробности.

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

© Habrahabr.ru