Soax. Личный кабинет клиента

О клиенте

Soax — один из крупнейших в мире поставщиков прокси-серверов для бизнеса.

Основной продукт Soax — Residential Rotating Back-connect Proxies. Это премиальные прокси, которые предоставляют пользователям реальные IP-адреса от настоящих операторов связи. Их практически невозможно заблокировать, поэтому они более надёжны в работе. Soax обладает эксклюзивным пулом из более 8M IP-адресов по всему миру.

Задача

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

В рамках этой задачи предстояло:

  • решить проблемы с логикой интерфейса (облегчить запутанную структуру, в которой клиентам приходилось разбираться самостоятельно; выделить пользовательские сценарии и проработать их);
  • упростить систему покупки трафика;
  • разработать адаптивную версию личного кабинета под мобильные устройства;
  • вовлечь и мотивировать пользователей продолжить работу в сервисе. Многие клиенты не пользовались продуктом после покупки: им необходимо было помочь с настройкой, подсказать дальнейшие шаги, предложить техподдержку.

Бизнес-анализ 

Для начала провели глубинное интервью с клиентом. Выяснили, что прокси может использоваться как для легальных вещей, так и нелегальных. Вторых Soax строго отсекает. Для этого новым пользователям при регистрации аккаунта нужно пройти проверку KYC (Know Your Customer — верификацию личных данных). 

Часть конкурентов перед доступом к прокси проводят сложную проверку с предоставлением личных документов (паспорт, банковская карта, фотография документа регистрации ИП) и только после этого предоставляют доступ. В Soax этот процесс выстроен максимально персонализированно и быстро. Компания предоставляет тестовый доступ к системе, чтобы можно было проверить, подходит ли её функционал для решений задач пользователей или нет.

Конкурентный анализ

Сделали в двух видах. Первый — сравнительная таблица функциональности, UX-решений, UI-решений, маркетинга и бизнес-решений. Второй — текстовый документ-выжимка из первого, где мы подробно описали наиболее важные моменты.


Анализ UX-решений проводили на базе эвристик Якоба Нильсена. В ходе конкурентного анализа получили много интересных инсайтов. Например, стало понятно, что при регистрации большинство конкурентов проводят скоринг (оценку) своих пользователей и запрашивают тип использования прокси. У всех конкурентов есть онбординг, чат технической поддержки, а некоторые выделяют персонального менеджера. Все конкуренты ведут статистику потраченного трафика, отображают информацию о балансе. Настройку прокси конкуренты выносят в отдельный раздел личного кабинета, где она представлена в виде шагов.

Разработка пользовательских сценариев

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

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


Архитектура навигации сервиса

Разработали карту разделов и страниц личного кабинета для понимания навигации. К ней же обращались в дальнейшем для проверки сценариев. Проверяли, удобно ли с такой навигацией двигаться назад и вперёд по сценариям.


Интерфейсные решения

→ Дашборд

Наиболее сложная и нагруженная страница личного кабинета, у которой есть три состояния.

Первое: пользователь зарегистрировался, но ещё не купил подписку.

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


Второе: подписка куплена, но пользователь ещё не настроил прокси.

Задача этого дашборда — направить пользователя в раздел с прокси.


Третье (самое нагруженное состояние): трафик с прокси начал расходоваться.

Цель этого дашборда — показать, сколько трафика и портов осталось, дать возможность поделиться трафиком из подписки, продемонстрировать трату трафика каждым из субаккаунтов. А также сообщить пользователю, что его трафик подходит к концу. На дашборде в третьем состоянии у пользователя есть возможность докупить трафик или перейти на повышенную подписку.


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


→ Настройка прокси

К настройке прокси обращаются два типа клиентов. Одним нужен только логин, пароль и порт. Для других этих настроек недостаточно — они хотят получить прокси из конкретной страны или даже целый список прокси.

Для удовлетворения потребности двух групп пользователей мы разделили страницу на две вкладки: Quick access (Быстрый доступ) и Export proxy list (Получить список прокси). В двух вкладках дали возможность настроить фильтр по странам, но при этом в Quick access задействовано минимальное количество элементов управления (контролов), что позволяет разобраться даже новичку. Для более продвинутых пользователей предусмотрены расширенные настройки в Export proxy list.


