TL;DR
Компания JUG Ru Group несколько лет успешно проводила офлайн-конференции для программистов, но с началом ковида, как и остальные, перенесла ивенты в онлайн. Было принято решение развивать собственный продукт, не зацикливаясь на готовых решениях типа Zoom.
По ходу работы над порталом онлайн-конференций команда собрала продуктовые боли, главной из которых была низкая активность и проходимость живых дискуссий со спикерами и другими участниками.
В итоге мы пересмотрели то, как должна выглядеть конференция в онлайне, придумав «Разрывное расписание» — ряд юиксовых решений, которые отвечали принципу Discussion first. Благодаря этому, мы приобрели здоровый онлайновый нетворкинг с дискуссионными комнатами с большим количеством участников, которые могут продолжаться и два, и три часа.
Метрики влияния (в проекции двух сезонов)
Среднее время дискуссий выросло с 17 до 58 минут.
Среднее количество человек в дискуссиях выросло с 10,4 до 32,8.
Количество дискуссий с нулевым числом участников «обнулилось».
Благодаря пересмотру пользовательского опыта «залетели» спонсорские интеграции. Тематические дискуссии от компаний спонсоров собирали в среднем 34 прогретых разработчика, держали аудиторию и рассказывали свой контент в среднем 64 минуты.
Посмотреть и пощупать
Если лень читать, то смотрите запись техтолка о UX онлайн-конференций. Там больше мемов и текст немного другой, но про то же самое.
И обязательно пощелкайте актуальный UI в прототипе фигмы в айфрейме. Разверните на полный экран, чтобы было удобнее.
Контекст
JUG Ru Group организует крупные конференции для программистов и сочувствующих в IT. В портфеле компании крупнейшие конференции для Java-разработчиков (Joker и JPoint), фронтендеров (HolyJS), тестировщиков (Heisenbug), мобильных разработчиков (Mobius) и еще десяток других ивентов, проводящихся офлайн преимущественно в Москве и Петербурге. До ковида главным продуктом были конференции с присутствием спикеров и участников непосредственно на площадке, а главной ценностью для участника, помимо образовательной, — возможность лично пообщаться с известными спикерами со всего мира и потусить с другими участниками комьюнити. Онлайн-трансляция, несмотря на серьезные инвестиции (например, картинка в 4K), была лишь добавочным предложением в offline-first продукте без каких-либо ценных фичей, кроме стрима докладов из зала.
В 2020 году правила игры изменились, и ивент-рынок ушел в онлайн. Если грубо обобщать, события в онлайне стали проводить на трех площадках:
  • Zoom, когда есть возможность простого интерактива между участниками;
  • Youtube, когда организаторы освоили OBS;
  • Spatial Chat (позднее), когда нужен вау-эффект с перемещением аватара по виртуальным комнатам.
Небольшой дисклеймер
Далее я буду рассматривать только про доставку видео до клиента со стороны его опыта, исключая производство эфира, кодирование, трансмиттинг и прочие интересности онлайн-продукта. Об этом опыте можно почитать на Хабре (здесь и здесь).
Муки онлайн-трансформации
Офлайн забанен, билеты оплачены, нужно отгружать какой-то продукт онлайн. А отгружать где?
Преимуществом каждого из готовых решений можно назвать простоту реализации, для которой чаще всего достаточно посмотреть пару видео, где семиклассник объясняет, как настроить OBS для стрима Minecraft. Но все это имело ряд важных для серьезного бизнеса недостатков:
  • Ограниченность в кастомизации доступов для разных категорий пользователей. Продукт деградирует до уровня «есть билет / нет билета» (все или ничего).
  • Проблемы с безопасностью. Это может быть как вредительство бомберов в Zoom, так и безбилетный просмотр видео, который не отследить.
  • Отсутствие или бедность статистики. Готовые продукты предоставляют только агрегированные и анонимизированные метрики по количеству участников, среднему времени просмотра, демографии и прочему. Если хочешь узнать, что/сколько/когда посмотрел конкретный пользователь или сегмент пользователей, то это невозможно.
  • Нельзя интегрировать во внутренние ресурсы. Простой пример. Принятие доклада в программу — это целый бизнес-процесс, одним из результатов которого является страница с описанием доклада и биографией спикера, проверенная редактором и переведенная на английский. Если используешь Youtube для эфира этого доклада, будь добр, руками скопируй все это в описание под видео, добавь туда ссылку на страницу с сайта, а на сайт прикрепи ссылку на ютубовский плеер.
  • Это не продать. Конференции в онлайне нужно рассматривать как продукт, который помимо внутренних потребностей может быть интересен и внешним заказчикам. Предложение формата «Мы круто сделаем вам онлайн-конференцию и митап. Но в зуме ¯\_(ツ)_/¯» — отстой уровня предложения интернет-магазина на тильде.
  • Репутация. Если ты продаешь билеты на онлайн-конференции за 15000 рублей, то показывать доклады в зуме просто несолидно.
