✔ С первого экрана представить YERO COLORS как производителя красителей и кондитерского декора
✔ Провести оптового покупателя по девяти категориям продукции к нужному товару
✔ Показать состав, фасовку, срок годности и сферы применения каждого продукта
✔ Рассказать о сертификации ISO 22000, собственном производстве и экспорте
✔ Собирать запросы образцов, заявки на звонок и подписчиков рассылки
✔ Предложить выпуск продукции под собственной маркой клиента
YERO COLORS — торговая марка одесской компании, которая с 2019 года сама производит гелевые, сухие блестящие и жирорастворимые красители, красители для аэрографа, ароматизаторы, сахарную пудру, мастику и айсинг. Продукция сертифицирована по ISO 22000, а покупатели — реселлеры, кондитерские производства, магазины и кондитерские школы в Украине и за рубежом. Бренду нужен был сайт, который покажет весь ассортимент и приведёт оптового клиента к запросу.
Я разложил информацию по разделам, как её ищет закупщик: на главной — преимущества и новинки, в «Компании» — профиль, производство, сертификация и экспорт на вкладках, в каталоге — девять категорий и подробная карточка продукта, отдельно — условия сотрудничества с бонусной сеткой.
Получился двуязычный сайт с переключателем УКР/ENG, адаптивной версией для смартфонов от 320 пикселей, вкладками, слайдерами, всплывающим окном «Заказать звонок» с экраном благодарности, боковой кнопкой запроса образцов, скачиванием каталога и формой подписки на каждой странице.
Сайт, на котором оптовый покупатель находит продукт, проверяет состав и сертификаты и сразу запрашивает образцы.
Категории переключаются вкладками: красители, пудра и айсинги, мастика, посыпки, фасовка под заказ
Описание, состав, срок годности, фасовка, сферы применения и кнопка «Скачать каталог»
Разработка продукта под заказ и выпуск под маркой клиента на мощностях компании
Профиль, собственное производство, сертификация ISO 22000 и экспорт — без лишних переходов
Боковая кнопка запроса образцов, окно «Заказать звонок» с благодарностью и подписка с согласием
Переключатель УКР/ENG и адаптивная вёрстка от 320 пикселей с выпадающим меню
Оптовый клиент видит весь ассортимент, проверяет состав и сертификаты и связывается с компанией, не уходя со страницы.
Сайт решает несколько основных задач:
Ответ гарантированно в течение 24 часов.
Первая консультация бесплатна и ни к чему не обязывает.
Сайт производителя работает как каталог, презентация и отдел продаж одновременно: закупщику нужно быстро найти продукт, убедиться в качестве и понять условия. На примере YERO COLORS рассказываю, как я сделал сайт с каталогом пищевых красителей, подробными карточками, блоком private label, разделом о компании и формами для оптовых клиентов.
YERO COLORS — торговая марка компании, основанной в Одессе 14 февраля 2019 года. Она сама производит гелевые водорастворимые красители — классические, блестящие и на натуральной основе, — красители для аэрографа, сухие блестящие и жирорастворимые красители в дропсах на какао-масле, ароматизаторы, сахарную пудру премиум-класса, мастику для моделирования, айсинг и сахарный декор «Жемчуг». Продукция сертифицирована по ISO 22000, проходит лабораторный контроль, а с 2022 года у компании собственное производство и склад в Одессе и склад в Черновцах.
Покупатели YERO COLORS — реселлеры, розничные магазины, кондитерские производства и учебные заведения, а также зарубежные дистрибьюторы. Им нужен был сайт, на котором видно весь ассортимент, есть характеристики каждого продукта, понятные условия сотрудничества и простой способ запросить образцы. Я сделал этот сайт: сверстал все страницы, собрал вкладки, слайдеры, всплывающие окна и формы и адаптировал его под смартфоны.
Меню повторяет путь оптового покупателя — от знакомства с брендом до заказа:
Шапка общая для всех страниц: логотип, меню, переключатель языков УКР/ENG, иконки Facebook и Instagram и кнопка «Заказать звонок». Внутренние страницы начинаются с хлебных крошек и крупного заголовка, а внизу каждой страницы — форма подписки и подвал с меню, адресом, телефоном и почтой.
Первый экран — крупный заголовок «Натуральные красители для промышленности», ряд флаконов гелевых красителей на синей плашке и фото десертов, окрашенных продукцией бренда. Подсказка «листай вниз» ведёт к блоку преимуществ.
Преимущества собраны в список с разделителями — каждое отвечает на вопрос закупщика:
Ниже — блок «Новинки»: три крупные карточки, например новые оттенки гелевых красителей и линейка GEM YERO COLORS с девятью «драгоценными» цветами от аметиста до бронзы. При наведении название карточки и стрелка подсвечиваются фирменным синим. Под карточками — широкая кнопка «Перейти в каталог». У главной несколько состояний: обычное, с открытым окном «Заказать звонок» (имя и телефон) и с экраном благодарности после отправки.
Каталог — главная рабочая страница сайта. Девять категорий — гелевые и жирорастворимые красители, сахарная пудра и айсинги, кондитерские ингредиенты и сырьё, ароматизаторы, мастика, сухие блестящие красители, сахарные посыпки и фасовка под заказ — переключаются вкладками, без перезагрузки страницы.
Карточка продукта собирает всё, что закупщик обычно уточняет у менеджера. На примере AIRBRUSH SPARKLE — жидких блестящих красителей для аэрографа:
Справа на каталоге закреплена яркая вертикальная кнопка «Запрос образцов продукции»: она остаётся на экране при прокрутке, и попросить образец можно в любой момент, не теряя карточку из виду.
Для крупных клиентов у YERO COLORS есть отдельное предложение — выпуск продукции под собственной маркой. На сайте ему отведён блок Private Label с двумя направлениями: разработка собственного продукта под заказ и выпуск продукции под маркой клиента на мощностях компании. Каждое направление оформлено строкой со стрелкой, а рядом — фото упаковок: сахарный жемчуг, мастика в коробках, гелевый краситель. Так клиент сразу видит, как может выглядеть его собственная линейка.
Сайт сверстан адаптивно, начиная с экранов шириной 320 пикселей. На смартфоне меню прячется в выпадающую панель с переключателем языков и контактами, карточки новинок и категорий выстраиваются в одну колонку, вкладки каталога и раздела «Компания» остаются удобными для пальца, а формы подписки и заказа звонка — на своих местах.
Внешне сайт строгий: белый фон, чёрные рубленые заголовки, фирменный синий и сочные цвета самой продукции — фиолетовый, мятный, розовый, золотой. Контурные надписи ™ YERO COLORS и стрелки-указатели повторяются на всех страницах, поэтому при вёрстке я собрал повторяющиеся элементы — шапку, вкладки, списки с маркерами, карточки, формы — как общие блоки.
Оптовый покупатель выбирает поставщика не по картинкам, а по составу, документам и условиям. Сайт производителя должен отвечать на эти вопросы раньше, чем закупщик возьмётся за телефон. Создавая такой сайт, я опираюсь на несколько принципов:
Если вам нужен сайт для производственной компании, дистрибьютора или бренда пищевых ингредиентов, я помогу собрать его целиком — от структуры каталога до карточек продукции, форм заявок и мобильной версии.
