Интеграция Amplitude аналитики на сайт: настройка, трекинг, воронки

Вы запустили сайт, настроив Google Analytics, но не видите, почему пользователи уходят после регистрации. GA не даёт продуктовых инсайтов. Интеграция Amplitude с вашим сайтом — решение: эта product analytics платформа строит воронки конверсий, когорты удержания и предоставляет инструменты поведенческого анализа. Мы с 5-летним опытом поможем настроить Amplitude под ваш бизнес. Экономия на рекламном бюджете за счёт улучшения ретеншена может достигать 30%. Получите консультацию — оценим ваш проект.

Проблемы, которые решает Amplitude

Отток пользователей на ранних этапах

Без корректного трекинга вы не видите, где именно пользователь застревает. Amplitude строит воронки конверсий с точностью до шага. Например, между «Регистрация» и «Загрузка первого файла» теряется до 70% пользователей — вы это увидите и сможете оптимизировать UX. В одном из проектов мы снизили отток на этапе онбординга на 25% за счёт кастомных воронок и A/B-тестов. Дополнительно настроили отслеживание событий с задержкой более 30 секунд, что выявило ещё 12% точек трения.

Слепые зоны в поведении

GA фиксирует pageviews, но не действия внутри страницы. Amplitude трекает клики по кнопкам, скроллы, заполнение форм — любые события с произвольными свойствами. Это даёт полную картину взаимодействия с продуктом. Средний LTV пользователей, интегрировавших с API Amplitude, вырастает на 40% по данным нашей практики. При этом количество замеряемых событий на сессию увеличивается с 5 до 20+.

Низкая конверсия в повторные покупки

Cohorts и Retention показывают, какие группы пользователей возвращаются и что их удерживает. Сегментируйте аудиторию по поведению и запускайте персонализированные кампании. Например, пользователи с просмотром премиум-фичи на 50% чаще конвертируются. Мы помогли SaaS-продукту увеличить repeat purchase rate на 35% за 2 месяца.

Как настроить трекинг событий за 1 день?

Базовая установка — 1 день. Устанавливаем SDK, инициализируем с ключом API, добавляем ключевые события: просмотр страницы, клик по CTA, заполнение формы, регистрация, покупка. Amplitude лучше GA в построении воронок благодаря поведенческим когортам — это ключевое преимущество для product-команд. Amplitude Documentation рекомендует начинать с минимального набора событий, постепенно расширяя.

npm install @amplitude/analytics-browser

import * as amplitude from '@amplitude/analytics-browser';

amplitude.init(import.meta.env.VITE_AMPLITUDE_API_KEY, {
  defaultTracking: {
    sessions: true,
    pageViews: false,
    formInteractions: false,
    fileDownloads: true,
  },
  logLevel: import.meta.env.DEV
    ? amplitude.Types.LogLevel.Debug
    : amplitude.Types.LogLevel.Warn,
  flushIntervalMillis: 10000,
  flushQueueSize: 30,
  serverUrl: undefined, // EU: 'https://api.eu.amplitude.com'
});

Отправка событий

Используем единый нейминг — Noun Verb или Subject Action:

import { track } from '@amplitude/analytics-browser';

// Просмотр страницы
track('Page Viewed', {
  page_path: window.location.pathname,
  page_title: document.title,
  page_type: 'product_listing',
});

// Клик по CTA
track('CTA Clicked', {
  cta_text: 'Попробовать бесплатно',
  cta_position: 'header',
  page_section: 'hero',
});

// Заполнение формы
track('Form Completed', {
  form_type: 'lead',
  fields_filled: ['name', 'email', 'phone'],
  time_to_complete_seconds: 45,
});

// Просмотр товара
track('Product Viewed', {
  product_id: 'SKU-001',
  product_name: 'Professional Plan',
  product_category: 'subscription',
  price: 2990,
  currency: 'RUB',
});

Идентификация пользователей

Для авторизованных пользователей обязательно вызываем setUserId и устанавливаем свойства через Identify. Это позволяет строить когорты по плану, дате регистрации и т.д. Гарантируем корректную настройку — без этого данные будут неполными.

import { Identify, identify, setUserId } from '@amplitude/analytics-browser';

