WONDER WHEY – бренд спортивного питания из Краснодара
О проекте
Wonder Whey — российский бренд спортивного питания, который соединяет современные научные разработки, «чистые» составы без лишних добавок и строгий контроль качества партии к партии, создавая продукцию для реального улучшения самочувствия и энергии и развивая продажи на ведущих маркетплейсах.
Год:
2025
Клиент:
Бренд спортивного питания из Краснодара — WonderWhey
Сфера:
БАДы, Спортивное питание
О проекте:
Wonder Whey — российский бренд спортивного питания, который соединяет современные научные разработки, «чистые» составы без лишних добавок и строгий контроль качества партии к партии, создавая продукцию для реального улучшения самочувствия и энергии и развивая продажи на ведущих маркетплейсах.
Что сделали:
Провели комплексное исследование бренда, аудитории и конкурентов, определили позиционирование и коммуникационное ядро. На основе аналитики разработали мудборд и визуальное направление «Чистая энергия», ставшее основой для дизайн-системы. С нуля спроектировали структуру, UX и UI-кит, создали все страницы — от главной и каталога до блога и партнёрского раздела. Реализовали скролл-анимацию банки с прогрессивной загрузкой (LOD). Подключили формы, метрики, SEO-базу и систему кеширования, обеспечив быструю и стабильную работу сайта.
Тайм-лайн проекта
2 месяца
Сформировали и вывели в онлайн полноценную площадку бренда
Стратегия
2 недели
Дизайн-концепт
1 неделя
Сайт
5 недель
На основе целей и ЦА: референсы, палитра, типографика, фотостиль и 3D. Из нескольких гипотез утвердили направление «Чистая энергия» — основу для дизайн-системы и анимаций.
- Подбор референсов
- Палитра, типографика, сетка
- UI-компоненты и ориентиры по 3D/motion
Спроектировали каркас и ключевые потоки (главная → каталог → карточка → WB/Ozon, «О компании», «Блог», «Партнёрам»).
- Wireframes (Figma)
- User Flow & CJM
Тестировали видео-scrub и full-sequence; финально выбрали Canvas-последовательность с LOD: low грузится мгновенно, hi подмешивается по скроллу.
- HTML, CSS, JS
- Canvas + requestAnimationFrame
Фишка сайта
Анимация банки реагирует на прокрутку: плавно вращается, запускается сразу и стабильно работает.
Современное отражение энергии спортивного питания
Современный и читаемый акцентный шрифт
#ffffff
#000000
#FF4C00
Каталог и карточки товаров
Специально для сайта мы разработали кастомный плагин карточки товара: при выборе вкуса и граммовки он формирует «глубокую» ссылку на конкретный SKU на маркетплейс, чтобы пользователь сразу переходил к нужному варианту.
Новый сайт Wonder Whey: собранный, быстрый, ориентированный на действие
Мы сделали бренд-витрину, которая чётко объясняет ценность Wonder Whey и ведёт пользователя к покупке на Wildberries и Ozon. Главная с аккуратной LOD-анимацией банки, ясными тезисами и заметными CTA; упорядоченный каталог по категориям; страницы «О компании», «Блог», «Контакты» и лендинг для амбассадоров с формой заявки — всё складывается в цельный путь от интереса к действию.
По ощущениям сайт лаконичный и «чистый»: выверенная типографика, сдержанная палитра, акцентные элементы бренда.
Итог: выросла понятность бренда и доверие, путь до маркетплейсов стал короче, появилось отдельное окно для партнёров и платформа для регулярного контента.
