UA

Про проєкт
Lullaby — мультибрендовий б’юті-магазин преміальної оригінальної косметики, парфумерії та аксесуарів, який працює з 2019 року.
Виклик: Аналітика показала, що 93% аудиторії — мобільні користувачі, але вони проводять на сайті в 4 рази менше часу, ніж десктопні. 84% трафіку — нові користувачі, які купують у 1,5 раза рідше за тих, хто повертається. Bounce Rate становив 33%, а на сторінках товару сягав критичних 65%.
Сайт потребував глибокої оптимізації під мобільні пристрої, щоб конвертувати високий трафік із соцмереж у продажі.
Задачі та цілі
Lullaby потребував не естетичного редизайну, а UX/UI рішень для підвищення ефективності:
- Провести UX аудит, щоб виявити та усунути бар'єри у воронці продажів для mobile-користувачів;
- Підвищити довіру до бренду, акцентуючи на оригінальності продукції;
- Спростити навігацію та скоротити шлях від входу до сторінки товару;
- Прискорити підбір товару (бренди, фільтри, варіації, читабельність карток);
- Оптимізувати кошик і чекаут, щоб більше користувачів завершували покупку.
.jpg)
Навігація та головна сторінка
До: Складна навігація: меню не фіксоване при скролі, зайві елементи (відкритий пошук, дублювання іконок у бургер-меню), які змушували скролити, відсутність «хлібних крихт» для повернення в категорії. Інформація про оригінальність продукції (ключова УТП) та розділ «Акції» знаходилися занадто низько, через це їх не помічали 82% відвідувачів.

Після:
Запропонували впровадити Sticky Header, зафіксувати навігацію, прибрати зайве з бургер-меню, підняти каталог вище й винести «Акції» та «Бренди» на початок для швидкого доступу, а УТП про оригінальність продукції та швидку доставку підняти у другий екран, щоб одразу формувати довіру. Також — додати «хлібні крихти» та фіксоване закриття меню, щоб користувачі швидше переміщались сайтом без повторних дій.

Сторінка категорії
До: Фільтри не закріплювалися при скролі, змушуючи користувача постійно повертатися вгору. Сторінки товарів були неінформативними: малі фото, великі білі поля та відсутність індикаторів кольору/об'єму змушували переходити на сторінку товару для деталей. У кінці видачі користувача нічого не веде далі — якщо не знайшов, сесія обривається.

Після: Реалізували фіксовані фільтри для миттєвого доступу до налаштувань. Оптимізували сторінки товарів, збільшивши фото та додавши варіації (колір, об'єм) прямо у списку. Також додали сортування «За популярністю», щоб підсвітити трендові продукти. Наприкінці видачі розмістили блок з Переглянуті/рекомендовані товари, щоб зменшити виходи та збільшити глибину.

Сторінка товару
До: Ціна й кнопка «Купити» були не на першому екрані та зникали при скролі. Опис, характеристики й спосіб використання зливалися в один блок, а варіації товару (об’єм/колір) були далеко від фото, через що користувачі постійно скролили й могли помилятися. Блок «Схожі товари» показував нерелевантні позиції, а інформацію про оплату та доставку доводилося шукати окремо по сайту.

Після: Закріпили ціну та кнопку «Купити» під час скролу для миттєвого замовлення. Розділили опис, характеристики, спосіб застосування, склад та сертифікація на зручні вкладки та налаштували релевантні товари-компліменти. Також додали короткі дані про доставку й наявність в офлайн-магазинах безпосередньо у картку.

No items found.
Кошик
До: Акційні банери візуально зливалися з товарами. Не було можливості ввести промокод до чекауту або зберегти товар у «Обране» при видаленні, що призводило до втрати інтересу.

Після: Чітко відокремили товари від промо-блоків та додали поле для промокоду. Рекомендували реалізувати функцію «Зберегти в обране» при видаленні товару та додали блоки cross-sell безпосередньо у кошику для збільшення чека.

Сторінка оформлення замовлення
До: Не вистачало логотипа і телефону підтримки, зате був повний футер, який відволікав. Якщо користувач повертався — дані не зберігались, доводилось вводити знову. Місто доставки треба було щоразу набирати вручну, повідомлення про безкоштовну доставку могло відволікати й провокувати вихід на попередні кроки, а назви способів оплати (типу Fondy) були неочевидними.

Після: Додали спрощену шапку з телефоном підтримки та логотипом, реалізували автозбереження введених даних і редагування кошика через pop-up. Для прискорення — список частотних міст і більш зрозумілі назви оплати (наприклад, «Оплата карткою»). Повідомлення про безкоштовну доставку — перенесли в кошик, а сам чекаут структурували та розбили на чіткі та зрозумілі кроки.


Результати
У результаті Lullaby отримали не просто список правок, а комплексну систему змін для стабільного зростання KPI:
- Mobile-first CRO-роадмап: пріоритезований план дій з фокусом на 93% мобільного трафіку та конвертацію нових користувачів (84% аудиторії).
- Скорочений шлях до покупки: оптимізована навігація, пропрацьовані фільтри та релевантні рекомендації, що спрощують вибір та формують довіру.
- Зрозумілий процес купування: прозора структура кошика, автозбереження даних та оформлення без відволікаючих факторів для мінімізації сумнівів.
- Стратегія Retention: інструменти для повернення клієнтів (обране, персоналізація) та посилення потенціалу Lullaby Community.
