Чому дизайнерам варто відмовитися від “гамбургер-меню” – 3 причини (Частина 2)

Усі їдять гами. Це один із найпопулярніших продуктів у всьому світі. Не менш відомий “гамбургер” у світі цифрового дизайну.

DesignTalk.club традиційно пропонує вам почитати свіжий цікавий лонгрід про дизайн – українською 😉  Отож, сьогодні до вашої уваги друга частина.

Першу частину читайте ТУТ

Що ж робити?

Так, мобільна навігація є достатньо складною: її потрібно “вмістити” у 320 пікселів, при цьому вона має бути помітною, достатньо великою та багатофункціональною. Але це не означає, що ви не можете оптимізувати її 😉

Перевірте “інформаційну архітектуру” (IA)

Люди віддають перевагу “”, тому що воно може вмістити великий обсяг інформації. Але це допомагає рівно до того моменту, доки користувач не почне реально ним користуватися – і не заплутається. До того ж, поступово апки мають звичку обростати додатковим функціоналом, а відповідно й ваша інформаційна архітектура буде ставати все більш і більш заплутаною.

Проведіть дослідження серед користувачів методом сортування. Дозвольте вашим користувачам класифікувати вашу IA на основі їх інтуїції та їх “інформаційних ароматів” – аби дізнатися більше про те, чого воно хочуть і якою бачать зручну апку. Після цього невеликого дослідження починайте будувати нову ІА для своїх апок. До речі, саме цей метод використала для запуску свого у.

Починайте використовувати “таби” (вкладки)

Сьогодні найкращим рішенням для мобільних додатків є панель із вкладками. Ви можете розмістити її у верхній або нижній частині екрана – але якщо у вас респонсивний дизайн, то краще розмістіть її вгорі.

Коли ви оновите свою IA, зможете додати 4-5 основних табів – для найбільш популярних функцій. Саме таким чином Facebook оновив структуру та зовнішній вигляд своїх додатків для мобільної версії, iOS та Android. 

І не забудьте – використання піктограми у поєднанні з текстом дозволяє вмістити більше інформації, але при цьому робить її достатньо великою (а значить і помітною) для користувача.

Підказка – можна зекономити трохи простору робочого екрану, якщо ховати ваше нове меню (табове) під час скролінгу (прокручування сторінки).

Що робити, якщо ваше меню має БІЛЬШЕ вкладок?

Не хвилюйтеся, нашу навігаційну панель можна без проблем масштабувати. Якщо вам потрібно розгорнути більш ніж 5 вкладок, використайте останню вкладку панелі, аби надати доступ до решти опцій – на кшталт “гамбургер-меню”.

Якщо ваша десктопна версія більш складна, тоді просто перетворіть у таби найбільш важливі навігаційні елементи. Решту сховайте  за вкладками “більше” або “інше”. Product Hunt зробили певний мікс – вони використали текстову навігацію на мобільному і, називаючи її “навігацією”, що заміняє “гамбургер-меню”.

А тепер зверніть увагу на те, що зі своєю навігацією зробив medium:

Отже – абсолютно можливо створити нову навігацію. Так, це важко, але якщо ви вирішите бути UX дизайнером, ви маєте бути готовим до подібних викликів, чи не так?

Використання “Гамбургер-меню” в окремих випадках

Хоч і точаться гарячі дебати навколо плюсів і мінусів “гамбургер-меню”, це не означає що його взагалі варто заборонити. Інколи воно може бути корисним.

Наприклад, Uber використовує у якості основної навігації CTА-кнопку (на весь екран), а додаткова навігація – через “гамбургер-меню”.

 

Вони використали “гамбургер” розумно, роблячи його помітним та легким у користуванні.

Отже, “гамбургер-меню” може бути як корисним для користувачів, так і ні. Може бути функціональним і корисним (як у випаду із Uber) – або ж значно погіршити структуру вашої IA. 

(переклад Rizki Rahmat Ridha, з medium.muz.li)

Вам також буде ДУЖЕ цікаво

Залишити відповідь