***** Group — сайт алкогольного бренда с e-commerce интеграцией
Webflow
Shopify
Storefront API
JavaScript
CMS
Backend
Роль: Webflow/Shopify разработчик
Срок: 2 месяца
Конфиденциальность: проект без прямого упоминания бренда, все брендированные элементы замаскированы
О проекте
Клиент — крупный международный FMCG-бренд алкогольного сегмента.
Цель — создать современный сайт-витрину с гибкими дизайнерскими возможностями и функциональностью интернет-магазина, соответствующими высоким стандартам бренда.
Основные задачи
- Вёрстка и анимация многостраничного промо-сайта по макетам из Figma: главная, каталог продукции, уникальные страницы коктейлей, корзина, поиск, информационные секции
- Реализация функциональности интернет-магазина на Shopify без жёсткой привязки к шаблонам, с нативной интеграцией в дизайнерские решения Webflow
- Обеспечить единый пользовательский опыт: пользователь видит, выбирает и кладёт товары в корзину, не покидая основной сайт до чекаута (чекаут реализован на стороне Shopify)
- Обеспечить динамическую синхронизацию ассортиментной матрицы и актуальных данных (остатки, размер, стоимость) с backend Shopify
Техническая реализация
Frontend
Сайт полностью реализован на Webflow, с адаптивной вёрсткой, анимациями интерфейса и визуальным разделением товарных категорий
Каталог и коктейли
Интеграция карточек категории напитков с базой товаров Shopify. Каждый коктейль связан с одним или несколькими товарами-базами (ингредиентами)
Корзина и динамический каталог
Вся логика взаимодействия с товарами реализована на стороне Webflow, данные по остаткам, цене и размерам моментально подтягиваются из Shopify Storefront API
Поиск, фильтрация
Реализованы с помощью кастомного кода и FinSweet
CMS + Storefront API
Для наполнения контента и актуализации каталога использована связка CMS Webflow и backend Shopify, реализована кастомная логика синхронизации через Storefront API. Для управления заказами настроена интеграция с Accelpay
Тестирование
В команде был отдельный тестировщик, помогал выявлять баги на всех этапах
Отдельные компоненты
Некоторые функциональные элементы проектировал и реализовывал самостоятельно по ТЗ и на основе референсов
Особенности проекта
100% всей разработки и настройки интеграций выполнено мной: от адаптации макетов Figma до конечной сборки и запуска сайта
Использованы кастомные решения на JavaScript для динамической работы всех ключевых e-commerce блоков (каталог, корзина, связка товара и коктейля, поиск)
Работа с крупным международным брендом по строгим стандартам и конфиденциальности
Понравился проект?
Другие проекты
AI Platform
Дизайн
Figma
Nexa AI
Ed-tech
Редизайн
Figma
Real Language Club
E-commerce
Разработка
Webflow
Shopify
JavaScript
API
***** Group
Ed-tech
Редизайн
Разработка
Creatium
JavaScript
API
Вебхуки
GetAnalyst
