Протухнет ли гамбургер? Или UI/UX дилемма мобильного меню.

Немного о гамбургере

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

Самой большой привычкой для пользователей стала иконка меню, называемая в простонародье гамбургером из-за сходства с Биг Маком. Придумал ее Норман Кокс в 1982 году для Xerox Star, первого компьютера с графическим интерфейсом.

Задача состояла в том, чтобы создать простой и понятный знак, который можно вписать в квадрат размерами 16х16 пикселей. Но иконка исчезла с мониторов и вновь появилась только с появлением iPhone 3Gs в ряде приложений под iOS. И понемногу начала распространяться по сети среди приложений, сервисов и соцмедиа.

Первопроходцем, начавшим использовать иконку в контексте перехода к навигации, стал сервис Path.

Path
Сервис Path

Замена гамбургеру

В последнее время многие могли заметить появление новых типов меню на мобильных устройствах. Так, к примеру, в гайдлайне Material design от Google появилось Bottom Menu, а в iOS - Tap Bars.

Пример с официальной документации Google Material Design
https://material.io/guidelines/
ios пример tap bar
iOS TapBars в приложении

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

Приложения под iOS также не избавились от привычного всем гамбургера, но переносят его в Tap Bar, как например это делает Facebook.

Заметно одно: практически вся навигация переезжает с верхней части экрана устройства в нижнюю. Давайте разбираться, чем это вызвано.

Причины переезда вниз

Главная причина – новые устройства и физиология человека. Когда только появился прорывной iPhone , экран его был всего 4 дюйма, Apple ориентировался больше на поколение миллениумов. Большому пальцу одной руки легко доступна любая точка экрана.

Давайте посмотрим статистику

Статистика пользования мобильными устройствами и приложениями
Статистика пользования мобильными устройствами и приложениями у разных поколений (кликабельно)

Молодое поколение до 35 лет чаще пользуется мобильным устройством одной рукой и больше времени пользуется смартфонами, чем стационарными компьютерами.

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

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

Так уйдет или нет?

Этот сокровенный вопрос остается в подвешенном состоянии. На ресурсах, где слишком большое количество разделов и категорий, скорее всего, привычный гамбургер никуда не денется. Возможно переместится в нижнюю панель, но точно останется или приобретет несколько иной вид. К примеру, сейчас активно начинает использоваться кнопка «Еще» (троеточие), как в  обновленном приложеним Битрикс24.

Битрикс24 мобильное приложение новый Bottom Menu
Битрикс24 мобильное приложение новый Bottom Menu

Если основных разделов на сайте не так много, стоит все же посмотреть в сторону нижнего меню, это может выглядеть так:

Меню у нас
Пример меню для нашего сайта

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


Арт-Директор mit
Александр Павлов

Дата: 18.01.2018

Поделитесь статьей со своими друзьями в социальных сетях.


Назад к списку статей