Анализ странных интерфейсов: СберМегаМаркет

Анализ странных интерфейсов: СберМегаМаркет

Меня зовут Татьяна Конюшенко, я — арт-директор Студии Валерия Комягина. Мы создаем крутые цифровые решения для бизнеса, в том числе для e-commerce, и оказываем услуги digital-консалтинга.

Эта статья появилась благодаря моему личному опыту использования сервиса и эмоциям, которые этот опыт вызвал. Я провела анализ интерфейса СберМегаМаркета сначала с позиции обычного пользователя, а затем с позиции проектировщика интерфейсов. Предложила улучшения, которые могут существенно помочь покупателям, а поэтому и самому сервису.

С чего всё началось: личный опыт

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

В моем случае это был Сбербанк. В предложении банка в числе других бонусов фигурировали 1000 рублей, которые можно потратить на заказ в новом маркетплейсе — СберМегаМаркете.

Конечно, я захотела этим воспользоваться.

Но не смогла.

Почему?

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

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

В общем, набрать товары (и воспользоваться бонусом) у меня так и не получилось.

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

В процессе заказа мы столкнулись с тем, что:

  • выбранные нами барные стулья заказать с доставкой нельзя — можно только выбрать магазин на карте и приехать за стульями лично;
  • заменив модель, на этапе корзины мы столкнулись с тем, что в наличии есть только 1 стул;
  • мы выбрали третьи стулья, но снова только в корзине появилась информация, что мебель нужно ждать 10 дней.

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

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

Эта печальная история и послужила катализатором для написания данной статьи.

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

1. Знакомство. Главная страница

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

И начались проблемы

Я набрала в поисковой строке на телефоне sbermegamarket — и перешла на сайт. Первое, что увидела — это предложение войти.

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

Первое ощущение — всё очень мелко. Крошечные иконки в верхнем меню — мой палец закрывает сразу две. Это точно маркетплейс? Я вижу маленькие, шустро меняющиеся баннеры сверху, микрорекламу внизу и всего 6 категорий товаров. Всё разъехалось по экрану и смотрится довольно грустно.

На первом баннере написано «Получите товар уже сегодня». У меня ощущение, что я случайно попала в СберМаркет. Он тоже доставляет еду из разных магазинов за два часа, а цвета и стилистика сервиса такие же, как на баннере.

Проверяю — нет, адресная строка заполнена правильно.

Скролю вниз — вижу товар дня. Конвектор! Как интересно. А что это?

Предлагая мне рандомный товар дня, вы не попали в меня и в мои запросы. Лишь вызвали моё недоумение.

Сам заголовок обещает повышенный кэшбэк, а внизу бегут секунды, намекая, что предложение скоро закончится. Интересно, какой тут кэшбек? Может быть, целых 5 228 рублей вернется мне на карту? Ладно, мне конвектор, чем бы они не был и сколько бы денег не принес, все равно не нужен.

Если скролить по странице дальше, можно увидеть разрозненные товары из разных категорий. Ничем не объединенные, но почти все со скидками. В таком количестве они (скидки) не вызывают никаких эмоций. Или наоборот, закрадывается сомнение в честности такого сплошного «фестиваля скидок».

Возможные решения

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

Главное, что можно сделать, чтобы упростить жизнь покупателям:

  • Убрать приветственный экран, на который попадает человек, впервые зашедший в СберМегаМаркет. Этот экран работает как тормоз, а не как газ. Потому что вместо мотивации или знакомства начинает вымогать контактные данные.
  • Увеличить иконки в шапке и рекламные баннеры. На иконки очень тяжело попасть пальцем, а на мелких баннерах почти ничего не видно.
  • Открыть поиск строкой. В таком маркетплейсе бОльшая часть людей будет пользоваться им постоянно, зачем вынуждать делать лишние «клики» и искать в категориях?
  • Попасть «товаром дня» в нового клиента очень тяжело — о нем пока ничего не известно. Лучше показать сразу несколько товаров, а еще лучше — дать ссылку на всю акционную категорию. Тогда охват получится намного шире.
  • Добавить товары БЕЗ акции и сгруппировать их (товары) по смыслу. Если сервис выводит только товары с акциями, посетителю кажется, что это либо аутлет, либо обман. Сплошные акции теряют свой смысл. Чтобы так не казалось, нужно, чтобы в интерфейсе присутствовали и товары с акциями, и товары без акций. Тогда акции станут выглядеть честными и выгодными.

2. Начинаю поиск

Проблемы

Я раскрыла бургер-меню, чтобы посмотреть, какие возможности оно предлагает. В меню их очень много. А вот поиска почему-то не предусмотрено.

Зато вверху есть какой-то «0» и что-то желтое рядом. Интересно, «ноль» — это что, я? Это даже немного обидно. И непонятно.

