Почта Банк — российский розничный банк, созданный в 2016 году банковской группой ВТБ и Почтой России. По итогам 2020 года его клиентская база составила 16 миллионов человек.
С момента запуска сайта Почта Банк не вносил существенных изменений в дизайн. За это время тренды проектирования и оформления интерфейсов изменились и концепция устарела. Приоритетом редизайна был новый цифровой имидж и отстройка от конкурентов. Кроме того, высокий юзабилити и сильная презентация продуктов.
Клиент
Контекст
Три базовых принципа редизайна:
Работа над проектом
Диджитал-гуманизм
Создание интерфейса, который подстраивается под пользователя, а не наоборот
Создание интерфейса, который подстраивается под пользователя, а не наоборот
Data Driven Design
Проектирование на основе данных исследований аудитории, ее поведения и нужд
Проектирование на основе данных исследований аудитории, ее поведения и нужд
Стратегия Mobile First
Разработка мобильной версии на основе PWA-подхода для того, чтобы увеличить скорость сайта и сделать его функциональным
Разработка мобильной версии на основе PWA-подхода для того, чтобы увеличить скорость сайта и сделать его функциональным
Мы сделали срез по банковскому рынку и внимательно изучили продукты для разных сегментов — подход к проектированию интерфейсов, навигации, дизайну, презентации продуктов. Результаты показали, что e-commerce сайты фокусируются на оптимизации мобильной версии, много используют UI-элементов и UX-паттернов мобильных приложений. Мы проанализировали user journey, составили карту сайта и разработали оптимальный мультидевайсный UX.
Аналитика
На основе аналитики дизайнеры предложили 8 визуальных концепций, из которых клиент выбрал финальную. Она выполнена в эстетике smart-minimal — минимум информации и сдержанный визуал в пастельных тонах, чтобы вывести на первый план продукты Почта Банка. В дизайне мы отталкивались от «золотого стандарта» российских банковских сайтов: главная страница в стиле продуктовой витрины, вложенный принцип для навигации, использование калькуляторов для презентации продуктов.
Дизайн
После выбора финальной концепции разработали UI-kit на основе дизайна приложения Почта Банк Онлайн. Клиент сможет быстро создавать новые страницы и продукты, сохраняя визуальную целостность и наследственность интерфейсов экосистемы банка. Мы нарисовали более 200 3D-иллюстраций для описания всех услуг и преимуществ банка.
Готовые интерфейсы мобильной и десктопной версий протестировал Аналитический центр НАФИ. Исследование показало, что пользователи без труда находят нужные продукты и услуги, а значит главная UX-цель достигнута — дизайн интуитивно понятен и предсказуем.
UI-kit
UX-экспертиза
Техническая реализация
В основе продукта — виджетный подход. Сайт использует CDN и React, ключевые страницы мы оптимизировали вручную, чтобы сложная 3D-графика не мешала быстрой загрузке страниц.
В новом дизайне мы сохранили лаконичность и сдержанность, характерные для продуктов банка.
Результаты
Продукт стал более узнаваемым, получил актуальный и современный веб-интерфейс с улучшенным user experience.
Дизайн стал комфортным — каждая страница соответствует главным принципам сторителлинга, визуальной иерархии и адаптивности.