Как сделать удобное меню
Форма и расположение меню не так важны, как содержание. Меню не должно быть логично с точки зрения системы, но должно быт удобно для пользователя. Помогает карточная сортировка, работа с текстом, использование акцентов.
#меню
#акценты
#организация
Три главных предмета в фокусе внимания
1
Семь плюс-минус два
Просто забудьте про это правило. Пунктов в меню может быть столько, сколько нужно.
2
Паттерны
Гамбургер, здоровенное меню в стиле старого 1С с кучей пунктов, раскрывающееся огромное меню интернет-магазина, система из нескольких меню. Есть смысл сначала выбрать паттерн, а потом его развивать.
3
Приоритет содержания над формой
Бессмысленно обсуждать расположение меню слева, справа, сбоку или снизу. Важно не место, а то, как организована информация, и можно ли добраться до нее. Если начали обсуждать расположение меню, значит точно делаете что-то не то.
Например
Хороший образец
Сложная структура задачника потребовала разработки своей структуры меню. Но вообще лучше этого избегать. Eduhund
Так делать не надо
А давайте сделаем ровно так, как у нас в системе зашито. Логично же!
Инструменты
Карточная сортировка
хотя бы для группировки по первому уровню.
Сайты конкурентов
меню эволюционирует, не грех и позаимствовать чужое.
Компоненты Figma
меню — гарантированно повторяющийся элемент.
UX-писатель
не дизайнерское это дело буквы вылизывать.
Если вы собираетесь проектировать меню до того, как начали проектировать остальной интерфейс, подумайте еще раз. Сделать меню — далеко не самая первая задача.
Наталья Прокофьева, генеральный директор «Собаки Павловой»
5 советов,
как делать
хорошо
1
Отталкивайтесь от сценариев, а не от логики
Многие пытаются сделать меню логичным, но оно должно быть не столько логичным, сколько удобным. Пользователю не нужна общая структура, он каждый раз решает частную задачу. Не нужно превращать меню в стройную карту сайта.
2
Добивайтесь консистентности названий
Может потребоваться сделать несколько попыток. Кроме того, не называй рядом стоящие пункты на одну букву или похожим образом («скачать» и «закачать», «в корзину» и «в корзине»).
3
Используйте акценты
Нет такого правила, чтобы все пункты меню выглядели одинаково. Используй иконки, надписи, выделение цветом. Но именно как акценты — умеренно.
4
Примеряйте свое меню на вертикальное
В мобильной версии горизонтального меню быть не может. Меню должно без проблем трансформироваться из горизонтального в вертикальное и наоборот.
5
Обеспечьте зону безопасности
Не ставьте опасные пункты (например, «Выйти») рядом с популярными.