Прошел первый месяц жизни нашего второго продукта и откровением этого периода стал Яндекс.Вебвизор. Почему — в этой статье с подробностями.

В прошлой статье я рассказал о том с чего мы начинали, как пришли к тому, чтобы вынести сервис из основного продукта и что получилось после первой итерации.

В этой статье:

  • Итого первого месяца в цифрах;
  • Обновленный UI/UX личного кабинета (+Яндекс.Вебвизор);
  • Что дальше?

Итоги первого месяца в цифрах

Хотелось бы начать с показа изменений трафика на сервис после первой публикации на vc.ru:

Вот и данные по распределению источников регистраций:

Всего на сервисе зарегистрировалось 67 пользователей (включая меня).

Количество созданных пользователями сценариев — 51, а количество разработанных на продажу шаблонов скриптов продаж на этапе модерации — 34.

Не «уау», но и не так, чтобы огорчиться. Даже такое небольшое количество пользователей помогло нам лучше понять модель поведения того, кто работает в нашем сервисе.

Обновленный UI/UX личного кабинета и роль Яндекс.Вебвизора

К сожалению я не сразу догадался, что будет полезно фиксировать изменения в формате «до» / «после», поэтому единственная запись, которая осталась со старым интерфейсом — видео-инструкция на YouTube.

Просмотр приведённой видео-инструкции на скорости х2 даст лучшее понимание техник, которые использовали ниже.

Итак, урок №1:

Никто не смотрит видео-инструкции, а если и смотрит, то первые несколько секунд.

Капитан Очевидность

Если вы обратите внимание, то заметите на самом сайте Telly крупные кнопки «Play», кликнув на которые отобразится всплывающее окно с видео-инструкцией по работе в личном кабинете (конструкторе), но особенность в том, что в кабинете ссылок на это видео просто нет!

Несмотря на то, что некоторые пользователи всё-таки открывали видео, досматривать они его не собирались и сразу прыгали экспериментировать с редактором натыкивая себе какой-то сценарий.

Решение: сразу в момент регистрации пользователя в личном кабинете мы создаём ему тестовый сценарий с простейшей логикой и понятным названием «Тестовый сценария для обучения использования Telly» (примерно так).

В результате получаем:после регистрациипользовательвидит сценарий с понятным названием, незамедлительно его открывает, видит примеры реплик и вопросов, начинает «натыкивать» уже в нём. Этим подходом нам удалось затянуть пользователя «глубже» в воронку реализации и использования сценария, увеличить время нахождения в кабинете и взаимодействию с сервисом.

Вывод: обучение в процессе работы.

Теперь давайте поговорим о «слепых зонах» пользователя (или «элементной слепоте» — термин на ходу придумал, кто профи — подправьте).

Внимание, «после»:

На что вы первым делом обращаете внимание? Куда смотрите? Какие элементы вам бросаются в глаза?

Итак, урок №2:

Пользователь не обязан знать, что значит твоя иконка без подписи.

Капитан Очевидность

Обратите внимание, что в правом нижнем углу есть кнопка «Редактировать», а раньше там было два «кругляшка» с иконками при наведении на которые появлялась подсказка «Редактировать».

Просматривая Яндекс.Вебвизор я ужаснулся, какое огромное количество пользователей судорожно дергали мышкой и тыкали везде, чтобы найти режим редактирования, но ТАК И НЕ ЗАМЕЧАЛИ синюю иконку с ручкой / пером. Катастрофа!

Решение: если это возможно — добавляйте текстовое описание элемента сразу. Оставляйте без подписи только самые универсальные иконки — копировать, вставить, вырезать, удалить, закрыть и т.п.

Сделаем ещё один шаг на пути совершенствования пользовательского интерфейса. Смотрим редактор.

Анализируйте паттерны в действиях пользователей — из точки А в точку Б, вырезайте всё лишнее между.

На этот момент мне удалось обратить внимание только благодаря одной 2 часовой записи в Вебвизоре пользователя из Санкт-Петербурга. Представьте, что 4х кнопок с правой стороны нет — назовите проблему в интерфейсе.

Увидели? Замечательно!

Именно поэтому и появились 2 дополнительные кнопки с правой стороны + возможность воспользоваться быстрыми клавишами (те самые любимые шорткаты):

Как по-вашему, почему мы не убрали кнопки «Добавить» из серых полос?

Итак, урок №3:

Не разрывайте старые паттерны, а дополняйте.

Капитан Очевидность

Ещё одна отличная реализация паттерна сокращения пути от точки А к точке Б. Внимание, экран редактирования реплики:

Сомневаюсь, что не-профессионал заметит здесь элементы, которые оказались самыми важными.

Заметили?

«+2 ответа» и «+3 ответа» — решение, которое было реализовано только после того, как один из пользователей добавил 12 вариантов ответа, а затем я специально пересмотрел другие записи Вебвизора. Отсматривал именно моменты работы с ответами. Бинго, у нас новая оптимизация!

Итак, урок №4:

Пользователь не дурак, у него картина мира другая.

Капитан Очевидность

И несколько пунктов, которые не касаются UI/UX, но дают возможность нашим пользователям эффективнее решать задачи:

Встраивание интерактивных элементов в сценарий:

Можете поработать с интерактивной картой прямо из сценария. Откройте вопрос «По какому адресу вы находитесь?»:

Итак, урок №5:

Ваш сервис не то, зачем вы его сделали, а то, зачем его используют.

Капитан Очевидность

Что дальше?

А дальше примерно такой план:

  • Аналитика
  • Интеграция с CRM
  • Локализация

Если вам понравилась статья или у вас есть дополнения — напишите комментарий, мне будет интересно узнать о том, как лучше разрабатывать сервисы для людей!

Зарегистрироваться на сервисе можно по этой ссылке.

Хорошего утра / дня / вечера!

Источник: vc.ru

Оставить комментарий

avatar
  Подписаться  
Уведомление о