Найти тему
USABILITYLAB

Вместо тысячи вкладок: как ориентация на пользовательский опыт помогла сэкономить тысячу часов работы сотрудников

Автор: Арина Суслина
менеджер проектов отдела дистанционной работы с клиентами Райффайзенбанка

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

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

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

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

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

Разобраться, как живут пользователи

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

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

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

  1. Встроенная функциональность по блокировке карт. Просьба о блокировке карты требует моментальной реакции – в некоторых случаях счёт может идти буквально на секунды. Но для выполнения этой операции сотрудникам приходилось открывать отдельную программу, а если клиенту было необходимо заблокировать несколько карт – выполнять блокировку каждой карты в отдельности.
  2. Формирование и отправка выписок и реквизитов на e-mail клиента. Справки можно заказывать через Райффайзен-Онлайн, либо позвонив на горячую линию – и это один из самых частых поводов для клиентских обращений. Раньше процесс включал в себя цепочку действий оператора и требовал обращения к другим системам, мы хотели упростить его до нескольких нажатий.
  3. Альтернативная идентификация клиента. Примерно в трети всех звонков клиент не может вспомнить своё кодовое слово, тогда специалист отправляет ему смс с кодом на мобильный номер. Как и в предыдущем случае, раньше этот простой процесс требовал целого ряда шагов.

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

  • полностью переработать дизайн системы, радикально улучшив пользовательский опыт;
  • оптимизировать набор атрибутов карточки клиента: убрать лишние и добавить недостающие, чтобы сократить переходы в другие системы;
  • разработать новую функциональность: блокировку карт, создание выписок и реквизитов, альтернативную идентификацию.


Создание прототипа и предварительные тесты

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

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

Вопреки нашим прогнозам, некоторые элементы интерфейса не получили ожидаемого отклика от пользователей. Благодаря предварительным тестам мы смогли быстро и с минимальными инвестициями определить неудобные интерфейсные решения до начала разработки и оперативно их исправить. Так мы обнаружили, что некоторые элементы, выполненные в определенном цвете, просто не видны в связи с особенностями мониторов специалистов, а изначальная наша идея разместить панель быстрого перехода в другие системы в левой части экрана оказалась неудобной из-за разрешения экранов – мы решили перенести ее в нижнюю часть и добавить функцию сворачивания, на случай если панель перекрывает другие элементы системы.
Андрей Цыбин
UX/UI дизайнер

Стандартные инструменты разработки Siebel имеют ряд ограничений при работе с визуализацией. Для того чтобы реализовать современный интерфейс в корпоративном стиле, требовалось выбрать стороннюю JavaScript-библиотеку, изучить ее работу, а также интегрировать ее в Siebel. Выбор стоял между React.js и Vue.js, одними из самых популярных JavaScript-библиотек. Было реализовано несколько пробных экранов с использованием каждой из библиотек. Выбор пал на React.js, так как в банке уже существовала довольно большая коллекция React-компонентов в корпоративном стиле, и коллеги из сообщества дизайн-системы постоянно занимаются ее улучшением.
Реализация некоторых запланированных фич требовала интеграции различных систем, которыми пользуются в контактном центре. Для этого мы создали ряд интеграционных точек, используя технологии Web Service, JMS MQ и REST.
Максим Ромашкин
ведущий разработчик системы Siebel

Пилот нового решения

Мы были готовы к запуску пилота спустя три месяца с момента старта проекта. На протяжении месяца мы тестировали наше решение на фокусной группе, состоящей из 30 сотрудников, после чего провели среди них опрос. Результаты показали, что 95% респондентов предпочитают работать с новым интерфейсом системы. Они отметили, что интерфейс стал простым в использовании и позволяет консультировать клиентов быстрее. Функции, которые раньше казались сложными и осуществлялись в несколько действий, стали проще и доступнее.

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


Первая фаза проекта: итоги в цифрах

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

  • теперь специалист может заблокировать одну или все карты клиента одновременно с помощью нескольких кликов, не выходя из карточки клиента;
  • процедура формирования и отправки выписок и реквизитов на e-mail клиента упрощена до нескольких нажатий и полностью происходит внутри одной системы;
  • появился механизм автоматической отправки одноразового пароля на номер клиента, если он забыл своё кодовое слово – теперь это происходит в два клика.
-2

В итоге все эти изменения повлияли на самое главное – опыт клиентов при звонке в контактный центр. Ведь простота и доступность информации для оператора – это прежде всего скорость предоставления ответа клиенту.

Вторая фаза: Продолжение следует

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

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

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

8 сентября 2020 в 16:00 присоединяйтесь к вебинару "USABILITYLAB в гостях у Райффайзенбанка"