UX-патруль, выпуск восьмой: Ozon

Разбор интерфейсов маркетплейса Ozon.

В предыдущих выпусках патруля были рассмотрены: YouTube, FL.ru, «ВКонтакте», интернет-магазины одежды, электронные почтовые службы, vc.ru, «Тинькофф Бизнес».

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

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

Но сейчас Ozon хитро решил эту проблему и теперь в галерее у отзывов при попытке свайпа влево/вправо фото листаются вверх/вниз :)

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

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

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

Можно показать миниатюры слева или внизу в формате карусели, как это сделано в основной галерее (и можно их увеличить):

Или сделать как в google-картинках, когда выбранный отзыв справа, а миниатюры слева и при переключении всё остается на месте:

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

При этом в tabbar вынесены отдельные точки входа в Ozon Fresh и в раздел с одеждой. Можно сделать единую точку входа в каталог в tabbar, а внутри у него сделать акцент на Fresh и Одежду, если сейчас нужно увеличить внимание пользователей к этим разделам.

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

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

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

Для того чтобы решить эту проблему, достаточно при выборе «вместе» сделать единый выбор даты вверху:

Тут кратко описали другие проблемные места.

Мыльные баннеры. Многие баннеры на сайте будто загружены не в том разрешении из-за чего картинка мылится и становится некачественной.

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

Ну и о наличии этих историй узнали только в процессе аудита. Более привычный и понятный паттерн — это расположение вверху страницы.

Например, как в ЛК. Там и скролла нет, работает как карусель и расположение логичное.

Рекомендуем также. Когда находишься в карточке товара и хочешь найти похожие, т.к. например в этом не подошел размер — обращаешься к блоку «Рекомендуем также». Но сейчас в этом блоке всего два прокручивания (12 товаров). А чтобы посмотреть другие похожие товары, необходимо пролистать всё описание, отзывы и другие блоки.

При этом на Wildberries, например, этих прокручиваний 11 (71 товар) и есть точка входа ко всем похожим товарам — это позволяет с большей вероятностью найти нужный продукт в рамках данного блока.

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

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

Странное выравнивание. В этих блоках визуально будто поехала верстка — слово «Отели» не выравнено по центру, а как-то прижато к верхнему краю. Плюс дважды написано «Отели» и «Отель» на каждой карточке.

При этом похожие баннеры в другом блоке имеют выравнивание по центру, но другой шрифт и всё написано заглавными:

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

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

Открыть в новой вкладке. При нажатии колёсиком на пункт меню — оно сразу же закрывается. Если нужно открыть несколько разделов сразу, то придется каждый раз открывать меню снова.

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

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

Многие замечания из предыдущих патрулей уже отработаны — это безумно круто, что мы вместе с вами помогаем продуктам стать удобнее <3

Предлагайте другие ресурсы для патруля или просто приходите к нам за интерфейсами :)

Всем удобства)

uxart.ru

#ux #interface #интерфейсы #design #ux_патруль #uxпатруль #uxart #ozon #озон