Разработка сайта-каталога промышленного клея

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

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

ООО «КлибТехник» — поставщик промышленного клея для мебельной промышленности и деревообработки. Компания работает с клеями для кромкооблицовки, профильного погонажа, мембранно-вакуумного прессования, ПВА-дисперсиями, контактными клеями, материалами для матрасов, упаковочной промышленности и сопутствующими продуктами.

Компания — официальный дистрибьютор LAB Industries. КлибТехник делает акцент не только на поставке материалов, но и на техническом сопровождении: помогает с производственными испытаниями, подбором продуктов и настройкой технологических процессов.

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

• Каталог промышленного клея. Клиенты быстрее находят продукцию под конкретное производство и тип материала.

• Фильтрация и структура товаров. Технологам, закупщикам и мастерам проще ориентироваться в ассортименте.

• Карточки с характеристиками. Клиент видит свойства, область применения и описание продукта до обращения к менеджеру.

• Формы заявок. Сайт упрощает первый контакт и снижает потери потенциальных B2B-заказов.

• Интеграция с Битрикс24. Обращения быстрее попадают в работу отдела продаж.

• Адаптивная версия. Каталог удобно смотреть с компьютера, планшета и смартфона.

Этап 1. Маркетинг

Перед проектированием мы разобрали бизнес клиента по методологии 3К: компания, клиенты, конкуренты. В B2B-нише промышленного клея важно не просто показать товары, а помочь клиенту понять, какой продукт подходит под его оборудование, материал и производственную задачу.

• Провели интервью с заказчиком.

• Изучили ассортимент промышленного клея.

• Проанализировали маркетинговые и рекламные материалы.

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

• Выделили сильные стороны: официальный дистрибьютор, техническое сопровождение, помощь в подборе и опыт работы с производственными задачами.

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

• Изучили потребности аудитории: стабильная склейка, совместимость с оборудованием, понятные характеристики, надежные поставки, консультации специалистов.

• Выявили боли и страхи: простой оборудования, перерасход клея, неподходящая вязкость, слабая прочность склейки, риск выбрать материал без технической поддержки.

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

• Проанализировали 15 сайтов конкурентов.

• Изучили, как конкуренты показывают ассортимент, характеристики, формы заявок и техническую информацию.

• Собрали 34 идеи для структуры каталога, карточек товаров, контентных блоков и сценариев обращения.

• 3 аватара клиента
• анализ конкурентов
• список из 34 идей
• понимание, как превратить каталог в инструмент B2B-продаж

Этап 2. Проектирование

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

• Главная страница.

• Каталог продукции.

• Карточки товаров.

• Новости.

• Контакты.

• Каталог товаров.

• Карточка товара с фото, характеристиками, областью применения и описанием.

• Формы заявок.

• Контакты с картой и режимом работы.

• Раздел новостей.

• Интеграция с Битрикс24.

• Управление контентом через CMS.

Функции, которые нельзя было полностью показать в прототипах, мы описали в техническом задании: без двусмысленностей, повторов и лишних технических формулировок.

• прототипы
• техническое задание
• сайт получил понятную структуру для B2B-клиентов: от выбора категории клея до отправки заявки

Этап 3. Дизайн сайта

Дизайн нужно было сделать не декоративным, а функциональным: сайт должен вызывать доверие у производственных клиентов и помогать быстро работать с технической информацией.

• Согласовали визуальную концепцию.

• Разработали дизайн сайта для компьютера.

• Подготовили адаптивные макеты для смартфонов и планшетов.

• Проработали UX-элементы форм заявки.

• Подобрали фотоконтент с продукцией.

• Сделали акцент на каталоге, характеристиках и понятной структуре.

Этап 4. Верстка

После утверждения дизайна мы сверстали страницы с акцентом на стабильность, адаптивность и скорость. Для B2B-каталога важно, чтобы сайт одинаково удобно работал и на рабочем компьютере закупщика, и на смартфоне мастера на производстве.

• Сверстали макеты на HTML, CSS и JavaScript.

• Адаптировали сайт под экраны от 320 до 1920 пикселей.

• Проверили отображение в популярных браузерах.

• Оптимизировали изображения.

• Настроили кеширование.

• Добились высокого показателя загрузки по PageSpeed Insights.

Результат: 

• сайт быстро загружается и корректно работает на разных устройствах
• клиенты могут изучать каталог и отправлять заявки без технических сбоев

Этап 5. Разработка back-end

Мы собрали техническую основу сайта на 1С-Битрикс и связали каталог, формы заявок, контент и CRM с бизнес-процессами отдела продаж.

• Развернули платформу 1С-Битрикс, лицензия «Стандарт».

• Настроили каталог товаров.

• Реализовали карточки товаров с фото, характеристиками, областью применения и описанием.

• Добавили раздел новостей.

• Настроили контакты: адрес, email, телефон, карта, часы работы.

• Подключили формы заявок.

• Настроили интеграцию с Битрикс24.