Если страница выдачи обновляется слишком быстро или прокручивается при обновлении, это прерывает процесс фильтрации. Проектирование фильтров и фасетной навигации обеспечивать гладкий пользовательский опыт.
Фильтры — одно из главных изобретений в вебе со времен возникновения интернета как такового. Эти элементы позволяют нам быстро найти иголку в стогу сена на информационно наполненных сайтах, таких как сайты путешествий или ecommerce. Бренды формируют свою репутацию благодаря способности эффективно сужать результаты поиска. Фильтры позволяют исключить результаты, которые не удовлетворяют конкретным запросам, а фасетный поиск превращает поиск в навигацию, предлагая категории и параметры, которые возможно нужны пользователям (но о которых они ещё не подумали). Фильтры и фасетная навигация стали стандартом для сокращения больших результатов поиска.
Однако, хоть фильтры и могут выглядеть одинаково на многих сайтах (например, обычно они расположены слева), их поведение может значительно различаться. В этой статье мы сосредоточимся на двух основных аспектах реализации фильтров:
- Когда применять фильтры. Может ли пользователь уточнить значения нескольких фильтров до получения результатов запроса (пакетный фильтр), или результаты будут показаны сразу после выбора каждого значения фильтра (интерактивный фильтр)? Могут ли результаты быть найдены и отображены достаточно быстро, чтобы понять, что данный параметр не подходит?
- Нужно ли прокручивать страницу к новым результатам. После отправки запроса на фильтрацию нужно ли прокручивать страницу к началу результатов или оставлять пользователя на текущем месте, чтобы не прерывать процесс фильтрации?
Оба эти аспекта формируют непрерывность пользовательского взаимодействия.
Главной целью при выборе способа реализации должно быть поддержание целостности пользовательского опыта, чтобы пользователь мог плавно двигаться к достижению цели, ощущая стабильность интерфейса и своё мастерство.
1. Когда применять фильтры
Прибегнем к ресторанной аналогии. Подумайте о том, как вы заказываете закуски в ресторане. Скажем, вы хотите заказать 3 закуски, но сразу после того, как вы называете первую закуску, официант выхватывает меню из ваших рук, уходит на кухню и передает заказ на это блюдо повару. Хороший же официант понимает, что вы ещё не закончили заказ и дает вам время прежде чем забрать меню. Хороший официант дает вам время на принятие пакетного решения, даже если это может немного задержать подачу первого заказанного блюда. (Однако, иногда официант может взять заказ на закуски, а затем дать вам ещё время, чтобы определиться с основным блюдом. Хороший официант поступает гибко и адаптируется к нуждам клиента.)
Официант, мгновенно уходящий после каждого названного вами блюда, так же прерывает взаимодействие, как обновление страницы после выбора отдельного критерия поиска, особенно если сайт работает медленно.
Выбор между пакетным и интерактивным фильтром зависит от намерений пользователя (планирует ли пользователь указать несколько критериев поиска или только один) и скорости сайта (как быстро пользователь получит результаты).
Намерения пользователя
Умный механизм фильтрации понимает, когда пользователь ещё думает, и не обновляет страницу, пока пользователь не закончит принятие решения. Основная проблема — это понять, когда пользователь уже готов увидеть обновленные результаты. Как система может вести себя как хороший официант?
Во-первых, нужно понять, находится ли пользователь в состоянии поиска или у него есть в голове четкие критерии. Пользователям, у которых нет четкой цели поиска, нужно изучить структуру пространства поиска и возможные доступные варианты. Таким пользователям больше подойдут интерактивные фильтры. Они выбирают один параметр, и система обновляет результаты. После просмотра обновленных результатов, они выбирают другой фильтр — система обновляет результаты и т.д.
Интерактивные фильтры обычно ассоциируются с фасетным поиском: как только пользователь выбрал один из критериев поиска, отображаются результаты с новыми возможными критериями (например, если пользователь выбрал «Холодильники», появится новый набор критериев типа«Объем морозильной камеры»). Часто в фасетной навигации так же отображается количество результатов для каждого значения фильтра, что помогает пользователям избежать пустой выдачи.
И наоборот, если у пользователя в голове есть уже несколько критериев поиска, то ему больше подойдет пакетная фильтрация. Например, пользователь, который хочет купить «маленькое чёрное платье», возможно пойдет в категорию «Платья» и сразу обратится к фильтрам для уточнения цвета, длины, стиля и размера. Для таких покупателей лучше, если система будет ждать, пока они не закончат выбор, а потом загрузит новые результаты. Самый большой недостаток пакетной фильтрации — это риск того, что комбинация выбранных пользователем критериев приведет к пустой выдаче. Отсрочка вывода результатов усложняет получение пользователем постоянной обратной связи о том, какие фильтры доступны или недоступны, и сколько результатов содержится в каждом значении фильтра. Достоинством является экономия времени пользователей на ожидание между запросами, т.к. вместо того, чтобы ждать после каждого запроса (выбора одного критерия), пользователи ждут только выполнение общего запроса.
Проектировщикам зачастую сложно точно предсказать намерения пользователей при поиске. Вот несколько эмпирических правил, которые помогут понять цели пользователей:
- Пусть пользователь скажет вам, когда закончит выбор фильтров. По сути это означает переход на сторону пакетной фильтрации и добавление кнопки «Применить» в интерфейсе фильтра. Пользователи могут нажать эту кнопку после того, как выбрали все значения фильтров, которые их интересовали. Это рекомендуемый подход на мобильных устройствах, даже в рамках нового шаблона, когда фильтры фиксируются на экране при прокрутке. Однако, используя этот метод, вы теряете пользователей-исследователей, которые возможно ещё не определились с набором необходимых критериев.
- Определение активности в области фильтрации. Последите за движением пользователя через ховер мыши или фокус клавиатуры. Если пользователи двигают мышь рядом с фильтрами (или перескакивают между ними, используя клавиатуру), возможно они принимают решение. И наоборот, если курсор мыши покинул область фильтрации и направился к результатам, это хороший знак, что пользователь готов получить результат. Помните, что даже если есть какое-то движение, этот способ будет лучше работать, если будет использоваться временной лимит (см. п. 3).
- Обновление результатов через определенное время после последнего выбора. Если пользователь ничего больше не выбрал или не двигал мышью в течение определенного периода времени (1–2 секунды), нужно отображать новые результаты. Естественно, система так же должна давать мгновенную обратную связь (например, используя индикатор выполнения), чтобы подтвердить получение выбранного значения.
Скорость загрузки сайта
Другой критерий, который влияет на выбор вида фильтрации (интерактивная или пакетная) — это скорость сайта (как быстро вы можете предоставить результат). Если вы предполагаете, что запросы будут обрабатываться мгновенно (новые результаты будут появляться менее чем через 1 секунду после выбора каждого значения фильтра), то интерактивная фильтрация будет менее неприятной даже для пользователей, находящихся в состоянии поиска. Однако, если ваш сайт будет работать медленно хотя бы иногда, то пакетная фильтрация может сэкономить время пользователю. Это основная причина, по которой мы рекомендуем использовать пакетную фильтрацию на мобильных устройствах. На ходу страницы часто загружаются медленно, а если приходится ждать 4 раза, чтобы 4 раза перезагрузить страницу в случае сложного фильтра, это слишком увеличивает «стоимость взаимодействия» для пользователя.
Непрерывная обратная связь: предупреждение
У интерактивной фильтрации есть и другой недостаток: постоянные обновления могут отвлекать, даже если они происходят быстро и при этом не прокручивается страница. Каждый раз, когда в результатах появляются новые элементы, мелькание изменения картинок привлекает внимание (хотя при этом может быть непонятно, что именно изменилось). Мелькание в периферийном зрении раздражает и может стать причиной того, что пользователь потеряет время, вглядываясь в предварительные результаты. Тем не менее, визуальные подсказки необходимы, чтобы пользователь понимал, что произошло изменение (т.е., чтобы избежать слепоты к изменениям).
Чтобы воспользоваться преимуществами постоянной обратной связи без рассеивания внимания пользователя в периферийном зрении, во многих качественных фасетных поисках происходит затемнение результатов и отображение индикатора выполнения перед отображением новых результатов поиска. Таким образом, пользователь видит единую меняющуюся затемненную область (вместо отдельных элементов, появляющихся и исчезающих на экране).