В связи со всем этим, а главное в связи с наличием в штате небольшой, но очень сильной команды разработчиков, началась разработка собственного сервиса для онлайн-конференций.
Live v1. Проблемы первого решения
Первый портал онлайн-конференций был построен по принципу телика. Как каналы в телевизоре, у пользователя на портале несколько треков с докладами, которые идут один за другим. Трек можно было выбрать из расписания, между треками переключаться прямо в плеере, а контекст (название текущего доклада, его описание и пр.) обновлялся в реальном времени по вебсокетам. Плеер был с открытым таймлайном, то есть можно было отматываться назад, ставить на паузу, догонять прямой эфир с двойной скоростью. Под плеером была большая желтая кнопка перехода в дискуссию. Это комната в Zoom, в которой пользователи могли пообщаться со спикером после завершения доклада.
Звучит довольно удобно, но по итогу получаем ряд проблем. Главная из которых чисто продуктовая — в дискуссиях мало людей. Это больно по двум причинам:
  • Пользователи просят нетворкинг «как в офлайне», но не приходят общаться голосом со спикерами.
  • Дискуссионные комнаты с нулем или единицами участников демотивируют спикеров приходить в будущем с докладами, потому что главным ценностным предложением для них всегда была аудитория.
Получаем странную картину, когда пользователи получают, но не пользуются, а спикеры пользуются, но не получают. Обе стороны уходят разочарованными, приглашать их на будущие ивенты становится сложнее.
Когда мы говорим об онлайн-ивентах, нужно четко понимать: удерживать участника у экрана, двигать его по разным активностям значительно сложнее, нежели в рамках конгресс-зала на конференции IRL. Требования к менеджменту программы и пользовательскому опыту возрастают, а паттерны из живых конференций можно забыть.
По понятным причинам, у нас (и у других организаторов) не было никакого опыта, поэтому набивали шишки в продакшене. Дискуссия начиналась сразу по завершении доклада в Zoom. Флоу перехода в дискуссию был оригинальным и завязан не только на интерфейсе сайта, но и на непосредственно содержании эфира. В конце доклада ведущий говорил буквально следующее: «У вас под плеером большая желтая кнопка Zoom, нажимайте и переходите в дискуссию». Если пользователь отвлекся и не услышал, он уже не вспомнит ни о какой дискуссии и возможности пообщаться со спикером и участниками голосом, потому что сразу за докладом в этом же плеере начнется другой. Интерфейс никак не мотивирует пользователя совершить действие для открытия Zoom, а программа подкидывает какой-то еще контент, который не требует вообще никаких действий.
Решить проблему можно было по-разному, мы же решили поступить основательно и предложили совершенно новый пользовательский опыт для онлайн-конференций.
Live 2.0
Для нового интерфейса мы определили идеи, которые, согласно гипотезе, повысят визибилити дискуссий, приведут в них пользователей и сделают спикеров немного счастливее:
  • Забываем про треки и табличный вид расписания. Теперь это витрина из активностей, при проваливании в которые вместе с описанием открывается плеер с записью или прямым эфиром только этой активности;
  • Пользователь переключается не между треками с бесконечным потоком докладов, а между непосредственно докладами из каталога-расписания;
  • Дискуссия после доклада из некого придатка становится непосредственной частью программы;
  • После завершения доклада у пользователя появляется искусственный барьер, который ставит перед пользователем вопрос: уйти в дискуссию или выбрать другую активность из каталога.
Разрывная сетка расписания
Итак, центром внимания становится сетка расписания. Необходимо предложить такое решение, которое было бы достаточно гибким для конференции с любым объемом программы и привычным для пользователе с разным уровнем насмотренности. В качестве референсов мы смотрим прежде всего на онлайн-кинотеатры, продуктовые каталоги и даже на маркетплейсы. Каждая активность (доклад) в программе должна стать неким продуктом-предложением в общем каталоге. Когда пользователь видит актуальный статус всего, что идет прямо сейчас, активности конкурируют между собой. Но конкуренция по задумке не совсем честная: доклады можно будет сразу по завершении посмотреть в записи, а дискуссии принципиально не записываются. Таким образом мы поднимаем ценность живых дискуссий. Согласно нашей гипотезе, пользователь из витрины идущих прямо сейчас активностей, выберет ту, в которой он сможет поучаствовать только здесь и сейчас.
У каждой активности есть своя карточка, которая в режиме реального времени буквально живет своей жизнью и в разные моменты жизненного цикла приобретает актуальное состояние. Она покажет, какая часть активности идет именно сейчас: основная часть (например, доклад или воркшоп) после завершения перейдет в состояние дискуссии. Прогресс-бар визуально подскажет, как сильно пользователь опоздал к началу, а специальный бейдж обратит внимание на то, что дискуссия не записывается.
Карточки активности в разных статусах
Для просмотра расписания есть два представления:
  • «Сегодня». Отображаются только карточки активностей текущего дня. Три группы активностей, по которым карточки перемещаются в реальном времени: идет сейчас, скоро начнется и завершено. Карточки идущих прямо сейчас активностей сортируются и поднимаются в начало списка при изменении статуса. Например, когда завершился доклад и началась дискуссия, то карточка с этой активностью сразу поднимется в начало.
  • «Расписание». Можно выбрать между группировкой по дням или темам. Если по дням, то каждый день программы отображается в отдельной вкладке.
