2020
Интерфейс рабочего места оператора поддержки банка
Заказчик
Альфа-Банк — крупнейший частный банк в России и один из пяти крупнейших по объему активов банков страны.
Наш заказчик — одно из IT-подразделений банка. У него была сложная и почти необъятная задача: улучшить автоматизированное рабочее место службы поддержки банка. Тогда операторы колл-центра и операторы чата будут быстрее обслуживать клиентов.
Для 2019 года это был достаточно громоздкий старый сервис, который никто не обновлял. С появлением новых банковских услуг заказчик добавлял новую функциональность, при этом интерфейс для старых неактуальных услуг оставался на месте и висел мертвым грузом на главном экране. Подразумевалось, что на часть кнопок просто не нужно нажимать.
В этом интерфейсе оператору приходилось искать ответы на вопросы клиента, параллельно разговаривая по телефону
Еще оператор пользовался браузером с несколькими открытыми вкладками, потому что иногда актуальную информацию надо смотреть в интернете. И не забывайте про отдельный софт для чатов и созвонов.
Вместе эти программы создавали массу проблем банку:
- приходилось тратить много времени на обучение оператора — аж целый месяц;
- компьютеры подтормаживали и задерживали оператора, потому что для десяти программ нужно сильное железо;
- оператор тратил много времени, чтобы переключаться между программами.
Казалось бы, всем было понятно, что систему надо менять. Но не все так просто.
Во-первых, она работала. А как известно, трогать работающее иной раз дороже.
Во-вторых, это банк. Любая разработка, касающаяся данных клиентов, — это очень дорого. Даже очень-очень дорого. Поэтому просто так денег никто не дал бы. Нужно было очень убедительно доказать топ-менеджменту, что изменения обоснованны и приведут к счастью.
В-третьих, это снова банк. Со множеством бюрократических сложных процедур. Их гораздо проще пройти и получить бюджет, если заранее запастись убойными аргументами.
Именно за ними к нам и пришел Альфа-Банк. Причем пришел не с пустыми руками — представитель заказчика подготовил небольшой прототип по главным сценариям работы с системой, который мы позже использовали как ценные вводные по пользовательским задачам.
Нам нужно было превратить этот прототип в интерфейс, который бы четко показал: «Мы отрисовали всего несколько основных задач операторов — оцените, насколько уже стало проще работать. Посмотрите на числа, которые мы замерили при тестировании. Видите, что операторы справляются с этими типовыми задачами намного быстрее? Мы можем сделать так по всей системе».
Задача нам очень понравилась. Еще бы! «Собаку Павлову» пригласили выступить катализатором перемен в Альфа-Банке, которые коснутся миллионов его клиентов.
Уровень ответственности зашкаливающий, но соответствует нашему опыту — мы уже устраивали изменения в Сбере и разрабатывали концепцию зарубежного приложения. Так что взялись за дело, весело размахивая хвостом.
Процесс
Исследование
Мы традиционно начали с аналитики. Чтобы понять, как упростить работу операторов колл-центра, нужно с ними поговорить. Заказчик предоставил четырех специалистов. Двое из них общаются с клиентами банка по телефону, еще двое консультируют в чате. Один новичок и три опытных сотрудника.
Во время интервью мы шли по гайду, но при необходимости отклонялись, чтобы уточнить подробнее важные детали. Например, просили оператора объяснить по скриншотам, как он работает в интерфейсах существующих программ, что ему удобно и чего не хватает. Здесь нам сильно помогли прототипы заказчика — можно было сравнить его версию со старой и спросить, стало ли удобнее и почему. Так мы лучше понимали, в какую сторону двигаться.
Аналитика показали, что даже опытные специалисты не знают софт идеально. К примеру, не все могли рассказать, что изображают иконки. Это объяснимо: львиная доля обращений касается кредитов и других популярных продуктов, и все связанные с ними интерфейсы операторы знают идеально. А остальная часть софта нужна в редких случаях либо вообще относится к уже неактуальным услугам.
На основе исследования подготовили сценарий, над которым будем работать.
История линейная и не очень сложная
Также из разговоров с операторами мы узнали, что им не нужно идентифицировать клиентов. Все происходит автоматически. Когда оператор принимает звонок или отвечает в чате, данные о клиенте уже выведены на экран основной программы.
А от заказчика мы узнали, что банк использует нейросети, которые способны понимать вопросы и отвечать на них. Но пока это не голосовой помощник, который умеет общаться с человеком. Скорее, ассистент службы поддержки — может определить смысл вопроса и перенаправить клиента оператору из нужного отдела.
Концептуальное проектирование
Мы начали с бумажных скетчей, чтобы быстрее определиться с формой. Подготовили четыре концепта.
В концепте «Браузер» расположили на главном экране самые частые запросы и теги. По клику на запрос оператор попадает сразу на страницу, поделенную на три части. В верхней левой части находится ответ на запрос клиента, в правой верхней — ответы, которые тоже могут относиться к запросу.
Часто бывает так, что клиенты банка неверно указывают причины звонка. Иногда случайно, а иногда — специально. Логика у них такая: все «кредитные» операторы заняты, поэтому быстро попаду в менее загруженный отдел, а оттуда переведут в нужный. Для таких ситуаций мы разместили на главной странице кнопку «Перевод».
Концепты на бумаге позволяют не привязываться к контролам и сразу работать над смыслом
В концепте «Гугл» оператор использует умный поиск, который при вводе символов сразу предлагает выбрать конкретный запрос, а на следующей странице показывает подходящие результаты и вопросы, которые тоже могут относиться к теме.
Хоть сценарий и большой, его можно реализовать в два-три экрана
В концепте «Робот» система сама распознает вопрос клиента и мгновенно выводит ответ на экран. Оператору остается только озвучить его. Ниже вопроса — другие вопросы по той же теме и поиск.
В этом концепте оператору достаточно принять звонок и прочитать ответ с экрана
Самый консервативный концепт — CRM. В нем мы предложили просто сделать редизайн старой главной страницы.
Классическое решение для похожих систем
Проработка макетов
Мы обсудили с заказчиком концепты и решили, что самый прогрессивный и перспективный вариант — «Браузер».
Главный экран системы состоит из карточек категорий, внутри которых — ссылки на самые популярные запросы. При этом первая карточка — динамическая. Ею управляет робот, который распознает вопрос клиента и сразу подгружает ссылки на подходящие ответы.
В шапке — интерфейс управления звонком, чуть ниже — информация о клиенте в свернутом виде.
Интерфейс спрашивает, правильно ли система определила запрос клиента. Это нужно для самообучения нейросети
Умный поиск из концепта «Гугл» тоже пригодился.
Смотрим, как лучше выделить совпадающий с запросом результат поиска
При клике на ссылку с запросом или подсказку в поиске открывается форма с результатами. Справа — связанные вопросы. Карточки на время опускаются вниз.
Когда вопрос решен, оператор должен предложить платную услугу клиенту. Об этом напоминает и кнопка в правом нижнем углу
Если кликнуть на кнопку «Все разделы» в левом нижнем углу, система покажет боковое меню. Это решение мы взяли из концепта CRM.
В поле с клиентом показываем все возможные теги
Детализация
Мы с заказчиком довольно быстро пришли к интерфейсу, который можно развивать. Возможно, помогло разнообразие концептов — когда на руках много идей, лучше представляешь потенциал проекта. А еще понимаешь, в каком направлении стоит двигаться дальше. Без сомнений и времени на «подумать».
Так что почти сразу мы перешли к детализации макетов.
Ссылки в первую карточку подставляет робот, умеющий определять вопросы клиента и находить на них ответы
Заказчик не требовал использовать дизайн-систему Альфа-Банка. Возможно, потому что это внутренний продукт. Так что мы собрали дизайн на базе вайрфрейма Form.
Если не помогли ни карточки, ни поиск, оператор может открыть меню со всеми разделами
Справа от формы — блок с возможными действиями, связанными вопросами и ссылкой в актуальный раздел базы знаний. В нашем примере — в раздел «Тарифы».
Информация по карте подгружается сразу в форму оформления. Раньше оператору приходилось смотреть тарифы в интернете
Программа автоматически подгружает все данные о дозвонившемся клиенте. Если он спросит что-то, не относящееся к теме звонка, оператор сможет быстро посмотреть ответ в соседнем разделе. Раньше для этого приходилось переходить в другую программу и вбивать в нее данные о клиенте.
Показываем, как выглядят уведомления
Мы отрисовали все состояния и собрали интерактивный прототип.
Три экрана закрыли сценарий, который мы договаривались проработать. Конечно, это не дизайн всей программы — только часть для демонстрации топ-менеджменту. Но мы собрали каркас системы: главную страницу, навигацию и выдачу результатов. И он достаточно гибкий, чтобы в него можно было разместить другие услуги банка, в том числе и будущие.
Главное — MVP убедительно показывает, насколько новая программа получится проще и быстрее старых. И это именно тот мощный аргумент, на который будут смотреть топы, отвечающие за распределение бюджетов. А обошелся он, будем честны, в крохотную для банка сумму.
Заказчик забрал дизайн и ушел тестировать его на операторах.
Финал
Заказчик протестировал макеты, показал их топ-менеджменту и получил деньги на разработку новой программы. Одним выстрелом он убил двух, а то и трех зайцев.
Во-первых, получил MVP новой программы. Не блестящий фантик, который можно дорого продать, а рабочий дизайн.
Во-вторых, сэкономил на разработке. Мы подготовили внешний вид системы и принципы работы интерфейса, передали набор компонентов. Дальше дизайнеры будут развивать ее сами — во многих местах это сведется к сборке конструктора.
В-третьих, заказчик получил деньги на разработку. А значит, инвестировал и проявлял инициативу не зря. Благодаря ему тысячам операторов станет легче работать, клиенты будут быстрее получать ответы на вопросы, а банк заработает на увеличении производительности специалистов.
Смысл
За небольшой бюджет заказчик получил идею и реализацию, в которые банк вложил миллионы. Дизайн стал главным аргументом.
Большие перемены так и начинаются — с одной убедительной идеи. Против которой нечего возразить. И в такие идеи стоит инвестировать — чем мощнее старт проекта, тем больше его потенциал и тем раньше его можно обнаружить.