Matrix Tonal Control

Главное о кейсе

Структура и контент

Для промо-сайта мы разработали чёткую структуру, которая эффективно подаёт информацию о новинках. Основные акценты были сделаны на 9 новых тёплых оттенков, с яркими и запоминающимися визуальными элементами, демонстрирующими результаты окрашивания. Каждый оттенок был представлен с детальными описаниями и примерами применения, чтобы пользователи могли понять, как каждый цвет будет выглядеть на различных типах волос.

Визуальные акценты и анимация

Мы использовали яркую графику и анимацию для того чтобы подчеркнуть основные преимущества продуктов. Анимационные элементы плавно переключаются между различными оттенками, демонстрируя возможности палитры. Важную роль сыграли крупные изображения волос, окрашенных в новые оттенки, чтобы пользователи могли оценить реальный результат.

Мобильная версия

Адаптация  под мобильные устройства позволяет пользователям комфортно взаимодействовать с контентом на любых экранах. Для удобства навигации была реализована оптимизированная версия сайта, сохранившая основные анимационные элементы и визуальные эффекты.

Интеграция с аналитикой GA4

Для мониторинга поведения пользователей и анализа вовлечённости мы внедрили систему аналитики GA4. Это позволило отслеживать, как пользователи взаимодействуют с новыми оттенками, какие блоки вызывают наибольший интерес, какие страницы показывают наибольший уровень вовлечённости, а также отслеживать конверсии продаж на маркетплейсах и сайтах партнёров.

В рамках проекта была реализована интеграция промо-сайта с ключевыми маркетплейсами и сайтами партнёров. Для каждого продукта были предусмотрены прямые ссылки, ведущие на платформы, что позволило пользователям легко и быстро приобрести продукт. Это решение существенно сократило путь от ознакомления с продуктом до его покупки, повысив конверсию и обеспечив максимально удобный пользовательский опыт.

Как проект изменил жизнь пользователей

Яркая графика и динамичная анимация позволили пользователям не только легко оценить новые тёплые оттенки, но и ознакомиться с обновлённой палитрой, состоящей из 29 трендовых цветов.
Интерактивные элементы и адаптивный дизайн для мобильных устройств обеспечили увлекательное и комфортное взаимодействие с продуктом, делая процесс его изучения максимально удобным и доступным на любых платформах.

Бизнес-задача и ее решение

Команде Mygento предстояло разработать промо-страницу для продвижения новинок в палитре Tonal Control. Цель проекта — продемонстрировать преимущества кислотных тонеров, их возможности для безопасного и эффективного окрашивания, а также выделить новые тёплые оттенки.Основные задачи включали:
- создание яркого и запоминающегося промо-сайта с акцентом на 9 новых оттенков;
- визуальная подача информации о продукте с использованием анимации и графики для привлечения внимания;
- разработка адаптивной версии для мобильных устройств;
- интеграция с системой аналитики для отслеживания поведения пользователей на сайте.

Крафт (мастерство), реализация, технические детали

Frontend: реализация интерфейса выполнена с использованием React, что обеспечило высокую скорость загрузки и плавность работы анимаций.
Мобильная версия: отдельное внимание было уделено адаптации сайта под мобильные устройства, сохраняя при этом высокую производительность и удобство навигации.

Инсайты, гипотезы, процесс создания и взаимодействия с заказчиком

Внедрение GA4 позволило отслеживать ключевые метрики взаимодействия пользователей с контентом, что в дальнейшем помогло улучшить маркетинговые кампании.

Скриншоты