Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов

Привет, я Алексей, дизайнер интерфейсов. В этой статье расскажу как можно улучшить сервис продаж билетов в Эрмитаже.

Кейс сделал по своей инициативе, когда сам столкнулся с неудобством. Это не заказ Эрмитажа или его подрядчиков, не тестовое задание куда-либо.

Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов

Метрики. Зачем продавать билеты онлайн

Продажа онлайн-билетов имеет ряд преимуществ как для музея, так и для посетителя. Среди них:

Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов

Сейчас билетная система не идеальна. Чего можно достичь, улучшив её:

— Увеличить процент покупки онлайн-билетов, что приведет к:

  • Возможности собирать данные посетителей. Уже сейчас, при покупке билета онлайн, музей предлагает подписаться на e-mail-рассылку. Это означает, что музей сможет понимать, насколько часто человек посещает музей повторно, какие музейные комплексы Эрмитажа он посещает. Музей сможет напоминать о себе письмами, тем самым увеличив шанс повторных посещений и их частоту
  • Экономии на фонде оплаты труда кассиров
  • Сделает музей более современным и, следовательно, более востребованным среди молодежи, что увеличит посещаемость этой группы населения
  • Экономии на принтерах, краске и бумаге
  • Экономии на инкассации

Уменьшить количество возвратов билетов (причины неправильного выбора билетов будут описаны ниже).

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

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

Оценка пути посетителя

Оценку пути решил проводить через CJM задав одну персону. Одну, чтобы не распыляться и не пытаться предугадать все возможные варианты (это все таки не заказ и у меня нет возможности пообщаться с Эрмитажем и выяснить все детали).

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

Проблемы, с которыми столкнулся Михаил при покупке билетов:

  • При переходе на сайт с билетами посетителю предлагается слишком много вариантов (минимум 15, максимум 21 вариант), при этом варианты дублируют друг друга. Это усложняет выбор билета, повышает вероятность ошибки и возврата билета.
  • На сайте представлены разные типы билетов в один и тот же музейный комплекс, причем с разными фотографиями. Фотографии не помогают в выборе билета, а только добавляют сложностей. Это также усложняет выбор билета, создает визуальный шум и повышает вероятность ошибки и возврата билета.
  • Посетитель может выбрать льготные билеты сразу на первой странице, но льготные опции также представлены и на последующих страницах. Выбирая на главной обычный билет, пользователь все равно видит льготы, даже когда они ему не нужны. Это создает визуальный шум и навязчивые лишние опции.
  • В форме для пользователя приходится дважды вводить почту, и скопированное значение туда вставить нельзя. Такие сложности в формах уменьшают вероятность их заполнения, вызывают раздражение и непонимание у посетителей, что в итоге снижает количество пользователей, дошедших до оплаты.
  • Неочевидные предвыбранные опции повышают вероятность ошибки посетителя, что влечет за собой раздражение, увеличение вероятности возврата билета и снижение числа пользователей, дошедших до оплаты.

Дополнительно выявленные сложности при UX анализе:

  • Форма не проверяет введенные данные. Вместо телефона можно ввести текст, и сайт не выдаст ошибку, пропустив дальше.
  • Форма расположена ниже, и её появление не подсвечивается для посетителя после выбора билета. Посетитель может не заметить её и решить, что сайт не работает.
  • Кнопка для оплаты картой выглядит неактивной, а выбранный способ оплаты имеет маленький контраст к фону. Логотипы систем оплаты большие, занимают много места, расположены хаотично и беспорядочно.
Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов
  • Сайт предлагает 21 вариант билетов, которые очень похожи друг на друга. В каждом отличается всего несколько слов, при этом на каждой карточке содержится большой объем текста. Посетителю приходится напрягаться, чтобы найти отличия.
Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов
Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов
  • На карточках поверх фотографий размещены тэги на полупрозрачных плашках. В приведенном примере коэффициент контрастности текста к фону составляет 3,61:1. Это значение слишком низкое для такого маленького текста. Кроме того, контрастность зависит от фона из-за полупрозрачности, что делает ее неконтролируемой.
Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов
  • Вверху вперемешку расположены разные типы фильтров: по музейным комплексам, льготам и категориям посетителей.
Как улучшить опыт посетителя Эрмитажа: UX анализ и редизайн сервиса онлайн покупки билетов

Новый дизайн с учетом выявленных проблем

С помощью CJM я выявил ряд проблем. По сути все они сводятся к тому, что интерфейс запутан и неочевиден. Я постарался упросить его. При этом UI я затронул минимально.

Начал с того, что я существенно изменил (и упростил) логику выбора билетов. На первом экране оставил всего 5 вариантов. Теперь посетитель в первую очередь выбирает музейный комплекс, который он хочет посетить. Фотографии на карточках стали информативными, теперь на них здание музейного комплекса, а не части экспозиции. Уменьшив количество опций, посетителю будет легче сделать свой выбор.

Шаг 1. Выбор музейного комплекса
Шаг 1. Выбор музейного комплекса

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

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

Шаг 2. Выбор категории билетов
Шаг 2. Выбор категории билетов
Шаг 3. выбор даты и времени. Есть билет без привязки к дате. В текущей версии сайта он представлен отдельной карточкой под каждый музейный комплекс.
Шаг 3. выбор даты и времени. Есть билет без привязки к дате. В текущей версии сайта он представлен отдельной карточкой под каждый музейный комплекс.
Шаг 4. Ввод данных
Шаг 4. Ввод данных

Выбор способа оплаты стал более очевидным. Я убрал низкоконтрастные кнопки и внес порядок в форму.

Шаг 5. Оплата
Шаг 5. Оплата

Над чем еще можно поработать для улучшения опыта посетителя

Разумеется еще есть над чем работать. Например:

  • Сократить и переписать текст, прилагаемый к билету (текущий объем — страница формата A4, полностью заполненная текстом)
  • Исследовать опыт других групп посетителей.
  • Разработать выбор вариантов входа в музейный комплекс (требуется дополнительное исследование и консультация с Эрмитажем, поскольку без этого невозможно учесть все нюансы).

Как видите, даже маленькое UX исследование в продукте или сервисе поможет сделать его удобнее для пользователя.

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

Мой telegram, если захотите что-то написать.

2121
1 комментарий

Отличная работа!
Сайт Эрмитажа устарел и морально, и функционально.
От себя в формы выбора билетов я бы добавил кнопку "Назад", тк на этапе оплаты мог вспомнить, что день неудобный, например.

1