Альтернатива гамбургер-меню — тема дискуссионная. И не смотря на то, что разработчики и дизайнеры во главном едины во мнении, в то время, когда применять navigational drawer — хорошая мысль, а в то время, когда нет, существует множество мобильных приложений, применяющих данный шаблон.
В большинстве случаев это сводится к тому, что на маленьком экране не остается места для навигации из-за отсутствия прекрасно продуманной информационной архитектуры либо легко из-за громадного количества контента.
В случае если ваше приложение через чур сложное, поразмыслите о разукрупнении. Посмотрите, как это сделал Facebook с Messenger. Они разбили функциональность около главных действий и создали отдельное приложение.
Гамбургер-меню снижает вовлеченность, замедляет поиск и путает пользователей. Быть может, вас это не смущает, но возможно чертовски неудобным для других людей, а также тех, кто вероятно обожает ваш контент.
Вкладки
Примеры вкладок Ali Express и Etsy
Вкладки оказывают помощь организовать контент в категории, к примеру, посредством navigational drawer. Люди будут сходу осознавать, как им пользоваться. Применяйте ярлыки либо комбинируйте их с иконками.
Просматривайте кроме этого: Навигация в виде вкладок: в то время, когда применять и как оптимизировать
Навигация внизу экрана
Примеры с навигацией внизу экрана в приложениях на iOS — Medium, Twitter и Clock
Навигация внизу экрана, хоть и похожа на панель вкладки, рассматривается как отдельный шаблон. Она употребляется как на iOS, так и на Android, и представляет собой иконки с надписями. Панель навигации возможно скрыта/открыта посредством прокрутки вниз либо вверх. Единственное замечание, хоть Гугл и не рекомендует применять описание для неактивных значков в некоторых случаях, мы настоятельно рекомендуем применять надписи.
Не делайте навигацию игрой в угадайку для пользователей.
Функция «продемонстрировать больше»
Примеры от Facebook и iTunes
В случае если элементов меню больше, чем помещается на экране, вы имеете возможность добавить функцию «продемонстрировать больше». Сократите перечень меню до четырех самых серьёзных действий, каковые вы желаете, дабы делали пользователи, и поместите все остальные во всплывающее окно либо на новую страницу. У вас имеется возможность увеличить собственные настройки либо улучшить их, дабы соответствовать требованиям.
Прокручиваемая навигация
Пример прокручиваемой навигации от Medium
Равно как и опция «продемонстрировать больше», прокручиваемая навигация разрешает сделать перечень действий дольше. Сделайте его прокручиваемым так, дабы пользователи имели возможность перемещать его из стороны в сторону. Ответ применять лишь иконки при таких условиях будет трудиться лишь для технически подкованных пользователей, но не забудьте протестировать его перед внедрением.
Inline
Примеры из приложения News на iOS
Вы имеете возможность размещать главные категории на главной странице приложения. К примеру, на домашней странице для веб-приложения. Эти группы смогут быть представлены как перечень с броскими заголовками.
Под категориями вы имеете возможность представить контент в виде горизонтальных прокручиваемых карточек для более легкого доступа либо более эргономичной работы с контентом.
Сегментированный контроль
Примеры применения в iTunes и iBooks
В случае если у вас мало пунктов меню, вы имеете возможность применять сегментированный контроль. Все параметры видны сходу и смогут быть дешёвы в одно нажатие.
Видимая строка поиска
Пример видимой строки поиска от Linkedin, Amazon и Facebook
В случае если функция поиска — главная в вашем приложении, она должна быть на виду. Не скрывайте строчок поиска. Вы имеете возможность отображать ее в верхней части экрана либо предлагать видимую ссылку, которая переводит в режим поиска.
Просматривайте кроме этого: Создание мобильной навигации независимо от гамбургер-меню
***
Напоследок еще раз выделим: постоянно ориентируйтесь на настоящий контент, в другом случае вы останетесь с плейсхолдерами, lorem ipsums и гамбургер-меню в гамбургер-меню. Контент сам по себе не имеет смысла и макеты без контента также.
То, что гамбургер-меню — не лучший выбор, подкрепляется фактическими цифрами и подтверждается компаниями, каковые получают деньги на приложениях. Исходя из этого в случае если вам необходимо убедить кого-то — клиента, начальника либо менеджера — из-за чего стоит перейти на более понятный навигационный шаблон, — данный материал может оказать помощь.
Высоких вам конверсий!
По данным: uxplanet.org
Случайные статьи:
- Почему в нелепые стартапы инвестируют большие деньги?
- Изобретая tv-пульт заново, или как онлайн-мир изменил специфику просмотра видео
Бургер-меню на JQUERY
Подборка похожих статей:
-
Почему гамбургер-меню и скрытая навигация вредят вашему юзабилити?
Понятность вашего лендинга (discoverability) значительно уменьшается практически в два раза, в то время, когда основная навигация скрыта. Это кроме этого…
-
Создание мобильной навигации независимо от гамбургер-меню
В области мобильного дизайна гамбургер-меню (либо трехстрочная иконка) – это популярный инструмент для решения проблемы мелких экранов, пространство для…
-
Как использовать навигацию на мобильных телефонах не зависимо от гамбургер-меню
Аннотация. Мобильные сайты, каковые применяют гамбургер-меню либо трехстрочное меню должны поддерживать навигацию по всему сайту, если пользователи не…
-
Кнопка «узнать больше»: оптимизируйте ее!
Кнопки «Определить больше», «Подробнее» и подобные им, в большинстве случаев, размещаются на странице с тизерным описанием продукта/услуги, акцией либо…