Разработали единый визуальный стиль, который позволяет оперативно создавать новые диджитал-продукты заказчика

«Финам» — крупнейшая инвестиционная группа в России. Компания занимается трейдингом, финансами, а еще оказывает банковские услуги.

Мы помогли команде заказчика сделать дизайн-систему и UI Kit, чтобы они экономили время на разработке диджитал-продуктов и все продукты были в одном стиле.

Что было не так

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

Задачи

Создать новый визуальный стиль диджитал-продуктов «Финам».
Привести все диджитал-продукты «Финам» к единому стилю и учесть требования брендбука компании.
Подготовить UI Kit (набор готовых решений), который дизайнеры «Финам» смогут использовать без долгого погружения в продукт.

Переработали главную страницу

В первую очередь мы решили изменить дизайн главного новостного продукта «Финам». Наша команда переработала цвета и структурировала информацию.

Разработали шаблонные блоки для конструктора лендингов

Под каждый новый продукт «Финам» делает новый лендинг. Чтобы команда не тратила на это время, мы разработали большую систему блоков и компонентов.

Мы предусмотрели все возможные темы и задачи. Под каждую придумали визуальное решение: шрифты, цвета, кнопки и контрастные экраны.

В итоге получилось 30 блоков. С их помощью можно рассказать о любом продукте компании.

Все посадочные страницы «Финам» теперь имеют единый стиль.

Переработали дизайн «Финам-Банка»

«Финам-Банк» входит в состав инвестиционного холдинга «Финам». Это универсальный коммерческий банк, который оказывает полный спектр услуг. Мы обновили его дизайн. Теперь он соответствует общему визуальному стилю и брендбуку холдинга «Финам». А если понадобятся новые страницы, их можно сделать из готовых компонентов дизайн-системы.

Обновили дизайн мобильного приложения «Финам-Банка»

Мобильное приложение Finambank Mobile — мобильный сервис инвестиционного холдинга «Финам» для простого и удобного доступа к банковским продуктам и услугам.

Вот что мы сделали:

привели мобильное приложение к единому стилю «Финам»;
разработали иконки, баннеры и сторис;
добавили варианты экранов с темной и светлой темой;
разработали компоненты, которые используются только в мобильном приложении: отображение баланса на карте, переводы и сбережения;
просмотр телефона работодателя.

Обновили дизайн учебного  центра «Финам»

Учебный центр «Финам» — очные и онлайн-курсы для начинающих и опытных инвесторов. Мы обновили главную страницу, разработали каталог и детальные страницы курсов.

Переработали детальную страницу курса

Мы изменили формат подачи материалов — добавили время, которое потребуется на прохождение курса, добавили фильтры по содержанию.

Было/стало

Мы проделали огромную работу при создании этого инструмента, и мы уверены, что он станет незаменимой помощью для талантливых дизайнеров «Финам». Наш UI Kit не только способствует унификации визуальной коммуникации с пользователями, но также предоставляет широкий арсенал визуальных элементов, гармонично сочетающихся между различными цифровыми продуктами. Мы уверены, что это поможет командам «Финам» продолжать развивать и создавать удивительные и полезные продукты, находясь на передовой в мире финансов и технологий.

Дмитрий Курамшин

Директор по бизнес-процессам AGIMA

Дизайн-система

Мы создали набор правил, которые помогут «Финам» поддерживать единство дизайна всех финансовых диджитал-продуктов.

Мы объединили все аспекты цифрового дизайна:

стили типографики и палитры цветов;
принцип построения иконок;
компоненты кнопок.

А еще создали готовые контентные блоки, из которых можно собирать страницы и лендинги.

Результаты

Количественное исследование интерфейса сайта и аудит поведения пользователей
Интервью с бизнес-заказчиками и проектирование
Две дизайн-концепции и выбор дизайн-макета
Мы уже передали заказчику все артефакты. Скоро они будут интегрированы в их диджитал-продукты.

Над проектом работали

Команда AGIMA

Наталья Тарасова

Руководитель проектного офиса
Дарья Давидова

Руководитель проекта
Константин Кислейко

Дизайн-директор
Дмитрий Курамшин

Директор по бизнес-процессам
Дмитрий Кожевников

Арт-директор
Наталья Шарова

Дизайнер

Команда «Финам»

Екатерина Лисецкая

Креативный директор
Борис Аксенов

Руководитель отдела управления  разработки веб- и мобильных приложений
Глеб Голованов

Руководитель учебного центра
Яна Ромашкина

Директор по маркетингу
Дмитрий Ващинников

Руководитель группы UX-UI
Александр Непорожний

Член Правления, Заместитель Председателя  Правления АО «Банк ФИНАМ»
Сергей Кудряшов

Заместитель генерального директора,  руководитель службы Finam.ru
Ирина Илюшина

Руководитель Лаборатории  клиентского опыта

Дизайн-система для инвестиционного холдинга «Финам»