Упс! Не вдала спроба:(
Будь ласка, спробуйте ще раз.

Як ми збільшили конверсію сайту на 12,5% завдяки Microsoft Clarity: кейс Turum-burum та Shiny&Diski

Денис Студенніков
Денис Студенніков COO and Head of UX/UI Department у Турум-бурум
11 червня 2024 9 хвилин читання

Як завдяки стратегічному редизайну e-commerce збільшити продажі та підвищити коефіцієнт конверсії на 12,5%? Кейс редизайну інтернет-магазину Shiny&Diski доводить, що цільові UX/UI рішення для покращення користувацького досвіду можуть покращити якість взаємодії клієнтів із платформою та оптимізувати загальний досвід здійснення онлайн-покупок.

Знайомство з Shiny&Diski 

Заснована у 2012 році, компанія Shiny&Diski займається продажем шин та дисків і є офіційним дилером Nokian, Michelin, Continental та Goodyear. Пріоритет бренду доступність та комфорт покупців. 

Тому в онлайн-магазині Shiny&Diski клієнти можуть скористатися шинним калькулятором, ознайомитися з детальною характеристикою товарів і отримати замовлення протягом 1-3 днів через різні логістичні компанії або в пункті самовивозу вже через три хвилини після оформлення замовлення. Адже задоволеність користувачів є головною метою компанії. 

Завдання та цілі проєкту

Головні цілі редизайну:

  • Структурувати інформацію й надати необхідні деталі для кожного продукту, представленого на сайті;
  • Забезпечити легкий та зручний пошук товарів;
  • Створити якісний користувацький досвід як на десктопах, так і на мобільних пристроях.

Найбільший виклик: Задоволення потреб широкої цільової аудиторії з різним бекграундом, віком та рівнем технічної обізнаності.

Наша мета: зробити сайт інтуїтивно зрозумілим і доступним для всіх типів користувачів завдяки оптимізації користувацького досвіду.

Редизайн сайту: 5 ключових проблем юзабіліті та шляхи їх вирішення

Команда «Турум-бурум» ретельно проаналізувала юзабіліті сайту, KPI та поведінку клієнтів за допомогою інструментів аналітики, зокрема Microsoft Clarity. Під час дослідження агенція виявила кілька суттєвих недоліків юзабіліті сайту Shiny&Diski, що негативно впливали на загальні показники успіху бізнесу.

Cторінка видачі товару

Неефективний фільтр пошуку за брендом

Проблема: Розташування брендів на сайті в алфавітному порядку ускладнює пошук релевантних товарів. Так, клієнтам доводилося скролити довгі списки, щоб знайти потрібний бренд.

Попри доступність фільтру «Бренд» до редизайну сайту, користувачі часто користувались пошуком, щоб знайти потрібний бренд Попри доступність фільтру «Бренд» до редизайну сайту, користувачі часто користувались пошуком, щоб знайти потрібний бренд

Рекомендація: Реорганізувати список брендів на базі аналітики, розмістивши найпопулярніші бренди вгорі, а решту – в алфавітному порядку. Це зробить пошук релевантних товарів швидким та доступнішим для користувачів. 

Після редизайну сайту користувачі почали активно обирати найпопулярніші бренди для фільтрації товарів Після редизайну сайту користувачі почали активно обирати найпопулярніші бренди для фільтрації товарів

Результат: Дані після реалізації проєкту показують, що користувачі частіше взаємодіють з популярними брендами, що значно прискорює процес вибору товару та підвищує їх задоволеність.

Як результат – користувачі на 15% частіше переходять на сторінку товару зі списку товарів і на 67% частіше додають товар до кошика.

Зайвий крок для фільтрування товарів

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

Карта кліків до редизайну сайту: користувачі активно застосовували фільтри та натискали на кнопку «Показати» Карта кліків до редизайну сайту: користувачі активно застосовували фільтри та натискали на кнопку «Показати»

Рекомендація: Прибрати кнопку «Показати» і відображати кількість релевантних товарів безпосередньо навпроти кожного фільтру. Це рішення дозволить користувачам одразу бачити кількість продуктів, що відповідають їхнім вимогам, спростить процес фільтрації та покращить загальний користувацький досвід.

Карта кліків після редизайну сайту: користувачі все ще активно користуються фільтрами, але процес пошуку став швидшим і простішим  Карта кліків після редизайну сайту: користувачі все ще активно користуються фільтрами, але процес пошуку став швидшим і простішим 

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

Фільтр ціни знаходиться занадто низько

Проблема: Попри те, що користувачі часто використовували фільтр ціни, його бачили лише 64% покупців. Це потенційно перешкоджало його використанню та збільшувало час пошуку релевантного товару.

Фільтр «Ціновий діапазон» до редизайну сайту розташовувався нижче за фільтр «Бренд», який застосовувався набагато рідше Фільтр «Ціновий діапазон» до редизайну сайту розташовувався нижче за фільтр «Бренд», який застосовувався набагато рідше

Рекомендація: Перемістити фільтр цін вище, щоб зробити його більш помітним та оптимізувати зручність використання. Це дозволить пришвидшити навігацію сайтом під час вибору релевантного товару та оформлення замовлення.

Розташування фільтра цінового діапазону після редизайну сайту Розташування фільтра цінового діапазону після редизайну сайту

Результат: Карти скролів та кліків Microsoft Clarity показують, що після редизайну близько 90% користувачів стали помічати фільтр цінового діапазону, що призвело до збільшення його використання. Тож зміна розташування фільтрів не лише покращила користувацький досвід, але й пришвидшила процес пошуку товарів, які відповідають конкретним потребам користувачів.

Сторінка товару

Відсутня можливість швидкого вибору розміру

Проблема: У хлібних крихтах сайту користувачі часто натискають на «модель бренду», щоб перейти на конкретну сторінку каталогу. Швидше за все, вони це роблять для  перевірки доступності різних розмірів певної моделі, а отже – інформацію про доступні розміри на минулій версії сайту було складно знайти.

Сторінка товару до редизайну сайту: користувачі часто натискають на модель, щоб перевірити доступні розміри Сторінка товару до редизайну сайту: користувачі часто натискають на модель, щоб перевірити доступні розміри

Рекомендація: Дозвольте користувачам бачити всі варіанти розмірів товару на одному екрані. Це спростить процес здійснення покупки й виключить необхідність додаткового пошуку.

Сторінка товару після редизайну сайту: інформація про доступні розміри моделі є візуально помітною й не потребує пошуку Сторінка товару після редизайну сайту: інформація про доступні розміри моделі є візуально помітною й не потребує пошуку

Результат: Таке рішення збільшило залученість користувачів, дозволивши їм легко порівнювати та обирати розміри, що пришвидшило процес прийняття рішення про покупку.

Погано продумане розташування характеристик товару

Проблема: Користувачі часто натискають на «Всі характеристики», тому що їх цікавлять деталі товару або ж тому, що характеристики не видно на перших екранах. Так, дані теплової карти показали, що лише 16% користувачів переходило до розділу «Характеристики», тоді як 33% обирали блок відгуків, розташований над деталями товару.

До редизайну сайту: теплові карти показували, що лише 16% користувачів переходили до характеристик товару До редизайну сайту: теплові карти показували, що лише 16% користувачів переходили до характеристик товару

Рекомендація: Перемістити блок з характеристиками відразу після блоку з фото товару, а розділ з відгуками – після нього. Ця зміна зробить інформацію про товар відразу видимою і доступною, виключивши зайві кліки чи скролінг сторінки.

Після редизайну сайту: теплові карти показують, що понад 40% користувачів натискають на блок з деталями продукту Після редизайну сайту: теплові карти показують, що понад 40% користувачів натискають на блок з деталями продукту

Результат: Після впровадження змін понад 40% користувачів отримали доступ до блоку з характеристиками товару, що свідчить про те, що вони стали візуально помітнішими. Після цього блоку користувачі абсолютно природно переходять до відгуків, що покращує їх загальний досвід взаємодії з платформою.

Завдяки впровадженню цих UX/UI рішень, показник конверсії зі сторінки продукту до кошика збільшився на 11%.

Головна сторінка

Відсутній пошук за популярними категоріями 

Проблема: На сайті відсутні прямі посилання на популярні категорії, тому користувачі змушені переміщатися по бургер-меню, щоб отримати доступ до певних категорій. Тож користувачам доводилось робити зайві кроки для здійснення покупки.

Перші три екрани головної сторінки до редизайну сайту: користувачі повинні довго прокручувати сторінки, щоб знайти посилання на категорії товарів, тому замість цього вони використовують пошук та/або меню-«гамбургер», щоб знайти потрібний розділ Перші три екрани головної сторінки до редизайну сайту: користувачі повинні довго прокручувати сторінки, щоб знайти посилання на категорії товарів, тому замість цього вони використовують пошук та/або меню-«гамбургер», щоб знайти потрібний розділ

Рекомендація: Додайте блок з найпопулярнішими підкатегоріями безпосередньо під основними категоріями товарів. Це дозволить користувачам швидко переходити до потрібної підкатегорії, спростивши пошук і зменшивши кількість кроків, необхідних для пошуку релевантного товару.

Перший екран головної сторінки після редизайну сайту: швидкі посилання на категорії зменшують час пошуку та скорочують шлях клієнта Перший екран головної сторінки після редизайну сайту: швидкі посилання на категорії зменшують час пошуку та скорочують шлях клієнта

Результат: помітно збільшилася взаємодія користувачів з цими категоріями – близько 40% користувачів мобільних пристроїв і 15% десктопних користуються новим блоком.

Як наслідок – коефіцієнт конверсії для користувачів, які переходять з головної сторінки, збільшився на 8%. Це свідчить про швидший перехід до покупки порівняно з попередніми показниками.

Результати редизайну в цифрах

Фактичні дані наочно демонструють позитивний вплив впроваджених UX/UI рішень.

  • Загальне збільшення конверсії: CR сайту збільшився на 12,5%, зі значним зростанням на різних пристроях – 16% для користувачів мобільних пристроїв і 7% для десктопу.
  • Збільшення залученості клієнтів: користувачі стали на 15% частіше переходити на сторінку товару зі списку товарів і на 67% частіше додавати товар до кошика.
  • Оптимізація взаємодії з сайтом: користувачі почали переглядати на 40% більше продуктів за сеанс, в середньому 2,2 позиції.
Якщо ви хочете поділитися з читачами SPEKA власним досвідом, розповісти свою історію чи опублікувати колонку на важливу для вас тему, долучайтеся. Відтепер ви можете зареєструватися на сайті SPEKA і самостійно опублікувати свій пост.
50 UAH 150 UAH 500 UAH 1000 UAH 3000 UAH 5000 UAH
0
Прокоментувати
Інші матеріали

Розвиток блогу та зважена рекламна стратегія: як компенсувати вплив сезонності на трафік

Наталія Раскопа 16 годин тому

Як створити YouTube-оголошення з високою конверсією у 2024 році?

В'ячеслав Юренко 21 червня 2024 19:00

Взаємодія між ключовими стейкхолдерами — запорука ефективної боротьби з піратством та контрафактом

Владислав Миронович 21 червня 2024 18:00

Як просувати бренд за допомогою текстового контенту

Оксана Павлюк 21 червня 2024 15:00

DevOps-курси за донати війську: як працює ініціатива «Навчання за донат»

Аліна Баля 21 червня 2024 12:00