Окей, здесь слишком много категорий, я решаю вернуться на главную и воспользоваться той крошкой-иконкой с лупой.

Открылся маленький скромный поиск. Попробую найти холодильник.

Хочу удалить свой запрос. Но как это сделать? Здесь можно только «отменить», но тогда поиск скроется, а не очистится.

Передо мной все холодильники. Или не все? Кнопка «Искать везде» говорит о том, что я искала не по всему каталогу, а только в «двухкамерных холодильниках». Если я хотела компактный автомобильный холодильник, то здесь его нет.

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

Интересно, что такое холодильники side by side? Выберу их.

Оказывается, это широкие холодильники с двумя дверцами. И опять все акционные! Наверное, на этой площадке все товары со скидками? Может, это вообще что-то вроде аутлета?

В каждой карточке есть желтая плашка с процентами и вторым числом и кружочками. Может, это что-то вроде рассрочки?

И снова эти одинаковые кнопки «Получить сегодня» и «Купить». Если я не хочу покупать сегодня, а хочу завтра, то я не могу приобрести верхний в списке холодильник за 139 тысяч? Непонятно.

Возможные решения

  • Добавить в шапку сайта ссылку «Войти», чтобы пользователь мог сразу найти личный кабинет. Это выгодно и самому сервису, и человеку, если он хочет авторизоваться. Сложно догадаться, что входом в ЛК служит «0» в открытом каталоге.
  • Добавить поле поиска в открытый каталог. Чтобы человеку не нужно было за ним возвращаться на основной экран.
  • Добавить иконку закрытия в заполненный поиск, чтобы можно было одним касанием стереть введенный запрос.
  • Разобраться все-таки, куда попадает человек, который воспользовался поиском — во все возможные категории или в какую-то конкретную?
  • Добавить к неоднозначным понятиям иконку вопросика и пояснение, что это такое.
  • Показать кэшбэк баллами более однозначно. Например, убрать проценты, а вместо них написать «кэшбек».

3. Страница товара

Проблемы

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

Оказывается, она «открывает» другие холодильники. Точнее, другие поисковые запросы. Возможно, при каком-то сценарии это удобно, но сходу сложно сообразить, что это за ссылки. Кроме того, они кажутся некликабельными.

Если я захочу сравнить два холодильника, то не смогу — на СберМегаМаркете такого функционала не предусмотрено.

Но мне важно посмотреть разные модели перед покупкой.

img src="/upload/blog/sbermm_konyushenko_12.png" />

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

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

Получается, что я могу или купить мой будущий холодильник, или получить сегодня.

То есть «Купить» — значит, «Добавить в корзину».

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

Окей, я выбираю его.

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

По мне, это не очень правильно — стимулировать человека продолжать покупки таким образом. Теперь мне нужно самостоятельно вернуться на страницу товара.

Я решила проверить, как менялась цена товара в зависимости от времени. Это очень интересный блок, но достаточно спорный с точки зрения бизнеса. Судя по этому графику, цена прыгает вверх-вниз. Выходит, мне незачем торопиться с покупкой, если сейчас она на взлете. Вдруг она упадет снова?

В противном случае, у другого товара она может не меняться с течением времени. И тогда этот блок покажется вообще бесполезным.

Возможные решения

  • Убрать выпадающий список поисковых запросов — он сбивает с толку.
  • Добавить возможность сравнения. Для маркетплейса с большим выбором техники это обязательно.
  • На кнопках четко писать, какое действие ждать пользователю. Вместо «Купить» — «Добавить в корзину». Вместо Получить сегодня» — «Забрать из магазина». Либо вообще не выводить эту возможность кнопкой. Оставить ее как дополнительную информацию — которую можно добавить в корзину и дать пользователю возможность выбрать «Самовывоз сегодня» на этапе оформления заказа. Во всех остальных случаях внезапное открытие карты со всеми возможными магазинами ломает привычный сценарий покупки. Мы привыкли сначала всё выбрать, а потом решать, как будем получать — а не наоборот. В том числе частый сценарий — набрать в корзину несколько вариантов, а потом методично избавиться от лишних.
  • Делать самой жирной приоритетную для покупателя и бизнеса кнопку. Если на странице присутствует такая кнопка, как «Оформить заказ», совершенно точно главной должна быть именно она.
  • История стоимости товара — это хороший и полезный для покупателя блок. Но с точки зрения бизнеса это может сыграть в минус, а не в плюс. Тут хорошо бы измерить метриками, как часто пользуются блоком, и какие действия производят после. Например, отследить, много ли людей после взаимодействия с ползунками времени нажимает на кнопку «Купить». И противоположное — много ли пользователей после этого покидают сайт? Проведите A/B-тесты: меняется ли количество нажавших «Купить» в двух случаях: когда присутствует блок сравнения цен у конкретного товара, и когда он отсутствует.

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

