Аналитика поведения пользователя в редакторе

• Данный раздел содержит инструкцию по анализу поведения пользователей в редакторе дизайнов.

Настройка аналитики

1. В панели управления Pixlpark в разделе "Маркетинг / Сервисы" включить "Яндекс Метрика", в поле "Идентификатор счетчика" запишите его ID из Яндекс Метрики.
2. Для ознакомления с отчётом, перейдите в ваш аккаунт в Яндекс Метрике, в раздел "Отчеты / Популярные / Параметры событий".

• В открывшемся окне нажмите кнопку "Группировки".
• В модальном окне необходимо установить галочку на "Цель "Java Script" Событие", а также отметить первые шесть уровней Параметров события, как на скриншоте ниже.
• Яндекс Метрика ограничивает группировку максимум семью пунктами, возможно, из выбранных по умолчанию придётся удалить лишние.
• После этого нажмите кнопку "Применить".

Пример анализа данных

• Рассмотрим в отчёте поведение пользователей на примере такого действия в редакторе, как добавление изображения на поверхность.
• За указанный период все пользователи при работе на сайте в Desktop версии добавили на поверхность 30 изображений.
• Из них:
  • 22 раза методом "Drag&Drop" (перетаскивание мышкой),
  • 5 раз нажали на кнопку в верхней панели,
  • 3 раза нажали на кнопку добавления изображения в боковой панели.
• При этом аналогичное действие в мобильной версии сайта выполнили всего 11 раз, и все пользователи добавляли изображение методом нажатия кнопки в верхней панели.

События аналитики

• События сгруппированы по категориям для удобства восприятия. Каждое событие сопровождается кратким описанием, отражающим, что делает пользователь.

Общие действия с элементами

• • Element Copy (Копирование элемента): Пользователь копирует элемент на поверхности.
  • Element Cut (Вырезание элемента): Пользователь вырезает элемент с поверхности.
  • Element Duplicate (Дублирование элемента): Пользователь дублирует элемент на поверхности.
  • Element Paste (Вставка элемента): Пользователь вставляет элемент на поверхность.
  • Element Remove (Удаление элемента): Пользователь удаляет элемент с поверхности.
  • Element Backward (Перемещение элемента назад): Пользователь перемещает элемент на задний план.
  • Element Forward (Перемещение элемента вперед): Пользователь перемещает элемент на передний план.
  • Element Position Change (Изменение позиции элемента): Пользователь изменяет позицию элемента.

Группировка и разгруппировка

• • Group Elements (Группировка элементов): Пользователь группирует несколько элементов.
  • UnGroup Elements (Разгруппировка элементов): Пользователь разгруппирует элементы.

Действия с историей

• • History Back (Шаг назад): Пользователь отменяет последнее действие.
  • History Forward (Шаг вперед): Пользователь повторяет отмененное действие.

Взаимодействие с интерфейсом

• • Student Picker Shown (Показан выбор студентов): Пользователь открывает инструмент выбора студентов.
  • Surface Rotated (Повернута поверхность): Пользователь поворачивает рабочую поверхность.
  • Surface Size Change Shown (Показан инструмент изменения размера поверхности): Пользователь открывает настройки размера поверхности.
  • Full Screen Toggle (Переключение полноэкранного режима): Пользователь включает или выключает полноэкранный режим.
  • Full Window Toggle (Переключение полнооконного режима): Пользователь включает или выключает полнооконный режим.
  • Eye Dropper Click (Клик пипеткой): Пользователь использует инструмент "пипетка".
  • Alert Shown (Показан алерт): Пользователю отображается уведомление об ошибке на элементе.
  • Helplines Toggle (Переключение вспомогательных линий): Пользователь включает или выключает вспомогательные линии.

Управление проектом и поверхностями

• • Clear Project (Очистка проекта): Пользователь очищает весь проект.
  • Clear Surface (Очистка поверхности): Пользователь очищает текущую поверхность.
  • Clear Project Placeholders (Очистка заполнителей проекта): Пользователь очищает плейсхолдеры всего проекта.
  • Clear Surface Placeholders (Очистка заполнителей поверхности): Пользователь очищает плейсхолдеры текущей поверхности.
  • Surfaces Rearranged (Перестановка поверхностей): Пользователь изменяет порядок поверхностей.
  • Surface Duplicate (Дублирование поверхности): Пользователь дублирует поверхность.
  • Surface Remove (Удаление поверхности): Пользователь удаляет поверхность.
  • Surface Add (Добавление поверхности): Пользователь добавляет новую поверхность.

Действия с навигатором

• • Navigator Show Toggle (Переключение видимости навигатора): Пользователь показывает или скрывает навигатор.
  • Navigator Duplicate Surface (Дублирование поверхности в навигаторе): Пользователь дублирует поверхность через навигатор.
  • Navigator Clear Surface (Очистка поверхности в навигаторе): Пользователь очищает поверхность через навигатор.
  • Navigator Delete Surface (Удаление поверхности в навигаторе): Пользователь удаляет поверхность через навигатор.

