Сайт для digital-агентства I’Brand

Главное о кейсе

I’Brand — digital-агентство c performance-подходом к продвижению. Они помогают бизнесу выстраивать эффективный маркетинг, повышать продажи и формировать ценность в глазах аудитории. За 17 лет агентство завоевало доверие крупных компаний благодаря успешным проектам, полученным наградам и высоким позициям в рейтингах. Задача заключалась в том, чтобы обновить сайт и сделать его более удобным.

Как проект изменил жизнь пользователей

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

Бизнес-задача и ее решение

Обновление сайта помогло стильно и эффективно показать оригинальные решения, успешные кейсы и результаты рекламных кампаний.
Главная страница сразу демонстрирует экспертность I’Brand, показывая награды и список клиентов. Мобильная версия сайта полностью сохраняет эстетику и функционал десктопа на маленьком экране.
Страница услуги в виде компактной плитки демонстрирует экспертизы агентства. При нажатии на карточку можно увидеть подробное описание и объяснение, почему данный инструмент работает и для каких типов клиентов/проектов подходит.

Крафт (мастерство), реализация, технические детали

Нам нужно было придумать, как создавать блоки с уникальным градиентом каждый раз. Изначально хотели сделать это на canvas, разработав интересный скрипт для движения в реальном времени, но это оказалось слишком ресурсоемким, так как градиентов было много. В итоге мы разработали плагин в After Effects, который генерировал базовый паттерн градиента за один клик. Мы выгружали его в формате PNG, оптимизировали и загружали через админку сайта в блок. Далее через настройки блока можно было регулировать интенсивность кривизны, скорость, степень искажения с помощью специальных регуляторов. Таким образом, картинка менялась через обычные трансформ-свойства, не расходуя ресурсы. Клиент мог создавать новые уникальные градиенты и настраивать их стиль поведения без нашей помощи.

Инсайты, гипотезы, процесс создания и взаимодействия с заказчиком

Сложность заключалась в том, что мы работали без айдентики — брендбук клиента еще не был готов. Мы предложили сделать диджитал спейс с интересным градиентом в After Effects, который по простому алгоритму может менять свою скорость и кривизну, оставаясь при этом в цветовой гамме. Клиенту это очень понравилось, и они даже взяли дизайн-концепцию сайта за основу для брендбука.

Скриншоты