function onUserAuthenticated(user: {
  id: string;
  email: string;
  plan: 'free' | 'pro' | 'enterprise';
  company?: string;
  createdAt: string;
}) {
  setUserId(user.id);
  const identifyEvent = new Identify();
  identifyEvent.set('email', user.email);
  identifyEvent.set('plan', user.plan);
  identifyEvent.set('company', user.company ?? '');
  identifyEvent.setOnce('signup_date', user.createdAt);
  identifyEvent.add('login_count', 1);
  identify(identifyEvent);
}

Как интегрировать server-side трекинг?

Для действий, происходящих на сервере (например, оплата подписки), используем HTTP API Amplitude. Пример на Laravel:

class AmplitudeService
{
    private string $apiKey;
    private string $endpoint = 'https://api2.amplitude.com/2/httpapi';

    public function __construct()
    {
        $this->apiKey = config('services.amplitude.api_key');
    }

    public function track(string $userId, string $eventType, array $eventProperties = []): bool
    {
        $payload = [
            'api_key' => $this->apiKey,
            'events'  => [[
                'user_id'          => $userId,
                'event_type'       => $eventType,
                'event_properties' => $eventProperties,
                'time'             => (int) (microtime(true) * 1000),
                'insert_id'        => uniqid('srv_', true),
                'platform'         => 'web',
            ]],
        ];
        $response = Http::timeout(5)->post($this->endpoint, $payload);
        return $response->ok() && ($response->json('code') === 200);
    }
}

Сравнение Amplitude и Google Analytics 4

Процесс работы

1. Аналитика — разбираем вашу бизнес-модель, определяем ключевые метрики (DAU, конверсия, LTV).
2. Проектирование — составляем карту событий, выбираем нейминг и свойства.
3. Реализация — интегрируем SDK, настраиваем трекинг на клиенте и сервере.
4. Тестирование — проверяем в debug-режиме, пишем автотесты для критических событий.
5. Деплой и мониторинг — подключаем дашборды, обучаем команду.

Что входит в работу

• Документация по всем событиям и свойствам (формат Notion или Confluence).
• Доступ к demo-дашборду с ключевыми метриками.
• Обучение команды (1 вебинар на 2 часа).
• Поддержка 2 недели после запуска для корректировок.

Сроки и типичные ошибки

Стоимость full‑stack интеграции с учётом server-side и Session Replay составляет от 150 000 до 350 000 ₽ в зависимости от сложности кастомных воронок и количества платформ.

Свяжитесь с нами — оценим ваш проект и предложим оптимальную конфигурацию. Исходный код SDK доступен на GitHub. Amplitude — это не просто трекер, а инструмент для роста продукта. Закажите внедрение и получите первые инсайты уже через неделю.

Настройка веб-аналитики: GA4, GTM, Яндекс.Метрика и Amplitude

Мы часто видим: конверсия 1.2 %, трафик растёт, а конверсия стоит. Маркетолог смотрит в Google Analytics и говорит: «пользователи уходят с шага 2 оформления заказа». Разработчик открывает тот же шаг — ошибок нет, в Sentry тишина. Значит, дело не в JS-баге, а в UX или в кривых данных, которые показывает аналитика. Аналитика ломается незаметно: событие перестало трекаться после редеплоя — никто не заметил; GTM-тег стреляет дважды — данные задвоились; фильтр GA4 исключает бота, который на самом деле — реальный трафик с корпоративного прокси. Закажите аудит текущих тегов — мы найдём причину за неделю.

После правильной настройки экономия рекламного бюджета может достигать 150 000 ₽ в месяц — это реальный кейс интернет-магазина с 50 000 сессий в день, где дедупликация purchase вернула 20 % неверно приписанных конверсий.

Почему события GA4 дублируются и как это исправить?

Universal Analytics закрыт, его место заняла событийная модель GA4. В ней нет фиксированных хитов страниц и транзакций — только события с параметрами. Это гибче, но требует правильного дизайна событий.

Автоматические события GA4 собирает сам: page_view, scroll, click, session_start. Рекомендуемые события нужно реализовать самостоятельно: purchase, add_to_cart, begin_checkout, view_item. Google ожидает конкретную схему параметров — если передать product_id вместо item_id, данные попадут в GA4, но не в стандартные отчёты e-commerce. Кастомные события для специфики проекта: filter_applied, video_progress, form_step_completed. Кастомные параметры необходимо зарегистрировать в GA4 Admin → Custom definitions, иначе они не будут доступны в отчётах.