Действия с масштабом

• • Zoom In (Увеличение масштаба): Пользователь увеличивает масштаб.
  • Zoom Out (Уменьшение масштаба): Пользователь уменьшает масштаб.
  • Zoom Fit (Сбрасывание масштаба): Пользователь сбрасывает масштаб под содержимое.
  • Zoom To Zone (Масштаб к зоне): Пользователь приближает определенную зону.
  • Zoom To Grid (Масштаб к сетке): Пользователь переключает масштаб на вид с календарной сеткой.
  • Zoom To Not Grid (Масштаб без сетки): Пользователь переключает масштаб на вид без календарной сетки.

Действия с изображениями

• • Add Image To Surface (Добавление изображения на поверхность): Пользователь добавляет изображение на поверхность.
  • Set Image Content (Установка содержимого изображения): Пользователь задает содержимое изображения.
  • Set Image Element As Background (Установка изображения как фона): Пользователь устанавливает изображение как фон.
  • Image Content Remove (Удаление содержимого изображения): Пользователь удаляет содержимое изображения.
  • Frame Setted (Установка рамки): Пользователь применяет рамку к изображению.
  • Image Replace (Замена изображения): Пользователь заменяет изображение.
  • Image Opacity (Прозрачность изображения): Пользователь изменяет прозрачность изображения.
  • Image Mirror (Зеркальное отображение изображения): Пользователь зеркально отражает изображение.
  • Image Filter Shown (Показан фильтр изображения): Пользователь открывает настройки фильтров изображения.
  • Image Filter Change (Изменение фильтра изображения): Пользователь изменяет фильтр изображения.
  • Image Moving Hand Used (Использование инструмента перемещения): Пользователь перемещает содержимое изображения с помощью "руки".

Действия с текстом

• • Add Text To Surface (Добавление текста на поверхность): Пользователь добавляет текст на поверхность.
  • Text Font Shown (Показан выбор шрифта): Пользователь открывает выбор шрифта.
  • Text Font Change (Изменение шрифта): Пользователь изменяет шрифт текста.
  • Text Style Change (Изменение стиля текста): Пользователь изменяет стиль текста (например, жирный, курсив).
  • Text Font Size Change (Изменение размера шрифта): Пользователь изменяет размер шрифта.
  • Text Color Change (Изменение цвета текста): Пользователь изменяет цвет текста.
  • Text Settings Shown (Показаны настройки текста): Пользователь открывает настройки текста.
  • Text Line Height Change (Изменение высоты строки): Пользователь изменяет высоту строки текста.
  • Text Align Change (Изменение выравнивания текста): Пользователь изменяет выравнивание текста.
  • Text Effect Shown (Показаны эффекты текста): Пользователь открывает настройки эффектов текста.
  • Text Effect Reset (Сброс эффектов текста): Пользователь сбрасывает эффекты текста.
  • Text Effect Shadow (Тень текста): Пользователь добавляет тень к тексту.
  • Text Effect Hover (Эффект при наведении): Пользователь добавляет эффект парения к тексту.
  • Text Effect Outline (Контур текста): Пользователь добавляет обводку к тексту.
  • Text Effect Background (Фон текста): Пользователь добавляет фон к тексту.
  • Text Effect Gradient (Градиент текста): Пользователь добавляет градиент к тексту.
  • Text Mobile Settings Shown (Показаны мобильные настройки текста): Пользователь открывает настройки текста для мобильных устройств.

Действия с шаблонами

• • Apply Template Set (Применение набора шаблонов): Пользователь применяет набор шаблонов.
  • Apply Template Item (Применение элемента шаблона): Пользователь применяет отдельный элемент шаблона.
  • Template Tag Used (Использование тега шаблона): Пользователь использует тег шаблона.
  • Template Selection Modal Close (Закрытие модального окна выбора шаблона): Пользователь закрывает окно выбора шаблона.
  • Template Selection Modal Empty Template (Выбор пустого шаблона): Пользователь выбирает пустой шаблон в модальном окне.
  • Template Selection Modal Apply Template (Применение шаблона из модального окна): Пользователь применяет шаблон из модального окна.

Действия с фоном

• • Add Background (Добавление фона): Пользователь добавляет фон.
  • Accept Fill Backgrounds (Принятие заливки фона): Пользователь подтверждает заливку фоном всего проекта.
  • Reject Fill Backgrounds (Отклонение заливки фона): Пользователь отклоняет заливку фоном всего проекта.
  • Add Background Color (Добавление цвета фона): Пользователь добавляет цвет фона.
  • Background Flip (Переворот фона): Пользователь отзеркаливает фон.
  • Background Effects (Эффекты фона): Пользователь применяет эффекты к фону.
  • Set User Background (Установка пользовательского фона): Пользователь устанавливает свой фон.
  • Reset Background (Сброс фона): Пользователь сбрасывает настройки фона.
  • Duplicate Background (Дублирование фона): Пользователь дублирует фон.
  • Background Opacity (Прозрачность фона): Пользователь изменяет прозрачность фона.