Нам пришлось изучить все связи между контролами и тем, как они влияют на финальный результат. В итоге у нас получилась одинаковая структура для двух вкладок: сначала идут настройки, а в конце — результат этих настроек.


Также мы предусмотрели все состояния контролов и подсказки к ним для избежания ввода неверных настроек. Например, если пользователь решил авторизоваться через свой IP, но до этого не верифицировал его и не добавил в «белый лист», то система не позволит ему получить список IP-адресов. При выборе авторизации по IP пользователь сразу увидит сообщение о необходимости проверить свой IP, если он уже внес его, и добавить новый, если не сделал этого ранее.


Покупка подписки и финансы

В процессе выбора нужной подписки клиенту необходимо подобрать подходящий ему тариф или настроить свой, не сомневаясь в правильности решения. Поэтому мы добавили на страницу, помимо стандартных карточек с тарифными планами, таблицу сравнения тарифов. Включили информацию о том, какой тариф подходит для разных случаев использования. Для сомневающихся добавили подробный FAQ, основанный на часто задаваемых вопросах к техподдержке.


Для контроля финансовых операций пользователю доступен раздел «Финансы», где он может посмотреть свои оплаты, скачать документы или пополнить баланс альтернативными способами — например, биткоинами или через PayPal.


Сейчас все пополнения баланса происходят вручную, мы проанализировали существующие решения на рынке и предложили автоматизированные сервисы пополнения баланса.

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


Онбординг и уведомления

Из-за сложности продукта сделали 3 варианта онбординга новых пользователей.

Первый вариант: пошаговый

Интерфейс подсказывает пользователю, что он должен сделать дальше для достижения результата. Например, пока пользователь не оплатил услуги, все разделы закрыты, а доступны только help-центр и возможность купить подписку. Продвигаясь по этапам, пользователь кликает «Далее», а в завершении ему предлагается перейти в раздел настройки прокси.


Второй вариант: обучающий

Рядом с каждым заголовком на странице есть вопросительный знак. При нажатии на него пользователь видит подсказку с информацией об этом разделе. При первом входе в систему онбординг включается автоматически. Для всех последующих входов мы вывели в шапку личного кабинета иконку для повторного запуска онбординга.


Третий вариант: с геймификацией процесса

Взяв за основу сценарии использования ЛК, мы проработали шаги, при прохождении которых пользователю начисляются баллы. Каждый шаг дополнен ссылками на хелп-центр и техподдержку на случай, если у пользователя возникли трудности. Пройдя все шаги, пользователь получает ачивку или бонус. Задачу разработки системы премирования клиент взял на себя.



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

Уведомления являются частью обучающей системы, но имеют более широкие функции. Они информируют о состоянии подписки, о зачислении денежных средств и других данных, которые важно знать пользователю. Уведомления держат пользователя в курсе событий независимо от того, в каком разделе ЛК он находится.


Спецификации экранных форм

После завершения этапа проектирования и дизайна требовалось передать все решения команде разработки. Для этого мы написали спецификации. В них подробно описали каждый элемент готового макета, а также собрали все артефакты, созданные нами на этапе аналитики, проектирования и дизайна.


Результат

За 4 месяца работы над проектом мы погрузились в сферу бизнеса клиента, разобрались в продукте и решили ряд интерфейсных задач:

  • Выделили пользовательские сценарии, проработали по ним интерфейсы, разбили процессы на отдельные этапы.
  • Адаптировали личный кабинет для новой системы оплаты в формате ежемесячной подписки.
  • Спроектировали интерфейсы, которые легко адаптируются под планшеты и мобильные устройства. Использовали модульную технику построения контента, которая строится из отдельных блоков.
  • Вынесли настройку прокси в отдельный раздел, добавили вкладки для новичков и опытных пользователей.
  • Продумали и реализовали тройную систему онбординга.

Soax. Личный кабинет клиента

Сделано в Россия

Design

Tech

Usability

Creativity

Content

Тип проекта: Веб-сайт
Страна: Россия
Категория: Реклама и маркетинг
Стиль: Big photo
Цвет: Красный