Сторінка послуги отримує двісті відвідувачів на тиждень і жодної заявки. У аналітиці все видно: люди заходять, тримаються півтори хвилини, йдуть. Дані є, а розуміння немає. Що саме сталося за ці півтори хвилини — цифри не розкажуть.
Саме сюди й приходять теплокарти та записи сесій. Вони не замінюють аналітику, а добудовують її: показують не скільки людей пішло, а що вони робили перед тим, як піти.
Дві різні речі
Їх часто згадують разом, але це різні інструменти з різними задачами.
Теплокарти — це агрегована картина по багатьох відвідувачах. Вони бувають кількох типів:
- Карта кліків — де люди натискають найчастіше.
- Карта прокручування — до якої глибини сторінки взагалі доходять.
- Карта уваги — які зони екрана довше залишалися перед очима.
Теплокарта відповідає на питання «що відбувається загалом на цій сторінці».
Записи сесій — це відтворення шляху конкретної людини: як рухалася мишка, куди клікала, де зупинилася, як заповнювала форму. Це відповідь на питання «як саме проходить взаємодія в окремому випадку».
Логіка користування проста: теплокарта показує, де проблема, запис сесії — у чому вона.
Що зазвичай знаходять
Спостереження за реальною поведінкою майже завжди дає кілька відкриттів, які команда не очікувала. Найтиповіші з них повторюються від сайту до сайту.
Кліки по тому, що не клікається. Люди тиснуть на заголовки, іконки, зображення товару — бо очікують, що це посилання. Це прямий сигнал: тут людина хоче наступного кроку, а сайт його не дає.
Ніхто не доходить до головного. Карта прокручування показує, що вісімдесят відсотків відвідувачів не бачать блок із перевагами, бо він на четвертому екрані. Питання не в тому, що блок поганий, а в тому, що він фактично не існує.
Ігнорування ключових кнопок. Кнопка, яку ви вважаєте центральною, отримує кілька кліків, а другорядне посилання поруч — десятки.
Застрягання у формі. У записах видно, як людина доходить до конкретного поля, зависає, стирає введене, повертається — і закриває вкладку. Це вузьке місце, яке видно з точністю до поля.
Гарячкові рухи. Швидке хаотичне метання курсором або кілька натискань поспіль по одному місцю — класична ознака роздратування: людина чогось чекала, а нічого не сталося.
Мобільна версія показує найбільше
Якщо часу мало, дивіться поведінку саме на телефонах. Там і трафіку зазвичай більше, і проблем більше, бо перевіряють сайт зазвичай із компʼютера.
Типові знахідки на мобільних:
- Люди прокручують горизонтально, бо щось вилазить за межі екрана.
- Промахуються по кнопках, які надто малі або стоять надто щільно.
- Не доходять до контактів, які сховані внизу довгої сторінки.
- Кидають форму, де на маленькому екрані видно чотири поля, а насправді їх десять.
Це не гіпотези про смак дизайну, а буквально видима механічна поведінка. Тому й правки з неї виходять безсуперечні.
Як дивитися, щоб не згаяти час
Найпоширеніша помилка новачків — увімкнути запис і почати переглядати сесії поспіль. За дві години ви подивитеся сорок нудних записів і не зробите жодного висновку.
Робочий підхід інший:
- Почніть з питання. Не «подивимося, що там», а «чому на сторінці замовлення такий відтік».
- Відбирайте сесії за ознакою. Ті, де людина була довго й пішла. Ті, де дійшла до форми й не відправила. Ті, де багато кліків, але немає результату.
- Дивіться десять-пʼятнадцять, не більше, за один підхід.
- Шукайте повтори. Одна дивна сесія — випадковість. Одна й та сама поведінка в чотирьох записах — це вже проблема сайту.
- Записуйте спостереження одразу, коротко й фактами: «троє з десяти клікнули на фото товару, воно не відкривається».
Такий формат перетворює дві години споглядання на список із пʼяти конкретних пунктів.
Спостереження — це ще не рішення
Тут головна пастка всього підходу. Побачивши поведінку, дуже спокусливо одразу зробити висновок і переробити сторінку. Але побачене — це симптом, а тлумачення завжди ваше і воно може бути хибним.
Людина довго зависла на блоці з цінами. Це означає, що ціни незрозумілі? Чи що вона уважно рахує, бо вже майже готова купити? Дві протилежні інтерпретації однієї картинки.
Тому правильний ланцюжок такий:
- Спостереження — що конкретно ви бачили.
- Гіпотеза — чому це може відбуватися і що варто змінити.
- Перевірка — зміна тестується, а не впроваджується наосліп.
- Висновок — чи стало краще насправді.
Пропуск третього кроку — причина, чому багато редизайнів «за результатами спостережень» роблять гірше. Механіку самої перевірки ми розібрали в матеріалі про A/B тестування сайту.
Коли інструмент не допоможе
Кілька чесних застережень.
Мало трафіку. Якщо на сторінку заходить пʼятнадцять людей на тиждень, теплокарта буде порожньою, а десять сесій нічого не доведуть. Тут корисніше просто попросити пʼятьох знайомих пройти шлях уголос — це дасть більше.
Проблема не в сайті. Жодна теплокарта не врятує, якщо ціна не конкурентна, пропозиція незрозуміла або трафік іде з нецільових джерел. Люди йдуть не тому, що кнопка мала, а тому, що їм не підходить суть.
Надмірна деталізація. Легко провалитися в нескінченне вдосконалення дрібниць і забути про великі речі — структуру сторінки, зрозумілість пропозиції, швидкість.
Загальна рамка того, що взагалі впливає на кількість покупок і в якому порядку за це братися, описана в матеріалі про конверсію інтернет-магазину.
Не все лікується правками сторінки
Окремо варто сказати про знахідки, які виглядають як дрібниця, а насправді вказують на технічну проблему. Класика: у записах видно, що люди відкривають сторінку й майже одразу йдуть, не дочекавшись прокручування. Легко вирішити, що не працює заголовок, і переписати його пʼять разів. А причина в тому, що сторінка вантажиться сім секунд на мобільному інтернеті.
Так само гарячкові кліки по одній кнопці часто означають не незрозумілий текст, а те, що форма довго відповідає й людина не бачить жодної реакції. Тому перед тим, як переписувати сторінку, варто перевірити швидкість і поведінку сайту на слабкому зʼєднанні — інколи це і є вся правка. Наскільки сильно тут вирішує технічна основа сайту, добре видно в порівнянні WordPress і Next.js.
Практичний порядок дій
Якщо ви починаєте з нуля, простий сценарій виглядає так.
Оберіть одну-дві найважливіші сторінки — зазвичай це сторінка послуги або картка товару й сторінка оформлення. Увімкніть збір даних і зачекайте, поки набереться достатньо відвідувань. Перевірте, що чутливі поля приховані від запису, і додайте згадку про збір даних у політику конфіденційності.
Далі перегляньте теплокарти прокручування й кліків, потім вибірково — десяток сесій із поведінкою «прийшов і пішов». Складіть список спостережень, перетворіть їх на дві-три гіпотези й перевіряйте по черзі, а не всі одразу.
Коротко
Теплокарти показують загальну картину поведінки на сторінці: куди клікають, до якої глибини прокручують, що взагалі бачать. Записи сесій показують окремий шлях і те, де людина застрягла.
Разом вони відповідають на питання «чому», якого немає в цифрах аналітики. Але самі по собі вони нічого не вирішують: побачене треба перетворити на гіпотезу й перевірити, а не впроваджувати одразу. Дивіться цілеспрямовано, шукайте повтори, починайте з мобільної версії.
Ми в Obliko налаштовуємо ці інструменти й допомагаємо витягти з них список конкретних правок замість купи вражень. Напишіть, яка сторінка вас турбує, — підкажемо, на що дивитися насамперед.
Чим теплокарти відрізняються від звичайної аналітики?
Аналітика відповідає на питання «скільки» і «де» — скільки людей пішло зі сторінки, який відсоток дійшов до форми. Теплокарти й записи сесій відповідають на питання «чому». Ви бачите, що людина тричі клікнула на нерухому картинку, або зупинилася на абзаці про доставку й пішла. Цифри показують проблему, поведінка показує причину. Одне без іншого працює гірше.
Скільки записів сесій треба переглянути?
Не намагайтеся дивитися все підряд — це найшвидший спосіб згаяти день без висновків. Достатньо десяти-п'ятнадцяти сесій, відібраних за ознакою: людина була на сторінці довго й пішла, або дійшла до форми й не відправила. Якщо одна й та сама поведінка повторюється у трьох-чотирьох записах, це вже закономірність, а не випадковість.
Чи не порушує запис сесій приватність користувачів?
Записується поведінка — рухи, кліки, прокручування, — а не сама людина. Нормальні інструменти за замовчуванням приховують введення в полях паролів і платіжних даних, і це налаштування треба перевірити перед запуском. Крім того, факт збору таких даних має бути відображений у політиці конфіденційності сайту. Якщо ці дві речі зроблені, проблем немає.
Що робити з тим, що я побачив у записах?
Не кидатися одразу все переробляти. Спостереження — це ще не істина, а гіпотеза: «люди не бачать кнопку, бо вона зливається з фоном». Далі гіпотезу треба перевірити, а не впровадити наосліп. Іноді очевидна на вигляд правка нічого не змінює, а іноді псує показники. Тому цикл виглядає так: спостереження, гіпотеза, перевірка, висновок.
Потрібен сайт або застосунок?
Розробляємо під ключ — від дизайну до запуску. Порахуємо ваш проєкт безкоштовно.