Собрать лендинг по готовому макету (Figma) с анимацией бутылки при скролле (секвенция кадров), SEO-плагином и онлайн-оплатой.
Движок приоритетно WP, Тильду не рассматриваю.
Основные требования:
• Реализация анимации секвенции кадров (плавно, без рывков, с lazy-load и адаптацией под мобайл).
• SEO-модуль: Title/Description, ЧПУ, микроразметка schema.org, sitemap, robots.txt, OpenGraph.
• Подключение онлайн-оплаты
• Полная адаптивность (десктоп, планшет, мобайл).
• Google PageSpeed Insights 85+ для мобайла и десктопа.
• Чистый код, минимум плагинов, кэширование и оптимизация изображений.
• Кроссбраузерность: Chrome, Firefox, Safari, Edge.
Материалы от заказчика: Макет Figma, кадры анимации, тексты, реквизиты, доступы к хостингу/домену, данные для платёжной системы.
Сроки и бюджет: Указать в отклике.
Требования к исполнителю: Портфолио с проектами WP + сложная анимация/скролл, опыт оптимизации Core Web Vitals и интеграции платежей РФ.
Подробно по реализации анимации:
Анимация на сайте
Страница состоит из 7 блоков, 5 из которых включают одну анимационную сцену с бутылкой.
Нативный скролл блокируется, а события whell/touch используются как триггер:
Скролл вниз — переход на следующий блок и запуск анимации бутылки, соответствующей сцене
Скролл вверх — переход на предыдущую сцену и запуск обратной анимации.
Каждая сцена содержит собственную часть сиквенции анимации бутылки (ссылка на видео с анимацией сайта).
Во время воспроизведения анимации скролл блокируется, чтобы избежать прерываний.
Частота кадров анимации: 30 кадров в секунду, easing — easeInOut.
Поддержка мобильных свайпов с аналогичной логикой.
Анимация фона (ссылка на файл с анимацией фона) это готовый .gif файл, который должен запускаться при открытии сайта и работать в зацикленном режиме.
Ссылка на дизайн в фигме: