Shape 2 Created with Sketch. Shape 2 Created with Sketch. Shape 2 Created with Sketch. 1588D71D-671A-40A9-96DE-BF5F3C267598 Created with sketchtool. 539A0822-23D1-4EB0-A2B6-ADC1427D73FD Created with sketchtool. BE83D970-80BD-429F-8FEF-15320EFC25BD Created with sketchtool. icon-consulting fb Created with Sketch. F471C7B0-93AA-4A24-B0CB-8EEE8AA343E7 Created with sketchtool. Page 1 Created with Sketch. 8E691C04-FCB2-4D28-A161-E18CE8F4274A Created with sketchtool. icon-increase2 A00BE9EE-9E2C-4B16-A7A4-7ADF0D205D60 Created with sketchtool. 81897709-C9B7-4E51-8F7A-22FEB68F7CAE Created with sketchtool. D2397EF4-D11A-47C4-B4D1-5C8735A936A1 Created with sketchtool. icon-mail microphone Created with Sketch. icon-mvp icon-phone Oval 20 Created with Sketch. icon-research icon-research2 Group 36 Created with Sketch. icon-roadmap 58CDFB41-56B4-4914-9D32-F64663D44F09 Created with sketchtool. icon-team tie Created with Sketch. Imported Layers Copy 6 Created with Sketch. whiskey Created with Sketch. LOGO 50B11FD7-22F2-4934-A094-70A3E7FBFD64 Created with sketchtool.
Ко всем проектам

РайффайзенБанк

Разработка концепции нового интернет-банка «Райффайзен-Онлайн» с блочной структурой, основанной на виджетах

> 60

прототипов страниц

> 400

часов работы в офисе «Райффайзен»

Коротко о компании
Дочерняя структура крупнейшего австрийского банковского холдинга, в России работает с 1996 года. Предлагает широкий спектр услуг корпоративным и частным клиентам. После присоединения в 2007 году розничного "ИМПЭКСБанка" стабильно входит в ТОП-15 российских банков как по размеру активов, так и по объему частных вкладов и кредитов физическим лицам.
Адрес сайта
Победитель в конкурсе Золотой сайт
Руководитель отдела развития электронного бизнеса, Райффайзенбанк Наталия Масарская (НМ), Руководитель дирекции обслуживания физических лиц и малого бизнеса Райффайзенбанка
Андрей Степаненко (АС), CX-директор Аеро Виктор Антонов (ВА)
В чем особенность нового интернет-банка?
ВА: Когда мы делали интернет-банк Райффайзенбанка, то исходили из концепции «интерфейс для человека». Мы проанализировали потребности людей, которые приходят в банк, и постарались сделать так, чтобы банк разговаривал с посетителем на одном языке. Мы предложили построить интерфейс не на базе банковских продуктов, как обычно бывает,
а на основе ответов на простые вопросы. Правильная формулировка этих вопросов и стала для нас одной из главных задач (об особенностях онлайн-продаж финансовых продуктов читайте также в кейсе «Ингосстраха»).
Цитата НМ:
Везде, где мы отстаем от рынка, не запускаем вовремя какой-то сервис, мы теряем деньги, теряем лояльность. Чтобы получить возможность быстро меняться на уровне интерфейса и функциональности нужно было создать интернет-банк заново. Причем не только в части frontend, но и backend. От старого интернет-банка у нас не осталось ничего.
Цитата АС:
В новом банке интерфейс и структура стали более понятными. Так, на одном экране объединены продуктовое и операционное меню. Таким образом, пользователям стало проще ориентироваться в системе. В основе обновленного интерфейса — гибко настраиваемая модульная система, в которой каждый продукт представлен в виде виджета. Это позволяет осуществлять самые востребованные операции по каждому продукту в пару кликов.
ВА: Обычно в приложениях и личных кабинетах банков встречается множество длинных цифр и сложны аббревиатур: БИК, ИНН, КПП, КБК и тд и тд. Наша идея была максимально всё упростить: у обычного человека есть всего несколько операций, которые ему нужны от банка: что-то оплатить, перевести деньги, посмотреть остаток денег на счете.

Мы решили сделать навигацию через “Г”-образное меню, состоящее из двух смысловых измерений, и виджетов. В верхней, горизонтальной части меню расположены пункты, решающие простые бытовые задачи, которые часто совершает человек. Всего пять кнопок – число, которое легко воспринимается и запоминается. Названия кнопок мы выбрали глагольные, чтобы продолжить внутреннюю формулировку потребности: «Я хочу ...». Ответами могут быть «...обменять валюту», «...открыть счет», «...оплатить», «...пополнить счет». Это меню для рутинных операций.