2. Прокрутка страницы к новым результатам
Помните, что наша цель — достижение гладкого пользовательского опыта. Второй аспект для формирования такого опыта — это то, что происходит со страницей после применения фильтров. Этот аспект так же зависит от того, верно ли определены намерения пользователя. К сожалению, на многих сайтах пользовательский опыт ломается в этот момент взаимодействия.
Например, Houseoffraser.co.uk разочаровывает тем, что происходит после применения фильтров: страница прокручивается обратно к началу списка результатов. Если пользователь всё ещё смотрел на фильтры, то он теряет место на странице, где он находился и запутывается. Но что хуже всего, такое поведение увеличивает шансы случайного клика на неверную категорию, если пользователь выбирал значение фильтра в момент прокрутки.
С другой стороны, у прокрутки к началу страницы так же есть свои плюсы. Во-первых, самые лучшие результаты отображаются в начале списка. Если релевантность или популярность результатов значительно снижается ближе к низу страницы, то пользователи скорее увидят самые лучшие результаты, если направить их к верхней части страницы. Во-вторых, после применения фильтра может быть получено слишком мало результатов, и рядом с областью фильтрации может ничего не отображаться. В обеих ситуациях лучше отправить пользователя в верхнюю часть страницы, чтобы они увидели изменения.

Обратите внимание, что в этом случае основная проблема опять же — неспособность распознать намерения пользователя, а именно то, что пользователь всё ещё взаимодействует с элементами фильтрации. Чтобы определить, стоит ли уже прокрутить выдачу наверх или нужно подождать несколько секунд, пока пользователь не закончит работу с фильтрами, можно успешно применять те же методы, которые были изложены в первой части статьи.
Заключение
Определяя намерение пользователя выбрать дополнительные фильтры, сайты будут предоставлять более гладкий и качественный опыт фильтрации. Используйте интерактивные фильтры, если пользователи находятся в процессе исследования. Используйте пакетные фильтры, если у ваших пользователей есть четкие критерии отбора, или если вы знаете, что ваш сайт хотя бы иногда будет работать медленно (например, на мобильных устройствах).
Источник: uxtranslate.ru
Оригинал: User Intent Affects Filter Design