Когда пользователь кликает по карточке, открывается модальное окно с динамичным верхним блоком и статичным контентом внизу. В статику входит весь контекст активности: полное описание, биографии спикеров, экспертов и ведущих, набор тегов, иконок сложности и прочая информация. Динамический блок приобретает разные состояния в разные моменты жизненного цикла активности, а также условий авторизованности пользователя и наличия у него билета.
  • До начала активности пользователь видит таймер;
  • Во время активности включается плеер;
  • По окончании открывается экран завершенной активности с возможностью сразу перейти к записи, поставить оценку и оставить отзыв, а также перейти в дискуссию для живого общения;
  • В случае отсутствия билета, неавторизованности пользователя, прочих технических проблем вместо плеера отрисуется соответствующий empty state.
Нужно отметить, что все динамические изменения на странице происходят реактивно без рефреша. После открытия модального окна от пользователя не требуется обновлять страницу в ожидании появления видео с прямым эфиром.
По итогу приходим к такому userflow:
  • Расписание помимо информационного приобретает и функциональное значение. Теперь это хаб конференции, в который пользователь возвращается для переключения между активностями.
  • Благодаря динамическим статусам карточек, прогресс-барам и сортировки в реальном времени, расписание становится дашбордом, где пользователю легко ориентироваться и делать выбор в пользу интерактивных активностей, где можно вживую общаться со спикерами и другими участниками, а доклады и воркшопы оставить для просмотра в записи.
  • Все дискуссии не записываются, а поэтому повышается их ценность в сравнении с докладами и воркшопами, которые можно посмотреть в записи в любой момент.
  • После завершения доклада или воркшопа нет автоматического перехода к другим активностям. Пользователь видит экран с предложением поставить оценку, оставить отзыв и CTA для перехода в дискуссию. Таким образом, мы решаем проблему отставшего от прямого эфира или пропустившего концовку доклада пользователя. Когда бы пользователь ни вернулся к экрану, он увидит первую опцию «Подключиться к дискуссии»», и если у него есть мотивация и время послушать и поучаствовать в обсуждении, он обязательно нажмет на CTA.
Все описанные изменения мы назвали разрывным расписанием, отказавшись от понятия треков и единых длинных потоков.
Что получили
Какие метрики важны для оценки конференций в онлайне, а главное — как их интерпретировать — большой вопрос. Для себя мы определили, что нужно стремиться к некой «залипаемости», то есть длительному непрерывному пребыванию пользователя с контентом онлайн-конференции. И разнообразие контента от академических докладов до холиварных дискуссий способствует этому «залипанию». И важно доставить все это так, чтобы пользователь воспользовался.
Однако, первая версия портала подарила пустые и короткие по продолжительности дискуссионки. То есть буквально не было редкостью, когда в дискуссионных комнатах было 0 людей. Пользователи не доходили до дискуссий, скучали и уходили.
После всех изменений мы получили следующее:
  • Дискуссионки наполнились людьми. Осенью 2021 года, например, на конференции HolyJS не было ни одной дискуссии, в которую не пришли бы участники. Для сравнения, сезоном ранее таких дискуссионок было 7.
  • Средняя длина дискуссии на той же конференции составила 58 минут. То есть помимо формального присутствия, пользователи еще и активно общались со спикерами и между собой, делая нетворкинг по-настоящему живым.
  • Одной из опций для спонсорского пакета были Тематические дискуссии, которые организовывали наши клиенты после покупки партнерства. Для дискуссий определяли тему, модераторов, и это были полноценные активности внутри программы. К нашему удивлению они взлетели и получили отличный фидбек от клиентов. На той же HolyJS на такие активности приходило в среднем 34 человека, и длились они в среднем 64 минуты.
  • Негативным эффектом стал непривычный пользовательский опыт. Пользователи тяжело привыкали к представлению расписания в формате, отличном от таблицы или диаграммы Ганта. Мы получили много негативного фидбека после первого сезона с новым представлением, но не отказались от идеи, а только дорабатывали UI для закрытия дырок в удобстве пользователя. В итоге пришли к текущему UI, который в статье на скринах и прототипе.
  • Сейчас можно говорить о том, что пользователи привыкли, а наш опыт и наработки уже переиспользуют другие организаторы.
Юрий Кочергин
Product Designer
This site was made on Tilda — a website builder that helps to create a website without any code
Create a website