Magic Vibes

Задача. Сделать для парфюмерного магазина собственную витрину вместо продаж только через маркетплейсы. Каталог должен сам синхронизироваться со складом, заказ должен оформляться за пару минут, а покупатель должен запомнить магазин по его визуальному стилю. Что сделано Витрина и визуальный стиль - Светлый редизайн с фирменной типографикой (Unbounded, Onest, Marck Script) и дизайн-токенами на CSS-переменных. - 3D-флакон на Three.js. При скролле он собирается по сценам (FlaconStory). В героях категорий стоят свои 3D-сцены, а из фотографии товара строится объёмный рельеф. - Анимированные баннеры, галереи коллекций и брендов, лайтбокс для фото, отдельная адаптивная навигация для мобильных. Подбор аромата - AI-подбор: покупатель своими словами описывает ноты, настроение, повод или бюджет либо пишет «хочу похожий на…». - Квиз-подборщик аромата. - Интерактивная «Ароматная карта мира» с парфюмерными традициями разных стран. - Гайды и подборки: для мужчин, для женщин, для офиса, в подарок. Оформление заказа и логистика - Корзина, промокоды и расчёт доставки в реальном времени. - Доставка через СДЭК, Яндекс Доставку, Ozon и Достависту: пункты выдачи выбираются на карте, для экспресс-курьера можно выбрать слот «сегодня/завтра ко времени». - Онлайн-оплата через Ozon Pay. - Страница отслеживания заказа с картой и приём вебхуков от курьерской службы. - Личный кабинет с историей заказов, веб-push-уведомления. SEO и маркетинг - Серверный рендеринг с ISR, у каждой страницы свои метаданные, JSON-LD (хлебные крошки, товары), динамические OG-картинки. - Карта сайта, разбитая на части, robots.txt и YML-фид для Яндекс Вебмастера и Директа. - Яндекс Метрика с учётом согласия на cookies, бейдж рейтинга Яндекса, промо-попапы и конкурсы. - Внутренняя «Студия постов»: генерирует сторис-видео и рекламные креативы. Скрипты рендерят промо-изображения через headless Chrome. Сервис и соответствие закону - Виджет чата поддержки, связанный с админкой склада. - Юридический блок по 152-ФЗ: согласия на обработку персональных данных и на рекламу с версионированием, баннер cookies, оферта, политика, гарантия. - Фича-флаги: разделы включаются и выключаются из админки без нового деплоя. Архитектура - Витрина на Next.js (около 15 тыс. строк TypeScript) работает как отдельное приложение поверх REST API складской системы. Каталог, заказы, авторизация, блог и поддержка обслуживает общий бэкенд на Node.js и PostgreSQL. - Изображения отдаются через собственный прокси и оптимизатор. - Деплой на VPS под PM2. Предыдущая сборка сохраняется, чтобы при неудачном деплое можно было откатиться. Ключевые особенности (для списка) - 3D-флакон на Three.js со сценами при скролле - AI-подбор аромата по описанию на естественном языке - 4 службы доставки, выбор ПВЗ на карте, экспресс-курьер со слотами - Оплата через Ozon Pay, отслеживание заказа - SEO под Яндекс: SSR/ISR, JSON-LD, YML-фид, карта сайта - Синхронизация с собственной складской системой