Нужная деталь — для вашей техники. Спроектировали и разработали каталог мотозапчастей, который переводит сложные данные поставщиков в понятный путь: выбрать мотоцикл, проверить совместимость и отправить заказ на подтверждение.
Одного названия детали недостаточно. Нужно учесть модель, год выпуска, модификацию и данные поставщика. Задача — организовать большой каталог так, чтобы покупатель не терял выбранную технику и понимал, на чём основана совместимость, цена и наличие.
Собрали три входа в каталог: по технике, по номеру детали и по категории. Связали подбор с фильтрами и карточкой товара, развели подтверждённые сведения и то, что нужно уточнить. Финальный шаг — заявка с проверкой условий, а не обещание покупки по устаревшей цене.
Интерфейс строится вокруг одного вопроса: подойдёт ли эта деталь моей технике? Выбранный мотоцикл становится контекстом каталога, а не разовым фильтром, который приходится настраивать заново.
Показываем путь на примере Honda CB 500 2003 года: от выбора модели — к списку совместимых деталей, сравнению предложений и проверке конкретного фильтра.
Знаете артикул — используйте поиск по номеру. Знаете мотоцикл — начните с подбора по технике. Изучаете ассортимент — перейдите в категории. Главная не заставляет всех покупателей проходить один и тот же сценарий.
Цифры выше описывают снимок каталога поставщика от 15 сентября 2026 года. Это объём данных, не продажи и не количество товаров в наличии. Совместимость есть не у каждой позиции — интерфейс учитывает это ограничение.
Марка, модель, год, модификация — последовательный подбор не перегружает экран всеми параметрами сразу. Следующий выбор зависит от предыдущего, а выбранная техника сохраняется для дальнейшей работы.
Из подбора пользователь попадает в каталог с включённым режимом «Только совместимые». Модель остаётся на виду: легко проверить контекст или сменить мотоцикл.
Карточки помогают узнавать детали по фотографии и изучать ассортимент. Таблица собирает название, совместимость, срок и цену в плотные строки — удобный формат для быстрого сравнения.
Категории, производитель, наличие и диапазон цен работают вместе с контекстом техники. Переключение представления не требует начинать поиск заново.
У детали есть не только фотография и цена. В карточке видны производитель, артикул, источник предложения и дата данных. Предложения поставщика отделены от описания, а совместимость вынесена в самостоятельный блок.
Цена «от» и статус наличия не выдаются за окончательные условия сделки. Пользователь заранее видит, что стоимость и доступность подтверждаются при обработке заказа.
Показываем модели и годы выпуска из доступных данных поставщика, а не ставим универсальный зелёный бейдж на весь каталог. Пользователь может увидеть источник и проверить, совпадает ли его техника с указанным диапазоном.
Если данных недостаточно, следующий шаг — помощь в подборе по VIN, модели или фотографии. Неопределённость становится понятным действием, а не тупиком.
Поиск по номеру и поиск по названию решают разные задачи. Для артикулов убираем различия в регистре и разделителях, но не подменяем точный номер приблизительно похожим. Для текстовых запросов предусмотрены синонимы и устойчивость к опечаткам.
Каталог, фильтры и карточка опираются на общую структуру данных. Если источник не сообщает совместимость или наличие, приложение не дорисовывает эти сведения.
Графит, белые поверхности и красный акцент связывают интерфейс с миром мототехники. Крупная фотография задаёт характер на входе, а внутри каталога визуальная система становится спокойнее: меньше декора, больше пространства для характеристик и сравнения.
Адаптивная сетка и последовательный подбор сохраняют приоритет главного действия на небольших экранах. Движение в интерфейсе помогает переключать состояния; оно не должно мешать искать детали.
Графит. Металл. Красный акцент.
Приложение построено на Next.js, React и TypeScript. Серверные маршруты связывают каталог и заявки, поисковый слой поддерживает OpenSearch с резервным локальным поиском. Метаданные и структурированные данные формируются на уровне страниц.
Публикация включает проверку работоспособности новой версии и возможность отката. Техническая основа оставляет место для роста ассортимента и развития сценариев без переизобретения каталога.
Запущен единый путь от выбора техники до заявки на заказ: подбор, поиск, фильтры, два представления каталога и карточка с проверяемыми данными. Motobase помогает разобраться в ассортименте и вовремя уточнить то, что нельзя определить автоматически.
Вместо разрозненного прайса — инструмент для осмысленного выбора. Следующий этап развития можно строить на этой основе: расширять данные совместимости, ассортимент и сценарии повторных заказов.
