Отображение карт и счетов
Главная страница интернет-банка должна давать пользователю четкое понимание, что сейчас происходит с его финансами: какие у него есть карты и счета, сколько на них лежит денег. Но результаты юзабилити-тестирований показывают, что пользователи далеко не всех интернет-банков могут разобраться в состоянии своих финансов. И главная проблема заключается в том, что в некоторых банках понятия «карта» и «карточный счет» разделены, тогда как в сознании клиентов они представляют собой единое целое.
С точки зрения клиента, карта — это физический кусок пластика, который по сути символизирует его связь с банком. При этом многие не знают, что у карты есть свой карточный счет. С точки зрения банка, карта — это физический кусок пластика, привязанный к определенному счету, и все платежи на самом деле проходят через этот счет. Точка зрения банка логически более верна, но непонятна для массового клиента. Увидев на главной странице интернет-банка два разных блока с информацией о балансе на карточном счете и карте, пользователь решает, что это два разных продукта, баланс на которых совпадает из-за непонятного стечения обстоятельств. Если же на главной странице информация о карте в явном виде не отображается вовсе, потому что банк решил, что будет достаточно информации о состоянии карточного счета, клиенты очень удивляются и не понимают, почему информации об их карте в интернет-банке нет.
Например, на рис. 1 на странице не отображается баланс карты. Кроме того, пользователям непонятно, что карта MC STANDARD привязана к счету, номер которого заканчивается на 1807.
Одно из хороших решений заключается в том, чтобы четко обозначать связь карты и счета. Например, рядом с номером счета можно нарисовать пиктограмму, символизирующую, что к счету привязана карта, однако если эта пиктограмма неправильно оформлена, пользователи ее не заметят. В системе Альфа-Банка (рис. 2, слева) рядом с балансом карточного счета указаны четыре последние цифры номера карты и обозначена ее платежная система. Наши тестирования показали, что пользователи сразу замечают такое обозначение и понимают, что оно значит. В системе БСПБ (рис. 2, справа) решение на первый взгляд аналогичное. Однако пиктограмма слишком мелкая, название платежной системы трудно считывается, потому что заключено в синий прямоугольник, никаких дополнительных цифр нет, и многие пользователи так и не поняли, что эта пиктограмма обозначает связь карты и счета.
Связь карты и счета можно сделать еще более наглядной. В системе Райффайзенбанка (рис. 3) на экране с подробной информацией о счете можно увидеть все привязанные к нему карты, а оттуда перейти к экрану с информацией о картах. Жалко, что на главной странице такого наглядного отображения нет.
Самое радикальное решение заключается в том, чтобы в принципе убрать из раздела «Счета» информацию о карточном счете. Так сделано, например, в Сбербанке и ЮниКредит Банке (рис. 4). Тогда пользователи точно понимают, сколько у них в банке карт, сколько счетов, и не путаются между ними.
Информация в выписке по карте/счету и истории операций
Пользователи обращаются к истории операций, когда хотят уточнить, что происходит с их картой, счетом или вкладом: за что списывались деньги, были ли поступления. При этом им, как правило, незнакома техническая и банковская терминология, они не понимают сокращений, а латиница их часто пугает.
С проблемой корректного описания операций в истории мы впервые столкнулись в 2012 г., когда проводили сравнительное исследование каналов ДБО для одного российского банка. Эта проблема до сих пор присуща многим интернет-банкам. Например, в Райффайзенбанке в истории операций по карте клиенты видят строку «RCONNECT MCMS MOSCOW RUS» (рис. 5). Неподготовленному пользователю это ничего не скажет, и он сможет догадаться, что это был за платеж, только по косвенным признакам, таким как сумма и дата.
Другая довольно распространенная проблема — недостаточное количество информации в истории операций. Пользователи хотят видеть источник платежа или перевода, его получателя, статус, дату и сумму. Если была проведена оплата мобильного телефона, пользователи хотят видеть его номер, для переводов — счет списания и счет получения платежа. Так, в выписке по карте Бинбанка (рис. 6) все названия операций написаны по-русски, но пользователям от этого не легче, потому что все описания крайне лаконичны и не содержат важных подробностей, хотя бы информацию о получателе платежа. При этом история операций в интернет-банке, доступная на главной странице, представлена в том же формате, но строки в ней кликабельны. Нажав на нужную строку, пользователь может увидеть детальную информацию об интересующем его платеже.
Интересно, что проблемы с названиями операций связаны в основном с выписками по карте или счету, а вот истории операций, проведенных через сами интернет-банки, как правило, представлены гораздо удачнее. Например, в Сбербанк Онлайн (рис. 7) история операций, проведенных через систему, представляет собой таблицу, где в столбцах указаны их названия, счет списания, получатель, сумма и дата проведения. Все тексты на русском языке. Возможно, визуально это решение можно было бы оформить более изящно, но оно отлично выполняет свою функцию: во время тестирования ни у одного из респондентов не возникло проблем с пониманием этой таблицы.
Поле для ввода номера телефона
Пользователи вводят номер телефона не в том формате, в котором это нужно банку для проведения платежа. Банк, как правило, требует, чтобы номер телефона был введен без кода страны и скобок — просто десять цифр подряд. Однако пользователи, не догадываясь о потребностях системы, вводят номер через 8 или +7, некоторые пытаются использовать скобки, пробелы и даже дефисы между группами цифр. Эта проблема появилась много лет назад вместе с возможностью оплачивать сотовую связь через интернет-банк и через столько лет до сих пор продолжает встречаться в некоторых интерфейсах. Сразу хочется обратить внимание на то, что подсказка к полю для ввода номера телефона проблему не решает. Пользователи не читают подсказок и не считают количество введенных цифр. Например, светло-серая строка подсказки на рис. 8 (Совкомбанк) не работает, потому что пользователи ее не замечают и все равно вводят номер в привычном для них формате через 8 или +7.
Обычно мы рекомендуем добавлять к полю маску, которая сразу подскажет пользователям, в каком формате вводить цифры. Но неправильно сделанная маска может сослужить плохую службу: пользователи все равно начинают вводить номер телефона через 8, а свою ошибку замечают, только столкнувшись с ограничением числа символов в поле, как, например, в системе ЮниКредит Банка (рис. 9). Им приходится стирать введенный номер телефона и набирать его заново.
Самым хорошим решением было бы позволить клиенту вводить номер телефона в любом формате, а затем автоматически переводить введенные данные в форму, необходимую для обработки платежа. Если же банку нужно, чтобы пользователь вводил исключительно строку из 10 цифр без скобок, пробелов и дефисов, надо помочь ему в этом: внутри поля для ввода номера отображать крупную и хорошо заметную цифру 7, скобки и дефисы, разделяющие блоки по три и две цифры, как, например, в системе ВТБ 24 (рис. 10). Результаты юзабилити-тестирования показывают, что при взаимодействии с полем, оформленным таким образом, у пользователей почти не возникает проблем.
Поле для ввода периода оплаты ЖКУ (Москва)
Многие клиенты не знают, как правильно называется получатель платежа и какие реквизиты являются ключевыми. Проблему поиска кода плательщика, возможно, решит детальная графическая подсказка, где на макете типовой квитанции будет отмечено место расположения кода. А мы сейчас сосредоточимся на проблеме ввода периода оплаты, которая так просто не решается.
Большинство интернет-банков требуют, чтобы пользователь вводил период платежа в формате ММГГГГ. У пользователей это вызывает затруднения сразу по двум причинам. Во-первых, такой формат ввода данных непривычен для них. Во-вторых, многие далеко не сразу понимают, что вообще значит аббревиатура ММГГГГ. Причем ММГГГГ — это далеко не единственный вариант требований банка к формату ввода периода оплаты. Клиенты банка Русский Стандарт должны вводить период оплаты в формате ММГГ, клиенты Банка Санкт-Петербург — в формате ГГГГ-ММ. Больше всего затруднений испытывают пользователи системы Райффайзенбанка: они должны вводить период в одно поле с кодом плательщика через двоеточие (рис. 11). Раньше с аналогичной проблемой сталкивались пользователи интернет-банка «Открытия», но в этом году разработчики решили ее: в новой версии системы, которая пока находится на стадии бетатестирования, поля «Код абонента» и «Период оплаты» разделены.
Удачнее всего проблему решил Тинькофф Банк: он позволяет вводить период оплаты в любом формате (ММГГ или ММГГГГ) или выбирать его из календаря.
И, конечно, пользователям сильно облегчает жизнь функция поиска задолженности по номеру лицевого счета, доступная в интернетбанках Сбербанка, Тинькофф Банка, Бинбанка и некоторых других банков.
Решения, улучшающие пользовательский опыт
Несмотря на то что до сих пор банки решили не все свои старые юзабилити-проблемы, в целом интернет-банки меняются к лучшему. Бо́льшая часть улучшений связана с появлением новых функций, которые чем-то облегчают жизнь пользователю: избавляют от необходимости вручную вводить реквизиты или лично обращаться в банк.
Например, половина участников юзабилити-рейтинга в 2017 г. давали клиентам возможность воспользоваться строкой поиска, чтобы найти получателя платежа по ИНН, как, например, в системе Тинькофф Банка (рис. 12), или номеру расчетного счета, а в некоторых интернет-банках даже просто по названию получателя. Это избавляет пользователей от необходимости гадать, в какой раздел каталога перейти, чтобы совершить нужный платеж.
Райффайзенбанк внедрил функцию, позволяющую заполнить и отправить в ФНС России налоговую декларацию по форме 3-НДФЛ, чтобы получить налоговый вычет (рис. 13). Деньги возвращаются на карту банка. На наш взгляд, это хорошее решение. Многие не пытаются получить налоговый вычет, потому что считают, что это сложная и трудоемкая процедура, а благодаря внедрению такой функции в интернет-банк клиенты банка с большей вероятностью воспользуются данной возможностью.
Полезный тренд функциональности, который позволяет клиентам экономить время и избегать ошибок при вводе реквизитов, — подписка на выставление счетов от различных организаций. Пользователю надо ввести реквизиты платежа (например, код плательщика ЖКУ) или собственные данные (например, ИНН), и система начнет автоматически собирать связанные с ними счета. В том или ином виде эта функция сейчас доступна клиентам Сбербанка, Банка СанктПетербург, Тинькофф Банка (рис. 14) и некоторых других банков.
Минимизируя ручной ввод, банки сокращают количество ошибок пользователей и решают многие юзабилити-проблемы.
Статья напечатана в журнале «Расчеты и операционная работа в коммерческом банке», 2018, №1
Подписывайтесь на наш Телеграм, чтобы не пропустить выход новых полезных статей!