Вас не будут вычислять «полноценным» UX дизайнером, пока вы не опубликуете собственные взоры на «≡», под псевдонимом «гамбургер-меню», и под псевдонимом Side Drawer Menu либо выдвижное меню!
Недавнее обновление приложения Youtube для Android, созданное Гугл, побудило меня прыгнуть на подножку уходящего поезда и выразить собственные мысли об этом увлекательном примере интерфейса пользователя либо UI.
«≡» именуется «гамбургер-меню» за собственный сходство с гамбургером – верхние и нижние линии, воображающие булочку и ее средняя линия, воображающая заполнение гамбургера.
– Википедия
Гугл переходит к вкладкам?
2
Гугл + и YouTube приложения (Android), раскрывающееся меню и вкладки соответственно
Гугл+ и YouTube приложения были изначально созданы по примеру Гамбургер-меню. Гугл+ перешел к раскрывающемуся перечню в мае 2014 года. После этого, обновленное YouTube-приложение в июле 2015 заимствовало Гамбургер-меню и приняло неспециализированный вид, основанный на вкладке.
В том направлении и обратно!
Давайте посмотрим, кто еще раньше переключился на Гамбургер-меню и возвратился с другой навигацией.
Facebook Android и iPhone приложения с вкладками
Facebook Android и iPhone приложения с вкладками
Facebook так же, как и прежде применяет значок Гамбургер-меню переименованный в правом углу в иконку «Дополнительно». Как неизменно Android против iOS, панель вкладок находится или в верхней части (Android) либо снизу с метками (iOS).
Twitter на Android и iPhone приложениях с вкладками
Twitter приложение для Android и iPhone с вкладками
Значки «Уведомления», «Сообщения» на Android-панели (панели приложения) в iOS имеют вид панели вкладок. Android объединяет иконки действий включая иконку приложения Twitter, поместив ее по правому краю. Вкладки «Основная», «Поиск» в верхней части приложения Android продемонстрированы посредством нумерации страниц в iOS.
Программа Flipboard приложение с вкладками на Android и iPhone
Программа Flipboard приложение с вкладками на Android и iPhone
«Положенные вкладки» в версии Android. Вы увидели наименование страницы «Просматривать» в iOS? Значок вкладки помогает той же самой цели в Android приложениях.
Airbnb
Приложение Airbnb для Android и iPhone вкладками
Приложение Airbnb для Android и iPhone с вкладками
Значки действий на Android панели действий сгруппированы в два, с левым выравниванием. Панель вкладок iOS не поддерживает такое группирование.
9GAG
Приложение 9GAG для Android и iPhone с вкладками
Приложение 9GAG для Android и iPhone с вкладками
Это весьма интересно! Вы когда-нибудь видели панель вкладок в Android приложении, заполненную ярлыками, как обычный iOS? Помимо этого, значок Гамбургер-меню превратилось в «Дополнительно», как в Facebook.
Кнопка «назад» на домашней странице
LinkedIn Android-приложение с кнопкой «назад» на основной странице (слева). Она служит в качестве значка Гамбургер-меню, раскрывая секцию меню (справа)
LinkedIn Android-приложение с кнопкой «назад» на основной странице (слева). Она служит в качестве значка Гамбургер-меню, раскрывая секцию меню (справа)
По малоизвестным человечеству обстоятельствам, приложение LinkedIn Android значок Гамбургер-меню иконкой «назад».
Это, возможно, умный трюк, дабы одурачить пользователя. Я пологаю, что это новшество дает шанс найти элементы в секции меню, тогда как пользователь отчаянно пробует «возвратиться» к домашней странице.
Право имеется право!
В большинстве приложений иконка Гамбургер размещена в левом углу. Это формирует неудобства, в особенности, если вы пробуете получить доступ к меню, пребывав на какой-либо странице, глубоко в структуре. Исходя из этого, вы станете довольно часто видеть значок «назад» в левом углу вместо иконки Гамбургер.
Имеется ответ?
Reverb News
Для какое количество News iPad приложение применяет значок «домашняя страница» в левом углу. Рядом с ним находится иконка «реверберация новостей»
Для Reverb News iPad приложение применяет значок «домашняя страница» в левом углу. Рядом с ним находится иконка «реверберация новостей»
Для реверберации новостей iPad-приложение постоянно отображает значок «домашняя страница» в левом углу. Если вы находитесь в раздела, кнопка «назад» находится в близи от «домашней страницы». Это не практично в телефонах, поскольку пользователь может совершить ошибку и надавить значок «домашняя страница», вместо «назад».
Рецепты Джейми Оливера
Рецепты Джейми Оливера в iOS-приложении со значком Гамбургер-меню в правом углу
Рецепты Джейми Оливера в iOS-приложении со значком Гамбургер-меню в правом углу
Перемещение значка Гамбургер-меню в правый угол оказывает помощь нам отобразить иконки «назад» и «меню» совместно на одном экране. Рецепты Джейми Оливера в iOS-приложении и приложение Epicurious iPhone приведены в качестве примеров.
Epicurious
iPhone приложение Epicurious со значком Гамбургер-меню в правом углу.
iPhone приложение Epicurious со значком Гамбургер-меню в правом углу.
Примечательно, что оба вышеприведенных примера забраны из категории «кулинария»!
Применять либо не применять? Вот в чем вопрос!
Гамбургер-меню экономит место на экране, где содержание в большинстве случаев занимает много места. Появляется вопрос, сохраняются ли поисковые возможности для того чтобы меню, в случае если вместо вкладок употребляется значок Гамбургер.
Иначе, в случае если в вашей панели вкладок больше элементов, вы вынуждены применять иконку «Дополнительно» в структуре Гамбургер-меню.
Наилучшее ответ в этом случае – это применять Гамбургер и комбинацию вкладок меню (значок «Дополнительно»), размещенные в правом углу.
В случае если мы используем вкладки, пользователи постоянно будут знать, где они находятся и куда они смогут пойти. Они найдут больше функций в значке «Дополнительно».
Что вы думаете о моем наблюдении касательно Гамбургер-меню? Что вы станете делать в следующий раз при проектировании приложения? Поделитесь собственными мыслями ниже.
Перевод статьи
Случайные статьи:
10 БУРГЕРОВ ЗА 10 МИНУТ! CHALLENGE | ВЫЗОВ ПРИНЯТ! КРУТО КАК 100 ЖВАЧЕК
Подборка похожих статей:
-
Мобильный ux: навигация внизу экрана
Любой разработчик знает, что дизайн — это не только приятный внешний вид, но да и то, как пользователи взаимодействуют с продуктом. Не имеет значения,…
-
Каналы сбыта продукции (мыла ручной работы)
Каналы продвижения товара Продолжаем публикацию статей из отечественного курса Мыловарение дома. Секреты прибыльного бизнеса. Сейчас мы зарегистрировали…
-
Продажа мыла ручной работы Продолжаем публикацию статей из отечественного курса «Мыловарение дома. Секреты прибыльного бизнеса». Сейчас мы…
-
В случае если вам пригодится кусок мыла и вы зайдете за ним в один из местных магазинов в Сан-Франциско, к примеру, в Walgreens на Маркет стрит, то…