Я решаю авторизоваться.

На экране нет ничего похожего на авторизацию, поэтому я иду искать в бургер-меню в списке категорий. Возвращаюсь к идее, что «0» — это я. И нажимаю на «ноль». Сработало. Попробую зайти через сбер ID.

Стоп. Кажется, сейчас я куда-то передам свои банковские данные. А вдруг СберМегаМаркет получит доступ к моим счетам и картам?!

Решаю действовать по старинке, по номеру телефона. Это просто, быстро и не так страшно. Теперь я не «0», а «Татьяна 0». Ненамного оптимистичнее.

Личные данные:

Блок «Давайте познакомимся» не кликается ни при каких условиях — он просто есть. Хотя иконка карандашика кричит об обратном.

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

Возможные решения

  • Про очевидную ссылку «Войти» или иконку Личного кабинета в шапке сайта я уже писала. В крайнем случае, эту же ссылку можно поместить в бургер-меню вместо того, чтобы обзывать нулём потенциального покупателя
  • Маленькие желтые кружочки («нули») на сером не видны. Если нужно дать понять, что бонусы отсутствуют, лучше так и написать: «Бонусов нет».
  • Рядом с предложением регистрации в Сбер ID написать, что это такое и почему не нужно бояться (« это не опасно, потому что…»).
  • Убрать бесполезный блок «Давайте познакомимся».
  • Для подсветки программы лояльности достаточно оставить одну ссылку «Правила программы лояльности».

5. Категория

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

Проблемы

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

Теперь можно отфильтровать: подгузники-трусики, в наличии, merries, размер L.

Всё вроде нормально. Кроме того, что размер искать пришлось глубоко внизу, а он важнее «Продавца». Я скролю и вижу длинный список продавцов, при этом часть пунктов неактивна. Зачем вообще показывать тех, кого нельзя выбрать?

Наконец, я вижу подгузники — пачки с разным количеством товаров. Какие же выгоднее? Все товары со значками акций.

Навскидку кажется, что выгоднее самые нижние, так как в пачке больше всего подгузников (88 штук). Но, если посчитать, то выяснится следующее — один подгузник стоит 32 рубля. Проверяю другие варианты, и получается, что один подгузник из верхней пачки (где 44 штуки) стоит 28 рублей, из второй (56 штук) — 29 рублей. Возможно, если пересчитать с кешбеком, то что-то изменится? Нет, подгузники в самой маленькой пачке всё равно дешевле.

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

Возможные решения

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

6. Страница загрузки

Проблемы

Я решила заказать самые выгодные подгузники. Настроила количество, нажала «Купить»… и снова увидела страничку загрузки.

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

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

Возможное решение

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

Заключение

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

СберМегаМаркет никак не проработал ситуацию, в которой оказался уже сделавший покупку клиент (а ведь он «горячее горячего»). Сервис просто бросил покупателя в состоянии разочарования. На фоне отчаянной битвы за клиента в e-com это по меньшей мере странная стратегия.

Что можно было сделать?

  • Позвонить, чтобы перенести доставку
  • Предложить аналогичные холодильники у других продавцов
  • Дать бонус
  • и так далее.

Потому что в ином случае клиент врят ли вернется в обманувший его ожидания маркетплейс.

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



  • Наболело: что выбрать — Битрикс или Laravel?

    Наболело: что выбрать — Битрикс или Laravel?

    Мы считаем, что выбор распространенной в России системы 1С-Битрикс — плохая идея для больших и нестандартных проектов. Но есть задачи, которые Битрикс решает хорошо. Я решил изложить свою позицию в одной статье.

    Чаще всего нам поручают создание проектов с нестандартной логикой, стартапов, интегрированных решений и сайтов с высокой посещаемостью. Поэтому наша основная платформа для разработки — это связка из Vue.js на фронтенде и PHP-фреймворка Laravel на бэкенде. Наше «поэтому» часто оказывается неочевидным для заказчика. Значит, нужны подробные пояснения.

  • Асинхронное приложение для онлайн-игр... на PHP. Серьёзно? Да!

    Асинхронное приложение для онлайн-игр... на PHP. Серьёзно? Да!

    Наш заказчик из отрасли онлайн-игр (игр для вечеринок). Festa — игровая платформа в формате онлайн-конференции.

    В этом проекте нам потребовалось работать с действиями от нескольких человек на одной странице браузера в реальном времени. Пользователи должны иметь возможность объединяться в комнаты, чтобы общаться в чате, взаимодействовать друг с другом в различных играх, да и просто веселиться (это ведь игры для вечеринок).

    Разработчики поймут вопрос «... на PHP. Серьёзно?», заданный в заголовке.