Этот непростой финтех: как с помощью дизайна повысить доверие пользователей

Финансовый проект — настоящее испытание для дизайнера. Потребители переживают за свои сбережения и не хотят попасться на уловки мошенников. Отрасль славится непрозрачными процентными ставками и навязчивыми спам-звонками с предложениями кредитов.

Нельзя просто нарисовать сайт с кнопкой «Пришлите паспорт и оформите кредит» — придется серьезно поработать над доверием аудитории и донести до нее — здесь вас не обманут.

Александр Обанин, арт-директор финансового маркетплейса «Выберу.ру», рассказывает о том, как дизайнеру стать чуть-чуть психологом, сделать интерфейс дружелюбнее на фоне традиционно «сухих» финансовых сайтов, мотивировать людей заполнять персональные данные и не бояться вас.

Добиться лояльности аудитории непросто любому финтех-проекту. На это есть весомые причины:

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

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

Вот несколько советов, как сделать контент на сайте чуть более человечным:

1. Имена и фото настоящих людей. Когда люди делятся с сервисом проблемами, им важно, чтобы их услышали. Добавляйте больше имен, настоящих фотографий, — пусть пользователи видят, что они обращаются не к боту, а к реальному человеку. У нас на «Выберу.ру» это эксперт или обычный пользователь с похожим опытом за плечами.

2. Акцент на полезные советы и разборы ситуаций. Оформите специальный раздел с экспертным контентом на сайте и отдайте приоритет статьям, в которых вы будете разъяснять сложные ситуации (их в финансовой отрасли множество).

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

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

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

Не забудьте сказать аудитории:

1. Зачем вам нужны данные. Например, при запросе номера телефона объясните, что он требуется банку, и на него придет решение по кредиту.

2. Насколько большое внимание вы уделяете безопасности. Напишите, как защищаете персональные данные, почему у вас нет утечек и как вы исключаете случаи мошенничества. Если есть еще какие-то важные нюансы, например, вы не используете номера телефонов для звонков клиентам, — не забудьте указать это.

В примере выше пометка «Все ваши данные защищены» — не просто слова, а политика конфиденциальности, разработанная в соответствии с законом.

3. Об опыте других пользователей. Такие триггеры на сайте обладают эффектом социального подтверждения: «10 человек просматривают этот продукт», «Сегодня подали заявку 30 человек», последние купленные полисы ОСАГО и т. д.

Наше внутреннее UX-исследование показало, что люди не различают похожие финансовые сервисы — считают, что это один и тот же проект. А еще периодически не замечают переход на сторонние сайты, например, не понимают, что ушли с маркетплейса на сайт банка.

Есть примеры, где финансовые компании для отстройки используют нетипичные для отрасли дизайн-приемы. Взять ту же цветовую гамму: у Тинькофф она желтая, у ЮMoney — сиреневая, у Эвотор — оранжевая. Однако не все компании готовы идти так далеко, если целевой аудитории нужно что-то проще и привычнее. Как конкурировать в этом случае?

С помощью визуального языка. Он строится из базовых компонентов восприятия (линий, форм, размеров), которые считываются с первого взгляда. Продуманная система коммуникации с пользователем позволяет создать индивидуальность, оригинальный tone of voice и донести ценности продукта.

1. Округлые формы. Мы бессознательно ассоциируем формы с неким подтекстом. Угловатые кнопки и фигуры визуально отталкивают, поэтому важно смягчать линии. Здесь вспоминается эффект «буба — кики»: как вы думаете, какая фигура «буба», а какая — «кики»? И что лучше будет восприниматься на сайте?

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

3. Работа с масштабом. Человек может видеть одно и то же изображение по-разному: общий план или детали. Мы задействуем максимально близкий масштаб — фокусируемся на уровне вопроса, который сейчас решает пользователь. Так мы демонстрируем, что обращаем все внимание на текущую задачу.

Все эти приемы мы применили в крупном обновлении главной страницы «Выберу.ру» и спросили пользователей, что они думают. Те отметили, что дизайн теперь отличается от конкурентов — будем считать, сработало.

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

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

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

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

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

3. Объясните термины. Продумайте за пользователя, чего он может не знать, какие ситуации для него наиболее непонятные. Для расшифровки терминов можно, например, использовать отдельное окно, которое открывается при наведении курсора.

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