Продолжение статьи про исследование фильтров в e-commerce (Часть 1).

4. У 32% сайтов нет фильтров совместимости

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

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

Поиск подходящего адаптера для ноутбука или покупка камеры и сумки к ней звучат как самые обычные дела, но они превратились в настоящую пытку для участников наших фокус-групп: лишь 35% справились с заданием. Это значит, что оставшиеся 65% просто сдались, либо, что еще хуже, им пришлось купить товар, который они посчитали совместимым «наверняка», но на деле он таковым не оказался.

«О нет, мне это не по силам – только не на сайте, на котором сложно разобраться. Я лучше схожу в «живой» магазин с моей камерой и подберу подходящую сумку» – объяснил один из тестируемых в процессе поиска сумки для камеры; он пытался сузить список из 253 товаров по размеру. Он дополнил: «Мне придется ходить назад и вперед по списку для сравнения параметров. А потом еще выбирать понравившийся мне внешний вид». Неважно, насколько заманчивы ваши цены, насколько прекрасны отзывы о дизайне и использовании товара – если продукт несовместим, пользователь может отказаться от покупки.

Все это делает фильтр совместимости одним из самых важных (для товаров, которые зависят от совместимости, конечно). Таким образом, предоставление пользователю доступа к списку товаров, которые совместимы с уже имеющимся, жизненно необходимо. Несмотря на то, что фильтры такого типа являются предпосылкой для нахождения и покупки совместимых товаров, у 32% интернет-магазинов этих фильтров нет.

Хотя у большинства интернет-магазинов есть фильтр «бренд», тесты выявили, что он совершенно не адекватен как единственный фильтр. Во-первых, производители часто располагают несколькими сериями товаров с разными параметрами совместимости. Например, все адаптеры Lenovo не подойдут абсолютно ко всем ноутбукам Lenovo; таким образом, просто выставив фильтр “Lenovo”, нельзя получить список товаров, совместимый с конкретным компьютером той же марки. Во-вторых, для некоторых параметров совместимости, продукты третьих производителей представляют больший объем из всех представленных. Например, фильтры «производитель» или «бренд» не обеспечат пользователю полный список подходящих по размеру чехлов для Макбука.

Ключевой вывод

Любой категории, содержащей продукты, совместимые с чем-либо (будь то аксессуары, системы, запчасти, расходные материалы и т.д.), необходим фильтр совместимости. Часто это может быть фильтр, с помощью которого можно указать модель или её номер, но это также может быть и фильтр более общего назначения, как размер, вместимость или мощность.

 5. Более 10 значений фильтрации требуют сокращения

Мы протестировали три главных способа отображения продуктовых списков по более чем 10 поисковым значениям:

1. отображение всех результатов поиска в одном длинном списке;
2. использование прокрутки в ряду;
3. сокращение поисковых значений с помощью ссылки.

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

А. Отображение всех результатов поиска в одном списке

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

Отображение всех поисковых значений в одном длинном списке осложняет обзор других параметров фильтрации. Здесь, LL Bean  отображен на экране шириной в 900 пикселей. Посмотреть в большом размере.

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

B. Использование прокрутки в ряду

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

Прокрутка в ряду, как мы видим на Staples ССЫЛКА, вызывает проблемы у тестируемых, как концептуальные, так и проблемы, связанные с юзабилити. Показать в большом размере

Внедрение прокрутки внутри ряда достаточно частое явление – 24% крупнейших сайтов используют этот метод. Однако это не работает хоть сколько-нибудь лучше, так как порождает кучу проблем само по себе. Наиболее значимые проблемы:

1. Прокрутка внутри прокрутки (то есть вложенная зона прокрутки) показала себя как совершенно неудобный для понимания инструмент среди пользователей. Прокрутка в ряду может быть помещена внутрь большей зоны прокрутки на веб-странице. Это позволило бы пользователям понять, чем различаются такие зоны прокрутки и избежать трудностей.
2. Пользователи, которым нужно было применить фильтр, не могли получить полный обзор фильтров, так как зона прокрутки была ограничена по высоте. Проблема юзабилити, таким образом, смещается с отсутствия полного обзора фильтров к невозможности отфильтровать товары внутри категории.
3. Прокрутка в ряду часто вызывала так называемый «налёт», когда пользователь прокручивал веб-страницу, в то время как хотел прокрутить список товаров, и наоборот. Пользователь таким образом становится обязанным помнить о каждом перемещении своей мышки и её положении в любой момент, когда бы он ни захотел прокрутить страницу. Другими словами, преобладающий в вебе вертикальный способ прокрутки украден. (На устройствах с функцией тачпада широкие «вложенные» зоны прокрутки могут быть недоступны пользователю вообще.)

С. Cокращение поисковых значений

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

Сокращенный способ дает пользователю обзор в типах фильтрации – как мы видим здесь на REI  – и все доступные значения внутри категории (когда сокращенная ссылка раскрыта).  Показать в большом размере.

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

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

• в зависимости от дизайна фильтра до 10 значений фильтрации могут отображаться до сокращенной ссылки. Там, где отображается меньше значений, пользователи не поймут причины сокращения списка и будут смущены;
• до начала сокращения значения фильтрации должны быть перечислены в порядке популярности, а не по алфавиту или количеству совпадений. Пользователи чаще ищут название конкретного значения, а не название категории фильтра (Lenovo, а не «совместим с»);
• сокращенная ссылка должна быть отчетливой и выделяющейся как интерактивный элемент, отличный от других типов фильтров. Важные аспекты – оформление ссылок на сайте по умолчанию (цвет и/или подчеркивание), использование индикаторов, таких как знак плюса (+) или стрелка, указание количества в списке в названии ссылки («Показать еще 23»), внедрение вертикального разделения на веб-странице и визуальное выделение последнего товара в сокращенном списке.

Показать в большом размере

Northern Tool располагает фильтры по популярности, тогда как сам список фильтров сокращен. После раскрытия, значения располагаются в алфавитном порядке для предсказуемого поиска.

Показать в большом размере

Ключевой вывод

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

6. Только 16% используют важные фильтры

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

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

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

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

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

Walmart идет на 2 шага дальше, используя смесь фильтров из «тип ноутбука» и «тип разъема», что идет в ногу с ключевыми параметрами, которыми руководствуется пользователь при выборе ноутбука. Показать в большом размере.

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

Два дополнительных улучшения на заметку:

• Оставляйте «продвинутые» значения фильтрации на панели фильтров. Так как натренированный пользователь думает, что панель фильтров содержит все доступные параметры фильтрации, «продвинутый» фильтр должен быть представлен на панели в обязательном порядке;
• Никогда не продвигайте фильтры с помощью графических баннеров. Из-за них многие тестируемые просто упустили из виду некоторые результаты, даже несмотря на то, что поиск содержал нужные пользователю значения.

Ключевой вывод

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

Автор статьи – ChristianHolst.

Оригинал статьи  “The Current State Of E-Commerce Filtering” на сайте www.smashingmagazine.com.

Перевод – Анна Данилова для Adventum.

[grwebform url=»https://app.getresponse.com/view_webform_v2.js?u=BIpOw&webforms_id=495504″ css=»on» center=»off» center_margin=»200″/]

Часть 1 статьи про исследование фильтров в e-commerce.