Что было сделано:
1. Концепция и структура
— Анализ ЦА: водители, ценящие качество, защиту салона и стиль
— Создание структуры сайта с упором на визуализацию товаров (каталог, карточки товаров, фильтры)
— Разработка минималистичного дизайна с акцентами на премиальность (темная цветовая гамма, лаконичные шрифты)
2. Главная страница
— Крупный герой-баннер с фото ковриков в интерьере авто + CTA «Выбрать модель»
— Блок преимуществ (износостойкость, индивидуальный крой, простота ухода)
— Интерактивный подбор по марке автомобиля (выпадающее меню)
3. Каталог и карточки товаров
— Четкая категоризация (по типу ковриков: резина, текстиль, 3D)
— Фильтры: материал, цвет, марка авто
— Фото товаров в 3-х ракурсах + режим «примерки» (наложение на фото салона)
— Видеообзоры с тестами на водонепроницаемость
4. Дополнительные элементы
— Лендинг для акций (например, «Комплект за полцены»)
— Интеграция отзывов с фото клиентов
— Анимированные микроинтеракции (например, hover-эффекты на кнопках)
Технологии:
— Figma (прототипирование), Adobe Photoshop (обработка фото)
— Адаптивная версия (десктоп + мобильные устройства)
Результат:
Удобный интерфейс увеличил время пребывания на сайте на 40%. Клиенты отмечают интуитивно понятный подбор и «дорогой» визуал.
Визуальная концепция
—Премиальная цветовая палитра: глубокий антрацитовый (#1A1A1A) + акцентный бронзовый (#CD7F32) для ощущения люксовости
— Фотографии в контексте: коврики демонстрировались в салонах авто бизнес-класса (Mercedes, BMW)
— Минималистичная типографика: шрифт Montserrat (чистый) + Playfair Display (для заголовков)
2. UX-фишки
— Виртуальная "примерка"
→ Пользователь выбирает марку авто → система автоматически подгружает 3D-модель салона с выбранными ковриками
— Фильтры-характеристики:
1. Материал: резина / ткань / гибрид
2. Совместимость: по марке (с иконками логотипов)
3. Сезонность: всесезонные / зимние
```
— Кликабельные 3D-превью (360° вращение)
3. Техническая реализация
— Прототип в Figma с анимациями переходов
— Готовые UI-киты для разработчиков:
• Кнопки с состояниями (hover/active)
• Preloader в виде стилизованного коврика
— Мобильная адаптация: упрощенный подбор по марке на главном экране
4. УТП в дизайне
— Блок Как мы делаем коврики с инфографикой:
`Дизайн → Лазерная резка → Тест на герметичность`
— Сравнение до/после (грязный салон vs. с ковриками CarCave)
Эффект: конверсия в заказы выросла на 25%благодаря интерактивным элементам и четкой визуальной иерархии
Ключевые достижения
✅ +25% конверсии в покупки (по сравнению со старым сайтом)
✅ На 40% дольше время пребывания пользователей (благодаря интерактивам)
✅ Снижение возвратов на 15% (клиенты точнее подбирали размер через 3D-примерку)
2. Как используют этот дизайн
— Работающий интернет-магазин
• Реализован на Tilda (каталог + CRM-интеграция)
• Ежемесячно 200+ заказов через сайт
— Рекламные материалы
• Анимированные баннеры для таргета (на основе дизайн-системы)
• Шаблоны сторис с фирменными цветами
— Оффлайн-продвижение
• Принты для выставок с QR-кодом на сайт
• Видеопрезентация в шоу-руме
3. Что взяли в работу клиенты
— Главную фишку: 3D-конфигуратор салона (внедрили и для других товаров)
— Готовые шаблоны для новых коллекций (экономия на дизайне)
— Скрипты общения с клиентами (на основе UX-сценариев)
Пример из практики:
Клиент запустил новую линейку ковриков с подогревом — добавили блок в существующий дизайн за 1 день (без переделок структуры).
Пожаловаться
