Записываем действия пользователей правильно
Как отследить поведение пользователя в приложении
Любой разработчик должен понимать, как люди используют продукт, который он для них создал. Зачастую анализа сухих статистических данных, которые предоставляют нам Google Analytics и Mixpanel, или же просмотра записей пользовательских сессий, которые реализованы с помощью сервисов Mouseflow, Crazy Egg, Yandex WebVisor, SessionCam, Inspectlet, оказывается недостаточно.
Как правило, последние перечисленные ресурсы используются для записи сессий пользователей на простых сайтах. По сути, они всего лишь записывают положение курсора пользователя и текущее положение бегунка полосы прокрутки. Современные же веб-проекты зачастую работают таким образом, что пользовательские данные получаются через WebSockets или WebRTC, на страницах присутствует много динамических элементов и анимационных эффектов, реальное состояние которых невозможно воспроизвести.
Когда мы пытались подключить каждый из этих сервисов к своему продукту, мы столкнулись с проблемой — оказалось невозможно записать сессию пользователя: как на одностраничном HTML5 сайте с эффектом параллакса, так и в самом приложении, использующем Angular, Backbone или что-то схожее. Еще одной проблемой большинства таких записывающих сервисов является то, что они фиксируют абсолютно все сессии пользователей, и в итоге выбрать нужную сессию из их огромного количества оказывается очень сложно.
Мы хотели иметь возможность пригласить к тестированию продукта конкретного пользователя.
На каком-то этапе работы мы пробовали использовать устанавливаемое ПО для тестирования, например, Silverback, но впоследствии нам пришлось отказаться от него, потому что возникли проблемы с кросс-платформенностью (на данный момент работает только для Mac OS 10.6-10.8). Существенными минусом также была необходимость покупки лицензии для каждого пользователя, участвовавшего в тестировании, и потребность установки дополнительного ПО для пользователя.
Выводы о работе с сервисами, записывающими действия пользователей, которые мы можем сделать:
- Технологии захвата и записи действий пользователя работают некорректно на сложных сайтах.
- Невозможно обработать и воспроизвести состояние динамических элементов на странице.
- HTML5 routing, страницы с элементами анимации не будут корректно отображаться.
- Остро стоит проблема поиска нужной сессии из сохраненного материала. Как выбрать нужную сессию из 100000 записанных?
- Устанавливаемые программы для записи видео неудобны, и в нашем случае имели слабую совместимость.
Когда вам требуется правильный инструмент
В нашем случае на рынке не нашлось подходящего решения, способного решать задачи отслеживания поведения пользователей эффективно. Существующие сервисы имели ряд недостатков, поэтому нам нужен другой инструмент — универсальное решение, которые позволяло бы записывать сессии пользователей без использования веб-камер и стороннего ПО и не требовало бы их присутствия в месте проведения тестирования.
Поэтому мы решили создать его сами. К тому моменту за плечами у нашей команды уже был большой опыт работы над сервисом, позволяющим визуально комментировать сайты и изображения, и мы понимали, что новый инструмент записи поведения пользователей наверняка будет востребованным решением и займет свою нишу на рынке.
Правильный инструмент — свой собственный!
Мы начали с того, что сделали прототип сервиса, который позволял записывать происходящее на экране пользователя в режиме реального времени и в достаточно неплохом качестве сохранять это на сервере. Затем добавляли функционал — приглашения пользователей с помощью сгенериронной ссылки, возможность проведения тестирования на целевых группах пользователей. Ну и то, чем мы действительно гордимся — для установки и использования инструмента достаточно всего лишь вcтроить JS-код на сайт (аналогично устанановке Google Analytics) и оправить ссылку пользователю.
Итак, наше решение записи действий пользователей позволяет снимать короткие отчеты об ошибках, например, в анимированных переходах, hover-эффектах, а также на страницах с любым динамическим контентентом.
На данном этапе инструмент доступен как часть нашего более масштабного проекта TrackDuck. Сейчас мы работаем над добавлением к видео голосовых комментариев пользователей. Чуть позже мы планируем выложить в открытый доступ инструмент для записи неограниченных по времени видео, который будет очень востребован в UX тестировании.
Преимущества нашего инструмента:
- для записи видео не требуется установки стороннего ПО, веб-камеры или другого “железа”;
- сервис позволяет приглашать определенных пользователей;
- удобное управление всеми записями.
Как это сделано?
Мы использовали возможности, которые предоставляет WebRTC. Он позволяет получить доступ на запись к микрофону, веб-камере, рабочему столу пользователя через api браузера. До недавнего времени этот стандарт находился в разработке и для использования требовал включить специальную опцию в настройках браузера. Но начиная с версии 36 в Google Chrome по умолчанию включен доступ к этому api для всех пользователей. Opera и Firefox также работают над выпуском этой технологии.
Ограничения
Как и любая новая технология, решение имеет несколько ограничений:
- https only
Это достаточно легко обойти, включив запись видео на любом сайте с https и переключив вкладку браузера, ведь записывается полностью весь рабочий стол пользователя. - Пока стабильно работает только google chrome
Но мы надеемся, что Firefox и Opera скоро представят свои рабочие решения. Кроме того, есть возможности эмулировать запись видео, используя html2canvas или расширения для этих браузеров. - Временное ограничение длительности записи
На периуд тестирования мы ограничили продолжительность записываемых сессий до нескольких десятков секунд. Но уже сейчас мы тестируем версию без ограничений по времени.
Хотите принять участие в тестировании?
- Зарегистрируйтесь на TrackDuck.com (бесплатно);
- Сообщите нам о том что хотите принять участие в тестировании
