Кейс: редизайн сервиса Webinar.ru от студии «Ярость»17.03.2016 14:22

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

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

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

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

Структура

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

Простота

Чистый интерфейс получился благодаря тому, что все детали скрыты и по умолчанию стоят универсальные настройки. Новичок попадает в платформу и сразу видит основные функции — он может без промедления создать вебинар и начать работу. Уже на второе или третье использование он раскроет весь потенциал платформы и настроит ее под себя.

Опытный же пользователь найдет все необходимое сразу, потому что мы использовали шаблоны, знакомые всем, кто пользовался Google или Facebook. Чем больше вы взаимодействуете с платформой, тем больше она о вас знает — раз за разом создание вебинара и выполнение других задач становятся быстрее и проще.

Коммуникация

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

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

Инструмент для оформления

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

Знакомство

Хотелось, чтобы участник сразу начал пользоваться платформой, не теряя времени на обучение, поэтому мы сделали онбординг внутри вебинара. Раньше это был просто «вебинар о вебинаре» и список длинных инструкций. Теперь загорающиеся элементы и всплывающие подсказки направляют пользователя, попутно рассказывая о новых возможностях сервиса. Если пользователь случайно сделал не тот шаг, то порядок выполнения задач подстроится под него, и он ничего не упустит.

Показать все

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

Комфорт

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

Управление эфиром

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

Найти выход

Обычно пользователи заканчивали вебинар, просто закрывая вкладку браузера. Но лектору важно видеть статистику по участникам после мероприятия. Поэтому функцию «Завершение вебинара» мы поместили в кнопку «Пауза». На первый взгляд, «Пауза» расположена неудобно, но мы сделали это намеренно, чтобы предотвратить случайный выход из эфира.

Что пришлось исправить

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

Приглашение людей из вебинара

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

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

Добавление файлов в самом вебинаре

Файловый менеджер внутри вебинара изменили по такому же принципу: поп-ап в нашем случае удобнее, чем блок-трансформер или список. Также более четко обозначили область drag and drop, куда можно загружать сразу несколько файлов.

Создание вебинаров

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

Над чем предстоит работать

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

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

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

Эмоциональность, вовлеченность пользователей. Мы хотим оживить наш сервис. В последней итерации мы добавили в чат смайлики, также планируем создать перечень популярных вопросов и возможность «лайкать» контент.

Из всей этой истории мы сделали несколько главных выводов:

• Прототипы лучше показывать пользователям как можно раньше. Давать им судить только по картинкам — пустая трата времени.
• Нет необходимости доводить до конца спор между заказчиком и студией. Истина за пользователем.
• Действовать нужно короткими итерациями. Lean-менеджмент помог бы нам избежать многих переделок — теперь работаем только в таком режиме.

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

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

Улучшенная функциональность и новые интерфейсы уже привлекают новых пользователей. Слушатели стали чаще приходить на наши вебинары: за две недели количество регистраций увеличилось примерно в 2–2,5 раза. При этом на 15% увеличилось количество участников, которые дослушивают вебинар до конца.

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

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

Присылайте свои колонки и интерфейсные кейсы на interface@vc.ru