Создайте быструю навигацию
Когда на боковой панели много элементов, группировка необходима, чтобы помочь пользователям быстрее их отыскать. Однако большинство дизайнеров не группируют элементы на боковой панели и заставляют людей просматривать весь список. Это замедляет навигацию и ухудшает удобство поиска.Группировка улучшает поисковую доступность. Пользователи видят группу и просматривают элементы из определённой категории вместо того, чтобы сканировать весь список. Чтобы определиться с категориями, необходимо найти взаимосвязи между элементами.
Например, список элементов на примере выше можно разделить на три группы. У вас есть «Рабочее пространство» (“Workspace”) с основными элементами для выполнения рабочих задач. Внутри группы «Сообщества» (“Social”) находятся элементы, связанные со взаимодействием с другими людьми. И наконец, группа «Аналитика» (“Analytics”) включает элементы, которые содержат количественные данные.
Как видите, взаимосвязи между элементами позволили создать три группы. Вместо того, чтобы упорядочивать элементы в произвольном порядке, появилась последовательная структура и иерархия.
Когда пользователи будут перемещаться по сайту, у них в голове будет модель этой классификации, которая поможет им находить элементы. Без группировок им пришлось бы сканировать весь список и просматривать каждый элемент. С группировками им придётся просканировать лишь небольшую часть списка.
Эффект последовательного расположения
После создания групп необходимо правильно упорядочить пункты внутри каждой категории. Как правило, большинство дизайнеров, размещают их в случайном или алфавитном порядке, но это не лучший подход для удобства поиска.
Оптимальный подход предполагает эффект последовательного расположения, который заключается в психологической склонности пользователя запоминать первые и последние пункты в списке лучше, чем те, которые находятся посередине (источник).
Другими словами, поставьте на первые и последние места в списке элементы с высоким приоритетом. В следующий раз, когда пользователи будут их искать, они вспомнят, где они находятся, и быстрее их найдут.
Например, в первой группе пункты «Продукты» и «Сделки» пользователи выбирают чаще всего. Если бы они находились в середине списка, людям пришлось бы усердно сканировать меню, чтобы их найти. Вместо этого они могут сразу смотреть на верхнюю и нижнюю части списка, не просматривая середину.
Если вы хотите пойти дальше, то можно расположить пункты по порядку. Пользователи с большей вероятностью запомнят пункты, расположенные ближе к первому и последнему. Поэтому пункты со средним приоритетом следует размещать в начале и в конце списка. В середине списка будут находиться пункты с самым низким приоритетом.
Группировка элементов в длинном списке помогает пользователям быстрее найти то, что они ищут. Если упорядочить элементы на основе эффекта последовательного расположения, это также повысит удобство поиска. Применение обеих техник в дизайне гарантирует более эффективную навигацию.
Перевод статьи How to Group Your Sidebar Items for Better Findability из блога
В нашем Телеграм-канале публикуем так же переводы практических статей из блога UX Movement про проектирование сложных интерфейсов, форм и страниц — !