LPgenerator — профессиональная Landing Page платформа для увеличения продаж вашего бизнеса

  • Более 500 шаблонов в галерее
  • Инструменты оптимизации конверсии
  • Статистика и сквозная аналитика
  • CRM для работы с заявками и телефония
  • Визуальный редактор с расширенным функционалом
  • Быстрая техническая поддержка
  • Множество интеграций
  • Окупаемость инструмента — от 7 дней

Отличные альтернативные варианты гамбургер-меню

Альтернатива гамбургер-меню — тема дискуссионная. И хотя дизайнеры и разработчики во основном едины во мнении, когда использовать navigational drawer — хорошая идея, а когда нет, существует множество мобильных приложений, использующих этот шаблон. Обычно это сводится к тому, что на небольшом экране не остается места для навигации из-за отсутствия хорошо продуманной информационной архитектуры или просто из-за большого объема контента.

Если ваше приложение слишком сложное, подумайте о разукрупнении. Посмотрите, как это сделал Facebook с Messenger. Они разбили функциональность вокруг ключевых действий и создали отдельное приложение.

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

Вкладки

Примеры вкладок Ali Express и EtsyПримеры вкладок Ali Express и Etsy

Вкладки помогают организовать контент в категории, например, с помощью navigational drawer. Люди будут сразу понимать, как им пользоваться. Используйте ярлыки или комбинируйте их с иконками.

Навигация внизу экрана

Примеры с навигацией внизу экрана в приложениях на iOS — Medium, Twitter и ClockПримеры с навигацией внизу экрана в приложениях на iOS — Medium, Twitter и Clock

Навигация внизу экрана, хоть и похожа на панель вкладки, рассматривается как отдельный шаблон. Она используется как на iOS, так и на Android, и представляет собой иконки с надписями. Панель навигации может быть скрыта/открыта с помощью прокрутки вниз или вверх. Единственное замечание, хоть Google и не рекомендует использовать описание для неактивных значков в некоторых случаях, мы настоятельно советуем использовать надписи. Не делайте навигацию игрой в угадайку для пользователей.

Функция «показать больше»

Примеры от Facebook и iTunesПримеры от Facebook и iTunes

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

Прокручиваемая навигация

Пример прокручиваемой навигации от MediumПример прокручиваемой навигации от Medium

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

Inline

Примеры из приложения News на iOSПримеры из приложения News на iOS

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

Сегментированный контроль

Примеры использования в iTunes и iBooksПримеры использования в iTunes и iBooks

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

Видимая строка поиска

Пример видимой строки поиска от Linkedin, Amazon и FacebookПример видимой строки поиска от Linkedin, Amazon и Facebook

Если функция поиска — ключевая в вашем приложении, она должна быть на виду. Не скрывайте строку поиска. Вы можете отображать ее в верхней части экрана или предлагать видимую ссылку, которая переводит в режим поиска.

***

Напоследок еще раз подчеркнем: всегда ориентируйтесь на реальный контент, в противном случае вы останетесь с плейсхолдерами, lorem ipsums и гамбургер-меню внутри гамбургер-меню. Контент сам по себе не имеет смысла и макеты без контента тоже.

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

Высоких вам конверсий!

По материалам: uxplanet.org

24-08-2017

Продающие лендинги от отдела
дизайна LPgenerator

Используем технологии:
4U, AIDA, ХПВ, психология влияния Р. Чалдини, управление взглядом
  • 4U
  • AIDA
  • ХПВ
  • психологии влияния Р. Чалдини
  • управления взглядом
  • нейромаркетинг
Готовность от 7 дней
blog comments powered by Disqus
copyright © 2011–2017 by LPgenerator LLC. Все права защищены
Запрещено любое копирование материалов ресурса без письменного согласия владельца — ООО "ЛПгенератор".