Полное руководство по UX-дизайну в банковской сфере

Ключевые принципы и требования, алгоритм работы над UX банковского приложения, психологические приемы и др.

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

Зачем заниматься UX-проектированием банковского приложения?

При создании банковского приложения важно учитывать следующие важные аспекты:

• Продукт должен надежно работать даже в условиях большой нагрузки (быть масштабируемым)
• Продукт должен быть адаптирован под максимально широкую аудиторию пользователей (разный возраст, разный уровень владения мобильными устройствами и т.п.)
• Продукт должен быть максимально интерактивным и предоставлять пользователю самую свежую информацию
• Продукт должен быть доступным на нескольких языках
• В продукт должны быть заложены механики сбора обратной связи

Продукт должен быть адаптирован под потребности людей с ограниченными возможностями (к примеру, в США есть руководство по обеспечению доступности WCAG, которое рекомендуется соблюдать).

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

Ключевые принципы банковского UX-дизайна

На самом деле, принципы UX-дизайна более-менее универсальны и применимы при разработке любых приложений:

• Облегчить пользователю выбор. Избегайте слишком сложных интерфейсов, которые усложняют процесс выбора нужной функции
• Предоставить информацию в проверенной и понятной форме. Если вы разрабатываете продукт для широкой аудитории, не нужно чересчур креативить. Выбирайте привычные элементы интерфейса, знакомые пользователям паттерны. С другой стороны, важно все же следить за трендами в отрасли и вовремя внедрять удачные новинки. Вы же не хотите, чтобы приложение устарело вскоре после релиза?
• Использовать больше графики и меньше текста. Никто не любит читать полотна текста
• Ограничить количество функциональных элементов. В одном функциональном блоке не должно быть больше 5-7 элементов. В противном случае, пользователю будет сложно удерживать все элементы в краткосрочной памяти
• Группировать информацию. Желательно разбивать информацию на экране на логические блоки — так пользователю будет проще воспринимать большое количество данных
• Не прятать важные элементы. Все важные элементы интерфейса нужно визуально выделить и подсветить
• Следовать принципу трех кликов. Чтобы перейти из одного раздела приложения в другой, пользователю должно быть достаточно 3 кликов. То же правило применимо и к стартовому экрану: доступ к самой важной информации должен быть не более чем в 3 кликах от стартового экрана

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

Примеры банковских приложений с эффективным UX-дизайном

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

• CANDI
• UniCredit Mobile Banking
• Simple Bank
• KiwiBank
• Number26

О последних трех приложениям мы подробнее поговорим чуть позже.

Заметьте, что почти у всех продуктов в этом списке подход к UX-дизайну достаточно традиционный: их интерфейсы можно охарактеризовать словами “интуитивно понятный, удобный, функциональный”. Можно немного модернизировать приложение за счет элементов анимации и разных трендовых технологий, но база остается той же.

Требования к UX банковских продуктов

Формально, можно выделить 6 ключевых требований к UX банковских приложений:

• Персонализация (наличие пользовательского аккаунта и возможность привязать к нему свой счет, аккаунты в сетях и т.п.)
• Безопасность (любое приложение, которое работает с персональными данными клиентов, должно гарантировать приватность и безопасность информации)
• Адаптируемость к разным форматам мобильных устройств
• Интуитивность (у пользователя не должно быть сомнений, где найти ту или иную функцию для решения конкретной задачи)
• Здравый смысл (в интерфейсе должны быть только те функциональные элементы, которые действительно важны в процессе взаимодействия. Все остальное можно убрать в выпадающие и другие скрытые меню)
• Эстетика (все вышеперечисленное не должно идти вразрез с эстетикой: приложение должно выглядеть красиво и гармонично)

Функциональные элементы

Теперь давайте посмотрим, какие функциональные элементы присутствуют в любом банковском приложении:

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

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

Алгоритм работы над UX банковского приложения

Мы добрались до проработки UX вашего банковского приложения. Этот процесс включает в себя 10 ключевых шагов:

1. Прописать портреты клиентов

Банковский сегмент — достаточно широкая область и здесь могут быть самые разные типы пользователей и клиентов: студенты, домохозяйки, предприниматели, бухгалтеры, пенсионеры и т.п. На каких пользователей ориентируетесь вы?

2. Определить, какую ценность в приложении ищут наши клиенты

Очевидно, в случае с банковскими приложениями, среди ценностей можно выделить удобство (“зачем идти в отделение банка, если все можно сделать по интернету?”) и дополнительные услуги, недоступные в оффлайне.

3. Проработать сценарии обратной связи

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

4. Прописать пользовательские процессы (флоу)

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

5. Оптимизировать все процессы (флоу) до  максимум 3 действий

Чем меньше шагов до цели — тем лучше.

6. Сгруппировать функционал по тематикам

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

7. Продумать, какие опции разместить в выпадающих меню, а какие поставить на видное место

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

8. Внедрить хотя бы некоторые из современных UX-трендов

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

9. Создать лейауты

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

10. Протестировать дизайн на реальных пользователях

По мере того, как вносите изменения в UX-дизайн приложения, обязательно проводите тесты с реальными пользователями. Иногда то, что мы считаем “улучшением”, с точки зрения пользователя делает интерфейс более запутанным.

Психологические приемы UX-дизайна банковских продуктов

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

