Pstv-drinks.ru

Информация о проекте

«Зеленые продукты» — производитель напитков под брендом Positivity. В портфеле компании — газированные напитки, лимонады, мохито и тоники с яркими, натуральными вкусами. Задача состояла в создании современного, визуально насыщенного сайта, который сможет эффектно презентовать каждый продукт и обеспечить удобное управление ассортиментом.

Цели создания сайта:

• Разработать имиджевый сайт с уникальным дизайном для каждой категории напитков, отражающим их характер.
•  Реализовать сложную анимацию с параллакс-эффектами при скролле и движении мыши, аналогичную мировым брендам.
• Создать на WordPress гибкую административную панель для самостоятельного редактирования контента (описания продуктов, названия вкусов, калорийность, объёмы тары, логотипы торговых сетей) без привлечения разработчиков.
• Обеспечить возможность масштабирования: добавления новых линеек продуктов с сохранением единого стиля.
• Настроить сбор обратной связи через форму с обязательной передачей UTM-меток для аналитики.
• Подготовить сайт к дальнейшему SEO-продвижению (вывести поля для мета-тегов, настроить ЧПУ).

Решение
Проект начался с серии звонков и брифинга: заказчик предоставил подробное ТЗ, референсы и брендбук. Визуальная концепция была утверждена, после чего последовала кропотливая работа над деталями: клиент вносил правки по размерам бутылок, насыщенности фонов, добавлял новые элементы (логотипы торговых сетей в футер, попап «написать нам», страницу 404). Мы оперативно реагировали на все комментарии, сохраняя сроки и качество.

Параллельно с дизайном велась разработка на WordPress. Самой сложной задачей стала реализация анимации с параллаксом на страницах продуктов. Мы создали эффект, при котором элементы (лёд, фрукты, капли) при скролле и движении курсора двигаются с разной скоростью, создавая ощущение объёма и погружения. Для этого использовались кастомные скрипты и CSS-трансформации, а графику пришлось дорабатывать в Figma для корректного экспорта слоёв — разработчик взял на себя эту задачу, чтобы не затягивать сроки.

После вёрстки началась интеграция с WordPress: все текстовые блоки, названия продуктов, калорийность, объёмы тары, ссылки на соцсети и логотипы были выведены в админку через кастомные поля. Клиент получил возможность самостоятельно управлять контентом без участия разработчиков. Форма обратной связи была настроена на сбор UTM-меток и параметров визитов (_ym_uid, _ym_counter), что позволило заказчику отслеживать эффективность рекламных кампаний прямо в CRM.

При переносе на боевой домен pstv-drinks.ru возникли технические сложности с привязкой WordPress и подгрузкой статических файлов из-за несоответствия адресов в базе данных. Мы совместно с поддержкой хостинга оперативно исправили пути, настроили редиректы и записали для клиента подробную видеоинструкцию по работе с админкой. Также решили проблему с отображением шрифтов в разных браузерах (Хром и Safari по-разному рендерили жирность), оптимизировав подключение шрифтов.

Спустя два года клиент вернулся с задачей добавить новую линейку «Азия» и два вкуса мохито. Мы оперативно подготовили дизайн на основе старых макетов, сверстали новые страницы, сохранив всю анимацию и стилистику. Контент-менеджер заполнил их текстами, и новые продукты были интегрированы в меню сайта — проект продолжил своё развитие без потери качества.