not the same
● E-commerce · Автозапчасти · Украина

Panda Auto Parts: магазин автозапчастей с нуля и около пяти редизайнов

Panda Auto Parts продаёт запчасти для Chery, Geely, Great Wall, BYD, Zeekr, Tesla, электромобилей Volkswagen и других марок, а также автотовары. Мы разработали магазин с нуля и провели около пяти редизайнов: от первой версии с акцентом на три популярные модели до текущего каталога по 13 маркам.

Клиент
Интернет-магазин автозапчастей, Украина
Что сделали
Разработка с нуля, около пяти редизайнов
Стек
Laravel, Vue.js, PHP
Сайт
panda-auto.com.ua
Проект Panda Auto Parts
01 О проекте

Магазин начинался с запчастей к китайским авто и рос вместе с рынком: сейчас в каталоге марки от Chery и Lifan до Zeekr, BYD и Tesla. Покупатель обычно ищет деталь под конкретную машину, поэтому весь каталог строится от марки и модели. Мы сделали первую версию магазина и затем провели около пяти редизайнов, каждый раз упрощая подбор и оформление заказа.

Что сделали
UX/UI-дизайнРазработка с нуляРедизайныКаталог по маркам и моделямОформление заказаПоддержка
Технологии
LaravelVue.jsPHPUI/UX
02 Дизайн

Стиль

Фирменный зелёный и талисман-панда в логотипе. Текущая версия светлая: серый фон, белые карточки, зелёные кнопки покупки и цветные бейджи «Panda рекомендует», «Гарантия», «Топ продаж».

Фирменный зелёный
#26A600
Кнопки
#208E00
Фон
#F2F2F2
Карточки
#FFFFFF
Текст
#000000
Бейдж гарантии
#FFA309
ШрифтыGotham Pro
03 Экраны

Было: первая версия

Первый дизайн из Figma: боковая панель «Машины / Запчасти», быстрые входы в каталоги Chery Amulet, Geely CK и Geely MK, корзина-шторка с рекомендациями и оформление с Новой почтой, самовывозом и курьером по Харькову.

Главная
Карточка товара
Карточка товара
Корзина
Корзина
Оформление заказа
Оформление заказа
04 Экраны

Стало: текущий сайт

Сейчас на главной меню с вкладками «Машины», «Запчасти», «Автотовары», логотипы 13 марок, баннеры акций, рекомендованные товары, запчасти для ТО и видео с YouTube-канала магазина.

Главная
05 Мобильная версия

Мобильная версия

На телефоне поиск всегда в шапке, марки – плиткой, разделы модели раскрываются аккордеоном, а кнопки «Купить» и «Купить в 1 клик» стоят сразу под ценой.

Главная
Главная
Каталог модели
Каталог модели
Карточка товара
Карточка товара
06 Задача

Задачи

  • 01Подбор под машинуДать путь марка → модель → группа запчастей, чтобы человек видел только то, что подходит к его авто.
  • 02Доверие к деталиПоказать качество (оригинал, лицензия, аналог), страну, производителя, срок гарантии и применимость прямо в карточке.
  • 03Быстрый заказСократить оформление до одной страницы и добавить покупку в 1 клик.
  • 04Развитие дизайнаПровести около пяти редизайнов без остановки продаж, подстраивая магазин под новые марки и ассортимент.
07 Ключевые решения

Ключевые решения

Подбор по марке и модели
Решение 01

Подбор по марке и модели

Каталог начинается с марки и модели: Chery Tiggo 7, Geely Emgrand, BYD Song Plus, Zeekr 001 и десятки других. На странице модели группы запчастей с иллюстрациями: тормозная система, двигатель, электрика, ТО, коробка передач, кузов, охлаждение, подвеска. Поиска по VIN на сайте нет: есть поиск по названию, артикулу или коду с выбором области.

Фильтры и листинг
Решение 02

Фильтры и листинг

Слева фильтры по производителю с поиском, наличию (включая «Отправка сегодня» и «Ожидаем поставку»), качеству (аналог, лицензия, оригинал), гарантии от 1 до 12 месяцев и цене. В карточке листинга бейджи, флаг страны, логотип бренда, рейтинг и применимость с объёмом двигателя; сортировка по популярности, названию, цене и рейтингу.

Карточка товара
Решение 03

Карточка товара

Код и артикул, артикулы заменителей, применимость по модели и двигателю, страна производства, гарантия. Рядом кнопки «Купить» и «Купить в 1 клик», избранное, сравнение, способы доставки и оплаты, срок отправки. Вкладки характеристик, описания и отзывов, ниже похожие товары.

Оформление заказа
Решение 04

Оформление заказа

Одна страница без лишней навигации: данные покупателя, город с подсказками популярных городов, способ оплаты (при получении, предоплата по IBAN, онлайн картой, Google Pay, Apple Pay, Privat24), промокод и итог заказа справа.

08 Стек

Интеграции и стек

LaravelVue.jsPHPNova PoshtamonobankGoogle PayApple PayPrivat24Оплата по IBANBinotelGoogle Tag ManagerMeta PixelTikTok PixelYouTube

Хотите такой же проект?

Опишите задачу – в течение рабочего дня ответим с вопросами и предварительной оценкой сроков.

Ответим в течение рабочего дня
Написать нам