• Закон Хика. Этот закон гласит: чем больше у пользователя вариантов выбора и чем они сложнее — тем больше времени нужно для принятия решения. Таким образом, желательно, чтобы задачи в приложении решались за минимальное количество как можно более простых шагов.
• Закон Миллера. Согласно закону Миллера, среднестатистический человек может удерживать в краткосрочной памяти порядка семи элементов. Большинству пользователей сложно работать с большим количеством элементов.
• Привычные паттерны дизайна. У большинства мобильных платформ (Android, iOS, Windows Mobile) если библиотека паттернов дизайна: элементов, панелей, жестов. Пользователи быстро привыкают к паттернам своего устройства и испытывают дискомфорт, если какое-то приложение на том же устройстве ведет себя по-другому. Чтобы пользователям было приятнее взаимодействовать с приложением, лучше использовать те же паттерны, какие приняты на платформе.

Исследование целевой аудитории

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

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

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

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

UX-тестирование

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

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

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

Чего стоит избегать при проектировании UX банковского приложения:

А теперь давайте разберем несколько распространенных ошибок, которые допускают дизайнеры при проектировании банковских решений:

• Слишком креативно . Внедрить самые смелые идеи и таким образом выделиться на фоне конкурентов — не самая лучшая стратегия для банковского продукта. Банковские продукты и так довольно сложные — к чему перегружать пользователей еще и необычными дизайнерскими решениями? Лучше придерживайтесь привычных паттернов и элементов дизайна.
• Слишком много уведомлений . Да, вы можете отправлять пользователю сообщения. Но не нужно этим злоупотреблять! Пусть уведомления содержат только по-настоящему важную информацию.
• Настолько в тренде, что ничего не понятно . В стремлении внедрить самые модные фишки и приемы UX-дизайна, дизайнеры иногда — осознанно или нет — жертвуют простотой и понятностью интерфейса. Прежде чем внедрять очередной тренд, дважды подумайте: не станет ли приложение тяжелее и сложнее?

С какими сложностями вы столкнетесь при проработке UX-дизайна

В продолжение темы, хочется выделить ряд сложностей, с которыми часто сталкиваются UX-дизайнеры, работая в банковской сфере:

• Погоня за универсальным дизайном . Забудьте это выражение “универсальный дизайн”. Когда дело касается массового продукта, это миф. У каждой платформы есть свои гайдлайны, принципы, тренды. То, что отлично работает на Android, может оказаться неудобным на iOS — и наоборот. Если вы хотите обеспечить всем пользователям одинаково качественный опыт взаимодействия, создавайте отдельные версии для разных платформ: причем UX под каждую нужно проработать практически с нуля.
• Компромисс между технологичностью и понятностью . Допустим, банк решил открыть новый сервис, который работает на базы самых новых технологий (скажем, блокчейн). В этом случае перед UX-дизайнером стоит практически нереальная задача: подать сложный сервис пользователям-непрофессионалам (например, как объяснить рядовому пользователю, что такое “умный контракт” и как им пользоваться?). В подобной ситуации, дизайнеру нужно глубоко погружаться в принцип действия каждой функции, чтобы максимально доходчиво объяснить “как это работает” всем группам пользователей.
• Негибкий интерфейс . По мере развития приложения, в нем, скорее всего, будут появляться новые функции. Если не продумать эту возможность на старте, со временем приложение превратится в монстра Франкенштейна со сложной структурой и навигацией. Лучше всего сразу проектировать функционал и навигацию немного на вырост.

Практические советы по UX-дизайну банковских продуктов

Несколько простых советов, как усилить UX банковского приложения:

• Не нужно спамить уведомлениями . Мы уже говорили об этом и повторим еще раз: если посылать слишком много уведомлений, пользователь просто их отключит — а то и вовсе перестанет пользоваться приложением.
• Дайте возможность настроить приложение под себя . Как показывает практика, персонализация поднимает услугу на новый уровень. Заложите возможность настроить интерфейс — элементы или оформление — под предпочтения пользователя.
• Продумайте интерфейс поиска . При проектировании функции поиска (например, в новостной ленте), подумайте об удобстве пользователя: добавьте фильтры, возможность сортировки и быстрого поиска.
• Оптимизируйте онбординг . Онбординг — это процесс, когда пользователь учится пользоваться приложением. Ваша задача — чтобы пользователь освоился быстро и с первого раза, и чтобы ему не пришлось искать дополнительные тьюториалы и документацию на сайте или в приложении.
• Сделайте дизайн адаптивным . Позаботьтесь о пользователях разных устройств и платформ. Ваша задача — чтобы каждый клиент мог легко и быстро решить свои проблемы через приложение, с какого бы девайса он ни зашел.

Несколько трендов банковского UX-дизайна

Присмотритесь к этим трендам — возможно, что-то имеет смысл внедрить:

• Голосовое управление . Возможность голосовой навигации — это важный шаг в повышении доступности приложения. Просто представьте: благодаря этой функции даже парализованные люди смогут запросто пользоваться вашим продуктом.
• Чатботы на базе искусственного интеллекта . Боту можно поручить обрабатывать в чате часто задаваемые вопросы — чтобы по мере роста клиентской базы вам не пришлось постоянно расширять штат специалистов по работе с клиентами.
• Биометрическая аутентификация . Авторизация и аутентификация по биометрическим параметрам считается одной из самых безопасных. С точки зрения UX, такой способ входа в приложение позволяет сэкономить время и не заморачивать пользователя надежными паролями (которые сложно не только придумывать, но и запоминать).

Кейсы

Ниже мы рассмотрим три примера банковских приложений с хорошим UX:

Simple Bank

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

KiwiBank

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

Number26

Мобильный банк N26 — практически единственный в своем роде на немецком рынке. У приложения отличный UX: навигация понятная и логичная, цвета приглушенные и спокойные, а новый контент подается очень лаконично и дозированно. Отличное решение для пользователей мобильных девайсов.

UX-дизайн банковских приложений: заключение

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