Действия с коллажами

• • Add Collage To Surface (Добавление коллажа на поверхность): Пользователь добавляет коллаж на поверхность.
  • Collage Image Add (Добавление изображения в коллаж): Пользователь добавляет изображение в коллаж.
  • Create Collage Out Of Images (Создание коллажа из изображений): Пользователь создает коллаж из изображений.
  • Collage Image Carousel (Карусель изображений коллажа): Пользователь использует карусель изображений в коллаже.
  • Collage Spacer Change (Изменение отступов в коллаже): Пользователь изменяет отступы в коллаже.
  • Collage Row Column Size Change (Изменение размера строк/столбцов коллажа): Пользователь изменяет размер строк или столбцов коллажа.
  • Collage Add Image Row Column (Добавление изображения в строку/столбец коллажа): Пользователь добавляет изображения в строку или столбец коллажа.
  • Collage Ungroup (Разгруппировка коллажа): Пользователь разгруппирует коллаж.
  • Collage Layout Change (Изменение макета коллажа): Пользователь изменяет макет коллажа.
  • Collage Settings Shown (Показаны настройки коллажа): Пользователь открывает настройки коллажа.

Действия с календарями

• • Calendar Add Grid (Добавление сетки календаря): Пользователь добавляет сетку календаря.
  • Calendar Settings Changed (Изменение настроек календаря): Пользователь изменяет настройки календаря.
  • Calendar Add Image (Добавление изображения в календарь): Пользователь добавляет изображение в день календарной сетки.
  • Calendar Event Modal Shown (Показан модальный диалог событий календаря): Пользователь открывает окно событий календаря.
  • Calendar Day Clear Image (Очистка изображения дня): Пользователь удаляет изображение из дня календаря.
  • Calendar Period Change Shown (Показан выбор периода календаря): Пользователь открывает выбор периода календаря.

Действия с другими элементами

• • Add Sticker To Surface (Добавление стикера на поверхность): Пользователь добавляет стикер на поверхность.
  • Add Clipart To Surface (Добавление клипарта на поверхность): Пользователь добавляет клипарт на поверхность.
  • Add Picture To Surface (Добавление картинки на поверхность): Пользователь добавляет картинку на поверхность.
  • Add User Picture To Surface (Добавление пользовательской картинки на поверхность): Пользователь добавляет свою картинку на поверхность.

Прочее

• • Issues (Проблемы): Пользователь открывает панель с ошибками.
  • Context Menu Shown (Показан контекстное меню): Пользователь открывает контекстное меню.

Контексты событий (AnaliticEventsContext)

• Контексты указывают, как или откуда было инициировано событие. Они помогают понять, каким способом пользователь взаимодействует с приложением.
  • Short Cut (Горячая клавиша): Действие выполнено с помощью клавиатурной комбинации.
  • Context Menu (Контекстное меню): Действие выбрано из контекстного меню (например, правый клик).
  • Context Panel (Контекстная панель): Действие инициировано из панели, появляющейся над элементом.
  • Top Panel (Верхняя панель): Действие выполнено из верхней панели интерфейса.
  • Side Panel (Боковая панель): Действие выполнено из боковой панели интерфейса.
  • DragNDrop (Перетаскивание): Действие инициировано перетаскиванием элемента.
  • Double Click (Двойной клик): Действие вызвано двойным кликом мыши.
  • Button (Кнопка): Действие инициировано нажатием на кнопку.
  • Swiper (Свайпер): Действие вызвано использованием слайдера.
  • Collage Control (Управление коллажем): Действие инициировано из элементов управления коллажем.
  • None (Нет контекста): Контекст не применим или не указан.
  • Placeholder Swap (Обмен местами плейсхолдеров): Действие связано с обменом местами плейсхолдеров.
  • Layer Position (Позиция слоя): Действие связано с изменением порядка слоев.
  • DropDown (Выпадающее меню): Действие выбрано из выпадающего меню.
  • Element Control (Управление элементом): Действие инициировано из элементов управления конкретным элементом, например:
  • Navigator (Навигатор): Действие инициировано из навигатора.
  • Navigator DropDown (Выпадающее меню навигатора): Действие выбрано из выпадающего меню в навигаторе.
  • Navigator DragNDrop (Перетаскивание в навигаторе): Действие инициировано перетаскиванием в навигаторе.
  • SurfaceControl (Управление поверхностью): Действие инициировано из элементов управления поверхностью.
  • PreviewModal (Модальное окно предпросмотра): Действие инициировано из модального окна предпросмотра.
  • Wheel (Колесико мыши): Действие вызвано прокруткой колесика мыши (например, для масштабирования).
  • Font List Model (Модель списка шрифтов): Действие связано с выбором шрифта из списка.
  • Mobile Text Settings (Настройки текста для мобильных устройств): Действие инициировано из настроек текста для мобильных устройств.
  • Style DropDown (Выпадающее меню стилей): Действие выбрано из выпадающего меню стилей.