rgb(113, 151, 65)
Все кейсы
ZI
FMCG · Next.js / React
ZI
NUS
Цифровая витрина бренда растительных продуктов — от выбора состава и линейки до рецепта и точки продаж.
ZINUS — единая продуктовая экосистема бренда растительных напитков и альтернатив молочной продукции.
Проект объединяет задачи двух адресов бренда — zinus.su и zinus-vegan.ru. Сегодня основной каталог работает на zinus-vegan.ru, а первый домен направляет посетителя в актуальную цифровую экосистему.
На платформе представлены напитки, сливки, протеиновые продукты и йогуртовые закваски на основе кокоса, миндаля, фундука, овса, сои и других растительных ингредиентов. Каталог можно изучать по составу и линейкам, а карточки раскрывают свойства, пищевую ценность и варианты использования.
Рецепты, история бренда, точки продаж и партнёрские формы связывают продуктовую коммуникацию с реальными сценариями покупки и дистрибуции.
Визуальная система
Четыре основных цвета
Природные зелёные оттенки поддерживают продуктовую категорию, тёплый фон добавляет мягкости, а графитовый сохраняет читаемость в каталоге.
rgb(123, 177, 74)rgb(243, 233, 217)rgb(51, 51, 51)Технологии
Стек продуктового каталога
Технологии поддерживают быстрый интерфейс, управляемый ассортимент и отдельные маршруты товаров, рецептов и корпоративной информации.
Next.js
Серверный рендеринг и файловая маршрутизация формируют быстрые индексируемые страницы каталога.
React
Интерактивные фильтры по составу и линейкам помогают исследовать большой ассортимент без лишних переходов.
REST API
Данные о продуктах, вкусах и медиа загружаются из отдельного API бренда и обновляются централизованно.
Яндекс Метрика
Аналитика фиксирует интерес к линейкам, карточкам, рецептам, точкам продаж и партнёрским обращениям.
Интерфейс проекта
Страницы сайта целиком
Полные скриншоты без кадрирования — главная, каталог, карточка продукта и рецепты.
Состав работ
Что вошло в проект
Архитектура продуктовой экосистемы
Каталог по составу и линейкам
Шаблоны карточек продукции
Раздел рецептов и бренда
Сценарии продаж и партнёрства
Адаптивная разработка на Next.js
От задачи к системе
Как устроен путь к продукту
Выбор состава
Пользователь начинает с понятного ингредиента — овса, кокоса, миндаля, сои или орехов.
Выбор линейки
Каталог группирует продукты по задачам: напитки, Barista, сливки, закваски и специальные вкусы.
Изучение продукта
Карточка собирает описание, состав, пищевую ценность и визуальную коммуникацию конкретного вкуса.
Покупка или партнёрство
Точки продаж и форма для партнёров переводят интерес к бренду в практическое действие.
Смысл и SEO
Разработка сайта бренда продуктов питания
Структура соединяет корпоративную презентацию, каталог FMCG-продукции и контентные сценарии для покупателей и партнёров.
- 01Сайт бренда продуктов питания
- 02Каталог растительной продукции
- 03Разработка сайта на Next.js
- 04Карточки продуктов с составом
- 05Сайт производителя FMCG
- 06Рецепты и точки продаж
Категории и отдельные карточки помогают отвечать на запросы по растительным напиткам, сливкам и продуктам на основе конкретных ингредиентов. Человекопонятные маршруты создают основу для поискового продвижения ассортимента.
Контент о бренде, рецепты и информация для партнёров расширяют семантику проекта и поддерживают аудитории на разных этапах — от первого знакомства до выбора продукта и сотрудничества.
Новый проект
Хотите подобный проект?
Спроектируем сайт бренда или производителя с каталогом, карточками продукции, контентом и понятным маршрутом до покупки.
- Разберём ассортимент и целевые аудитории
- Соберём структуру каталога и продуктовых страниц
- Подготовим дизайн, разработку и SEO-основу