Foreman: спортивный сайт для B2B продаж

Если ваш фитнес-клуб знает толк в спортивном инвентаре, то вы уже знакомы с компанией, сайту которой посвящен этот кейс. Он о российском производителе спортивного оборудования Foreman. Ребята делают тренажеры, аксессуары, мебель для спортивного инвентаря и одежды, оборудование для игр и единоборств. Кроме фитнес-клубов Foreman работает с медицинскими центрами и армией — клиентами, требующими особого подхода.

Задачи

• Создать современный привлекательный дизайн на основе нового фирменного стиля, сформировать имидж ведущего производителя спортивного оборудования в России.
• Представить широкой клиентской аудитории товары и услуги компании: сделать удобный каталог и поиск по нему.
• Обеспечить обратную связь с потенциальными клиентами и партнерами.
• Организовать приватную презентацию военных проектов заинтересованным лицам.

Дизайн
В дизайне отталкивались от фирменного цвета Foreman — красного. И первым желанием было замиксовать его с черным, сделать стильно, броско, но строго. Но после мудборда выяснилось, что много черного нельзя — директор (который принимает решение) скажет, что это траур. Мы постарались соблюсти баланс: не стали совсем отказываться от черного, а вторым основным цветом сделали нейтральный серый.

Заказчик Foreman пришел с готовым контентом. Обработанные снимки для слайдера на главной, снимки объектов с оборудованием Foreman, чистенькие фотографии для каталога — все уже было готово.

Разработка
У каталога три уровня вложенности: категория товаров (например, кардиотренажеры), вид товара (степперы, велотренажеры и т. д.) и фильтрация по отрасли использования (медицина, армия, фитнес-центры).

Для каждой категории товаров — а их 9 — дизайнер нарисовал иконки, а разработчики научили их по-спортивному подпрыгивать при наведении курсора.

Подробное описание товара выводится прямо в каталоге при наведении мыши. Появляются габариты, цвета, описание и кнопка для добавления в корзину. Когда выводится информация, плитка с товаром затемняется и по-эппловски размывается — красота!

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

Второй по важности после каталога раздел — «Проекты». Здесь показаны объекты, которые оборудованы изделиями Foreman. Заказчик предоставил реальные фотографии, и мы решили акцентировать на них внимание, показав не на отдельной страничке, а в аккуратном фэнсибоксе.

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

Готовый проект: http://www.foremanfitness.ru/

Подробнее о процессе разработки читайте в блоге scrum-студии «Сибирикс» — http://blog.sibirix.ru/2016/11/14/foreman/