UX-аналитика: тепловые карты и системы аналитики
Зачем это нужно
Между «спросить» и «посчитать» есть третий путь — молча смотреть, что люди реально делают в интерфейсе. Поведение не умеет быть вежливым. Но и оно не есть чистая правда: у поведенческих данных своя слепота, и знать её обязательно.
Как это работает
Инструменты. Тепловая карта — куда чаще всего нажимают и доскролливают ли: горячие зоны красные, мёртвые — холодные; мгновенно видно, что кнопку не замечают, а по некликабельной картинке кликают. Записи сессий — обезличенные видео пути пользователя: где заметался, где «яростные клики» по неработающему элементу. Юзабилити-тест — дай человеку задачу («оформи заказ») и молча смотри, где он застрял. А проверка исправлений — это уже A/B-тест из «Анализа данных»: круг замкнулся.
Чем это собирают. Тепловые карты и записи не появляются сами — их делают системы аналитики. В сайт вставляют счётчик (небольшой скрипт), и дальше он сам сообщает о том, что делает посетитель. Три поколения таких систем. Веб-аналитика (Яндекс Метрика, Google Analytics) — про страницы и трафик: сколько зашло, откуда пришли, куда ушли; у Метрики здесь же тепловые карты и Вебвизор с записями сессий. Продуктовая аналитика (Amplitude, Mixpanel) — не про страницы, а про события: «нажал добавить в корзину», «открыл урок». Мыслит воронками и когортами, отвечая не «сколько зашло», а «как люди проходят путь». Своя система событий — то, к чему приходят крупные сервисы: приложение шлёт события в собственное хранилище, а аналитики строят отчёты сами. Дороже, но данные твои, метрики определяешь ты, и никто не удалит их и не поменяет правила.
Общая логика у всех одна: событие (что случилось), свойства (у кого, где, когда) и идентификатор (чтобы связать действия одного человека). Инструменты и кнопки в них меняются каждый год — эта тройка не меняется. В лабораториях ниже видно, как это выглядит вживую: сначала жмёшь кнопку и смотришь, что улетело на сервер, а потом — во что превращаются тысячи таких записей, когда аналитика сгруппирует их по дням. Это и есть главный экран любой системы: столбики событий по датам, разбивка по источникам трафика и сравнение периодов. График показывает форму — ритм недели, уровень, тренд; но не причину: почему так, ищут уже другими инструментами.
Пример
Тепловая карта лендинга: шапка и первый экран раскалены, а до кнопки «Купить» доскролливают 9%. Кнопку подняли выше — конверсия удвоилась. Ни один опрос этого бы не показал: пользователи не знают, чего они не увидели.
Но вот вторая история — про то, чего не видит сам счётчик. Команда сравнила два источника трафика: из поисковика отказов 40%, из техноблога — 25%. Вывод напрашивался: аудитория блога качественнее, вложим бюджет туда. На деле у читателей техноблога массово стоят блокировщики, которые режут счётчик. Их визиты просто не попали в статистику — а те немногие, что попали, были случайными посетителями без блокировщика. Сравнивали не источники, а видимость счётчика.
🧪 Интерактивная лаборатория
Слева — экран магазина. Нажимай кнопки как обычный покупатель. Справа сразу видно, что именно улетает на сервер при каждом нажатии: это и есть событие. Внизу — журнал всех событий и воронка, посчитанная из него. Ничего другого у аналитика нет: только такие записи.
🧪 Интерактивная лаборатория
Так выглядит главный экран Метрики или Google Analytics: события по дням за две недели. Здесь их уже тысячи — столько кликами не наберёшь, поэтому данные готовые. Переключай событие и источник трафика и смотри, как меняется картина.
🧪 Интерактивная лаборатория
Перед тобой макет лендинга. Кликай по нему как обычный посетитель — куда потянется рука. Клики копятся в «горячие зоны». Внизу — сколько кликов дошло до кнопки «Купить», спрятанной внизу страницы.
Кликов: 0 · дошло до «Купить»: 0%
Цель: кликни ещё несколько раз, чтобы карта «нагрелась».
🧭 Как это использовать
Дёшево и сердито: перед редизайном — тепловая карта и пять записей сессий; после — A/B. Этот маленький конвейер ловит большинство интерфейсных проблем без единого вопроса пользователю.
Но помни, откуда берётся цифра. Счётчик — это скрипт в браузере посетителя, и в статистику попадает только тот, у кого он успешно отработал. А отрабатывает он не всегда: блокировщики режут счётчики в первую очередь, отказ от куки обрубает историю, быстро закрытая вкладка не считается вовсе. То есть данные Метрики — это не «все пользователи», а выборка: те, у кого скрипт сработал. И — вот главное — выпадают не случайные люди: блокировщик стоит у более технически подкованных, приватность выбирают более осознанные. Механизм тот же, что у справочника 1936 года из урока про выборку, только вместо телефона — блокировщик.
Отсюда правила. Сравнивая сегменты, спроси, одинакова ли в них видимость счётчика — иначе сравниваешь не аудитории, а долю блокировщиков. Сверяй счётчик с источником, который нельзя заблокировать: серверные логи, база заказов, платежи. Расхождение — это и есть размер твоей слепой зоны. Не бери проценты за истину до последней цифры: важна динамика и порядок, а не «конверсия ровно 3,7%». И выбирай инструмент по вопросу: откуда пришли — веб-аналитика; где отваливаются на пути — продуктовая; нужны свои метрики и гарантия, что данные не исчезнут — своя система событий.
🎯 Быстрый вопрос
Метрика показывает: у трафика из техноблога отказов 25%, из поисковика — 40%. Значит, аудитория блога качественнее?