Интерфейс «Промсвязьбанка» для корпоративных клиентов
«Промсвязьбанк» — один из десяти крупнейших банков в России. Он существует уже четверть века. Банк обслуживает 2,5 миллиона человек и около 200 тысяч компаний.
Мы разработали интерфейс онлайн-банка для корпоративных клиентов. Получился сдержанный дизайн в фирменных цветах «ПСБ».
Авторизация
Первым же экраном мы хотели создать у пользователя ощущение спокойствия и при этом сделать страницу сдержанной. Для этих целей хорошо подошел пейзаж.
Главный экран
Чтобы в личном кабинете сразу была видна цельная картина, мы собрали основные данные о компании на одном дэшборде. Так пользователю не нужно заходить в несколько разных разделов, чтобы узнать, сколько у компании денег, как дела с остатками по счетам и не было ли новых писем от банка.
Изначально мы планировали сделать графики крупней и ярче. Получилось эффектно, но мы отказались от этой идеи, чтобы сделать интерфейс более привычным для корпоративных клиентов.
Счета
Мы заложили поддержку быстрого переключения между счетами разных компаний.
Прокрутка реализована внутри блоков, левое меню и шапка с заголовком компании по центру остаются всегда на виду. Так мы снизили кол-во ошибок в ходе которых пользователь совершал действие, забыв под какой компанией он залогинен.
Прокрутка реализована внутри блоков, левое меню и шапка с заголовком компании по центру остаются всегда на виду. Так мы снизили кол-во ошибок в ходе которых пользователь совершал действие, забыв под какой компанией он залогинен.
Информация по счету
Информация по счету в белом всплывающем окне как будто напечатана на настоящем листе бумаги.
Пользователь может менять только заголовок и описание счета, поэтому мы не стали вводить режим редактирования по кнопке «редактировать счет». Зато можно менять текст частями. Пока пользователь перезаполняет поля, страница остается неподвижной — не перезагружается и даже не дергается.
Пользователь может менять только заголовок и описание счета, поэтому мы не стали вводить режим редактирования по кнопке «редактировать счет». Зато можно менять текст частями. Пока пользователь перезаполняет поля, страница остается неподвижной — не перезагружается и даже не дергается.
Экспорт выписки
В приложении можно быстро получить выписки со счетов в самых разных форматах. Штамп банка ставится по клику мыши.
Чтобы пользователю было легче выбрать, за какое время ему нужна выписка, мы вынесли из календаря самые популярные диапазоны.
Чтобы пользователю было легче выбрать, за какое время ему нужна выписка, мы вынесли из календаря самые популярные диапазоны.
Платежи
Остатки по счетам пользователь должен видеть сразу, поэтому мы выделили их за счет шрифта и кегля.
Детальный перечень платежей набран мельче, чем остатки.
Платежей обычно много, поэтому мы собрали их в многостраничную таблицу. К каждой строке мы добавили чекбокс — так пользователь может совершать действия с несколькими платежами сразу.
Навигация по страницам и отображение кол-ва записей сделаны по старинке — как в классическом поисковике. Когда речь о деньгах, консервативные методы — это не стыдно.
Навигация по страницам и отображение кол-ва записей сделаны по старинке — как в классическом поисковике. Когда речь о деньгах, консервативные методы — это не стыдно.
E-DOC
Это система электронного документооборота. В ней получают и отправляют письма. Здесь же меняют настройки доступа к документам.
Разделом пользуются и сотрудники банка тоже, так что мы прорабатывали интерфейс для двух отдельных групп пользователей. Получились десятки страниц, на разработку которых ушло 500 часов.
Разделом пользуются и сотрудники банка тоже, так что мы прорабатывали интерфейс для двух отдельных групп пользователей. Получились десятки страниц, на разработку которых ушло 500 часов.