Кто «cъел» мой гамбургер?

Вас не будут вычислять «полноценным» UX дизайнером, пока вы не опубликуете собственные взоры на «≡», под псевдонимом «гамбургер-меню», и под псевдонимом Side Drawer Menu либо выдвижное меню!

Недавнее обновление приложения Youtube для Android, созданное Гугл, побудило меня прыгнуть на подножку уходящего поезда и выразить собственные мысли об этом увлекательном примере интерфейса пользователя либо UI.

«≡» именуется «гамбургер-меню» за собственный сходство с гамбургером – верхние и нижние линии, воображающие булочку и ее средняя линия, воображающая заполнение гамбургера.

– Википедия

Гугл переходит к вкладкам?

2
Гугл + и YouTube приложения (Android), раскрывающееся меню и вкладки соответственно
Гугл+ и YouTube приложения были изначально созданы по примеру Гамбургер-меню. Гугл+ перешел к раскрывающемуся перечню в мае 2014 года. После этого, обновленное YouTube-приложение в июле 2015 заимствовало Гамбургер-меню и приняло неспециализированный вид, основанный на вкладке.

В том направлении и обратно!

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

Facebook

Facebook Android и iPhone приложения с вкладками
Facebook Android и iPhone приложения с вкладками
Кто «cъел» мой гамбургер?
Facebook так же, как и прежде применяет значок Гамбургер-меню переименованный в правом углу в иконку «Дополнительно». Как неизменно Android против iOS, панель вкладок находится или в верхней части (Android) либо снизу с метками (iOS).

Twitter

Twitter на Android и iPhone приложениях с вкладками
Twitter приложение для Android и iPhone с вкладками
Значки «Уведомления», «Сообщения» на Android-панели (панели приложения) в iOS имеют вид панели вкладок. Android объединяет иконки действий включая иконку приложения Twitter, поместив ее по правому краю. Вкладки «Основная», «Поиск» в верхней части приложения Android продемонстрированы посредством нумерации страниц в iOS.

Flipboard

Программа 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 на Маркет стрит, то…

admin