Вертикальное меню мы сделали традиционным, продуктовым. К этому меню посетитель обращается редко, когда нужно что-то очень специфичное.
Предпроектные исследования
Посетитель при заходе в интернет-банк мыслит в категориях действий (оплатить, перевести), либо в категориях продуктов (зайти на свою карту).
Значительная часть существующих клиентов привыкла к продуктовой структуре.
Вся информация и доступные действия по одному продукту/услуге в одном месте (концепция дашборда). Оптимальным числом информационных элементов меню является 5-7, большее число должно быть разбито на логические категории.
Цель и польза проекта
Разработать новой версии интернет-банка "Райффайзен-Онлайн"
Увеличить конверсионность: количество повторных входов в систему и количество проводимых операций
Реализовать поддержку индивидуальных предпринимателей
Реализовать доступ для держателей дополнительных карт, не являющихся клиентами банка
Снизить нагрузку на сотрудников банка, ответственных за проведение операций, недоступных в прежней версии системы
Задачи
Реализовать возможность персонализации внутреннего пространства по категории клиента, его местонахождению и поведению в системе
Полностью переработать визуальную часть
Расскажите подробнее о виджетах. Как они устроены?
ВА: В них отображаются карты, которые есть у клиента в банке и информацию: какие операции в последнее время совершались, сколько денег на счете, какие суммы заблокированы. Посетитель сам может настраивать свои виджеты так, чтобы это было удобно именно ему, двигать их. Но они также предоставляют множество возможностей для маркетологов банка и автоматизированных рекомендательных сервисов: преднастройки клиент-банка могут значительно повышать просматриваемость и частоту использования продуктов и специальных предложений.

Цитата НМ:
Значительная часть клиентов, около половины, не хочет заниматься настройками. И мы сделали так, что, заходя в первый раз в новый онлайн-банк, пользователи получают полноценно настроенный рабочий стол. С ним, в принципе, можно ничего и не делать — все уже под руками. Но в то же время существуют все возможности для персональной настройки. Если есть время и желание — пожалуйста.
Какие были сложности в реализации проекта?
ВА: Иногда мы были ограничены возможностями реализации изменений. Чтобы точнее понимать ограничения и специфику, наш аналитик работал на территории банка и был интегрирован в команду клиента. Это существенно облегчило нашу работу.

Одна из неожиданных проблем, которая возникла при работе – это фотографии, используемые в проекте. Райффайзенбанк требует абсолютного эксклюзива на все используемые материалы, поэтому нам пришлось отказались от фотографий из фотобанков и искать другие эмоциональные способы оформления разделов.
Решения и процессы
Новый подход к организации интерфейса на основе потребностей пользователя: «Я хочу...»
Блочный дизайн, состоящий из виджетов, позволяющий легко пересобирать страницы и делать персонализированные предложения для отдельных сегментов или каждому клиенту
Контекстная помощь по всем операциям в интерфейсе виджета
Цветовая дифференцация интерфейса по категории клиентов
Маркетинговые и рекламные места в единой сетке с виджетами (Native Ads)
Сохранение состояния, настроек интерфейса и заполненных данных
Адаптация структуры для удобства отображения на мобильных устройствах и терминалах самообслуживания
Виджеты для использования возможностей разных банковских продуктов в рамках одного интерфейса
Разработка при тесном взаимодействии с заказчиком в режиме аутстафинга
Общий результат
Реализована технологичная структура интернет-банка с богатыми возможностями персонализации
Дизайн виджетов позволяет сократить количество действий при выполнении операций и эффективнее пользоваться банковскими продуктами
Продумана система оповещений, маркетинговой коммуникации и контекстной помощи клиентам
Разработана концепция адаптивности интерфейса для всех типов устройств и поддержки мультиязычности
Поддержан принцип омниканальности, позволяющий вносить данные и пользоваться едиными интерфейсами на сайте, в мобильном приложении и в отделениях банка
Отзыв клиента
Наталия Масарская, руководитель отдела электронного бизнеса Райффайзенбанка:
«Получился простой, удобный и хорошо структурированный инструмент по управлению финансами для всей семьи.»


Руководитель дирекции обслуживания физических лиц и малого бизнеса Райффайзенбанка Андрей Степаненко:
«В новом банке интерфейс и структура стали более понятными. Так, на одном экране объединены продуктовое и операционное меню. Таким образом, пользователям стало проще ориентироваться в системе. В основе обновленного интерфейса — гибко настраиваемая модульная система, в которой каждый продукт представлен в виде виджета. Это позволяет осуществлять самые востребованные операции по каждому продукту в пару кликов.»
Другие проекты
Расскажите о проекте
Подпишитесь на рассылку о eCommerce

Благодарим вас за подписку! В ближайшее время пришлем вам интересные статьи

Этот адрес уже подписан на нашу рассылку

eCommerce стикеры №1

Мы нарисовали первый eCommerce стикерпак, чтобы вам было еще проще обмениваться своими эмоциями!

Telegram iMessage

eCommerce стикеры №1

Первый стикерпак для интернет магазинщиков