Частные клиенты
Ищут карту, кредит или вклад и хотят быстро понять условия. Для них важны простой язык, заметные целевые действия, удобный калькулятор и короткий путь до заявки.
Концепт редизайна цифрового банка «Русский Стандарт»
Проект демонстрирует современный подход к проектированию банковских интерфейсов с акцентом на удобство пользовательских сценариев, доверие и визуальную простоту. Основной задачей стало создание понятной структуры, сокращение пути пользователя к банковским продуктам и формирование единой цифровой экосистемы.
Мой вклад в проект
В рамках проекта я провёл анализ банковских интерфейсов и пользовательских сценариев, разработал структуру главной страницы, спроектировал навигацию и ключевые продуктовые блоки, создал интерфейс в Figma и подготовил дизайн ключевых экранов для Desktop.
Особое внимание было уделено визуальной иерархии, понятной подаче банковских продуктов и сокращению пути пользователя к нужному действию. В результате получилась цельная концепция современного цифрового банка с удобным интерфейсом на разных устройствах.
О проекте
Современный цифровой банк с понятным интерфейсом
«Русский Стандарт» — концепт редизайна банковского сайта с акцентом на понятную навигацию, удобный выбор финансовых продуктов и современную визуальную подачу. В проекте показано, как можно упростить взаимодействие пользователя с кредитами, картами, вкладами и другими услугами банка.
Основная идея проекта — сохранить узнаваемость бренда, но сделать цифровой интерфейс более ясным, последовательным и удобным. Я разработал UX-структуру, визуальную концепцию и дизайн ключевых экранов для Desktop.
Задача
Сделать сложный продукт простым для выбора
Банковский сайт должен помогать пользователю быстро разобраться в продуктах, сравнить условия и перейти к целевому действию без лишних шагов и перегруженной навигации.
Бизнес-цели: повысить понятность продуктового предложения, сократить путь до заявки и сформировать образ современного, надёжного и технологичного банка.
Пользовательские задачи: быстро найти подходящий продукт, понять основные условия, рассчитать платёж и оставить заявку с минимальным количеством действий.
Ограничения: сохранить фирменный стиль бренда, обеспечить последовательный пользовательский опыт и не перегружать интерфейс лишними элементами.
Целевая аудитория
Три сегмента — один интерфейс
Структура сайта учитывает разные сценарии поведения пользователей: от быстрого выбора повседневного банковского продукта до поиска премиального обслуживания или решений для бизнеса.
Премиум-сегмент
Ожидают персональный подход, высокий уровень сервиса и более сдержанную визуальную подачу. Для них особенно важны качество интерфейса, статусность и внимание к деталям.
Бизнес-клиенты
Ищут расчётно-кассовое обслуживание и другие решения для бизнеса. Им нужны понятные тарифы, чёткая структура разделов и быстрый доступ к консультации специалиста.
Моё решение
Контрастный интерфейс, который направляет пользователя к действию
В основе визуального решения — глубокий тёмный фон, светлая типографика и оранжевые акценты для ключевых действий. Такой контраст помогает выстроить понятную иерархию, сохранить ощущение надёжности и выделить основные пользовательские сценарии.
Иерархия первого экрана
На первом экране сразу показаны главное предложение, преимущества и два понятных сценария действия. Пользователь быстро понимает ценность продукта и может перейти к выбору услуги или оформлению заявки.
Калькулятор рядом с предложением
Кредитный калькулятор расположен в заметной зоне рядом с основным содержанием. Пользователь может оценить параметры продукта и перейти к заявке, не покидая страницу и не выполняя лишних действий.
Модульная сетка
Интерфейс построен на повторяемых компонентах и единой сетке. Это помогает сохранять визуальную целостность, быстрее масштабировать страницы и поддерживать единый стиль проекта.
Основные экраны
Главная страница — Desktop
Главная страница объединяет ключевые банковские продукты, основное ценностное предложение и кредитный калькулятор. Структура помогает пользователю быстро перейти к нужному разделу, оценить условия и выбрать дальнейшее действие.
Раскрытое меню навигации
Для быстрого доступа к кредитным продуктам было разработано отдельное раскрытое меню. Оно позволяет пользователю сразу перейти к нужному сценарию без лишних переходов и одновременно демонстрирует структуру банковских сервисов.
Desktop Mega Menu
Mobile Menu
Адаптивный дизайн
Адаптивный дизайн
Интерфейс адаптирован для Desktop, Tablet в горизонтальной и вертикальной ориентации, а также для Mobile. Для каждого разрешения переработаны композиция, навигация и размеры элементов управления, чтобы сохранить удобство использования и читаемость контента на любом устройстве.
Mobile
Tablet Vertical
Tablet Horizontal
Что было сделано
От UX-структуры до системы компонентов
UX
Проработал пользовательские сценарии, структуру страниц и логику переходов между банковскими продуктами и целевыми действиями.
UI
Разработал визуальную концепцию, типографику, цветовую систему, состояния элементов и дизайн ключевых экранов.
Компоненты
Подготовил повторяемые интерфейсные элементы и единую систему компонентов для последовательного оформления ключевых экранов.
Прототип
Собрал кликабельный прототип основных пользовательских сценариев для проверки навигации и последовательности экранов.
Figma
Организовал компоненты, стили и повторяемые элементы в единой системе, чтобы упростить развитие и масштабирование проекта.
Адаптив
Полностью адаптирован интерфейс для Desktop, Tablet и Mobile.
Итоги проекта
Результат работы над концептом
В рамках проекта была создана целостная концепция банковского интерфейса: от анализа пользовательских сценариев и структуры до визуального дизайна, прототипа и системы компонентов.
UX-анализ
Проанализированы основные пользовательские сценарии, структура банковских продуктов и логика навигации между разделами.
Исследование конкурентов
Изучены интерфейсы банковских сервисов, способы подачи продуктов и распространённые UX-решения в финансовой сфере.
Прототипирование
Собрана логика ключевых экранов и переходов, а основные сценарии объединены в кликабельный прототип.
UI-дизайн
Разработана визуальная система с акцентом на читаемость, доверие, последовательную иерархию и заметные целевые действия.
Компонентный подход
Ключевые элементы интерфейса объединены в единую систему для сохранения визуальной последовательности и дальнейшего развития проекта.
Дизайн-система
Создан набор компонентов, типографических стилей и повторяемых элементов для дальнейшего развития и масштабирования проекта.
Посмотреть проект в работе
Лучший способ оценить дизайн — увидеть его в действии.
Откройте опубликованную версию проекта и познакомьтесь с интерфейсом, навигацией, адаптивностью и взаимодействием элементов так, как это увидит реальный пользователь.
🚀 Посмотреть сайт в работе