Частая ошибка — событие purchase с дублями. Причина: тег срабатывает на странице /thank-you, пользователь обновляет страницу — второй purchase уходит в GA4. Решение: на бэкенде генерируем уникальный transaction_id и передаём в событие. GA4 de-duplicates по нему (в теории — проверяйте через DebugView). Правильная атрибуция экономит до 20 % рекламного бюджета, который раньше уходил на неверно приписанные конверсии.

Как настроить data layer, чтобы не потерять данные?

GTM — инструмент для управления тегами без деплоя кода. Но «без кода» не значит «без архитектуры». Data Layer — основа всего. Передаём данные из приложения в GTM через dataLayer.push(). Структура: event + контекстные данные. Для e-commerce: перед открытием страницы продукта — push с данными товара. GTM-тег читает из dataLayer, не из DOM.

window.dataLayer = window.dataLayer || [];
dataLayer.push({
  event: 'view_item',
  ecommerce: {
    items: [{
      item_id: 'SKU-12345',
      item_name: 'Название товара',
      price: 1990.00,
      currency: 'RUB'
    }]
  }
});

Плохая практика: GTM-тег парсит DOM — ищет цену в span.price, название в h1. Это ломается при любом изменении верстки. Хорошая практика: всегда dataLayer. Используем Preview Mode для отладки и GTM Server-Side для чувствительных данных — отправка с сервера, не с браузера, обходит блокировщики рекламы, не теряет данные.

Как Яндекс.Метрика дополняет веб-аналитику?

Для российской аудитории Метрика обязательна — особенно Вебвизор. Запись сессии пользователя, который бросил корзину, часто даёт ответ быстрее, чем неделя анализа воронки. Цели в Метрике: событийные (через ym(COUNTER_ID, 'reachGoal', 'GOAL_NAME')) или автоматические (клик по кнопке, посещение страницы). Связка с CRM через Метрика Плюс — передача офлайн-конверсий. Наш опыт: в 8 из 10 проектов после настройки Метрики находили скрытые баги в UX, которые не показывали другие системы.

Что даёт product analytics в Amplitude?

Amplitude — продуктовый инструмент, в отличие от маркетинговых GA4 и Метрики. Он заточен под анализ поведения пользователей внутри продукта: воронки, ретеншн, user paths. Amplitude подходит для SaaS-продуктов, мобильных приложений и любых сервисов с зарегистрированными пользователями, где важно понять, как проходят онбординг, на каком шаге уходят, какие фичи используют чаще. Ключевые концепции: identify (связать анонимного пользователя с userId после авторизации), group (аккаунт в B2B SaaS), когорты для удержания. Amplitude Chart — воронка шагов за последние 30 дней с разбивкой по источнику.

Мониторинг качества данных

Аналитика без мониторинга — чёрный ящик. Настраиваем:

• GA4 Realtime — проверяем после каждого деплоя, что ключевые события приходят
• Alerting в GA4 — аномалия в количестве событий purchase (резкое падение = что-то сломалось)
• GTM Preview в staging-окружении перед продакшеном
• Ручные тесты воронок раз в неделю — просто пройти путь покупателя и проверить, что всё трекается

Что проверяем после каждого деплоя

• Все ли рекомендуемые события присутствуют в DebugView
• Нет ли задвоений (считаем количество purchase на 100 сессий)
• Не изменилась ли структура dataLayer после обновления фронтенда

Что входит в работу

Процесс и сроки

1. Аудит текущих тегов и данных (2 дня)
2. Дизайн событийной схемы (2 дня)
3. Разработка Data Layer и настройка тегов (3–5 дней)
4. QA в Preview Mode и на staging (2 дня)
5. Деплой и настройка дашбордов (1 день)

Стоимость рассчитывается индивидуально. Получите консультацию по настройке веб-аналитики для вашего проекта — мы оценим объём работ за один день. Свяжитесь с нами, чтобы начать.

Wikipedia: Веб-аналитика — подробнее о методах и метриках. Официальная документация по событийной модели GA4 доступна в Google Analytics 4.