Різниця нативного дизайну під iOS та Android: навігація

Часто дизайнери не враховують різницю в дизайні для платформ та , і створюють єдиний дизайн для обох платформ, відштовхуючись від того, яку операційну систему вони використовують на власному смартфоні.

Щоб створити найкращий нативний дизайн додатків, слід пам’ятати про відмінності між платформами iOS і Android. Ці платформи відрізняються не тільки тим, як виглядають нативні програми; вони також відрізняються за структурою та потоком. Ви повинні зберігати ці відмінності, щоб забезпечити найкращу взаємодію з користувачами за допомогою свого дизайну.

Внутрішні мобільні додатки для iOS та Android мають спеціальні функції операційної системи. “Гайдлайни” компанії Apple та Google рекомендують, коли це можливо, використовувати стандартні навігаційні елементи керування на платформі: елементи керування сторінками, панелі вкладок, сегментовані елементи керування, таблиці і т. ін. Користувачі знайомі з тим, як працюють нативні елементи керування, тому, якщо ви використовуєте стандартні елементи керування, користувачі інтуїтивно знають, як працює ваш додаток.

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

Відмінності в навігаційних моделях

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

Глобальна навігаційна панель (Android)

З іншого боку, дизайнерський підхід Apple є абсолютно іншим. Там немає глобальної навігаційної панелі, тому ми не можемо повернутися назад за допомогою глобальної кнопки “Назад” у дизайні iOS. Це впливає на дизайн мобільних додатків для iOS. Внутрішні екрани повинні мати нативну навігаційну панель із кнопкою “Назад” у верхньому лівому куті.

Кнопка “Назад” (iOS)

Apple також підтримує жест, щоб повернутися на попередній екран, треба провести по екрану зліва на право. 

Жест для повернення назад (iOS)

На Android такий жест перемикає вкладки, але кнопка “Назад” завжди доступна користувачу.

Перемикання між вкладками жестом (Android)

Шаблони навігації в додатку різні для iOS та Android

Material Design Guidelines передбачають кілька різних варіантів навігації. Один відомий шаблон навігації, який використовується в додатках для Android, – це комбінація меню навігації та вкладок.

Меню навігації (navigation drawer) – це меню, яке пересувається ліворуч або праворуч при натисканні значка гамбургер-меню. Вкладки знаходяться безпосередньо під заголовком екрана та дозволяють користувачеві переключатися між вкладками, наборами даних та функціональними аспектами додатка на високому рівні.

Меню навігації; праворуч – вкладки (матеріал дизайн)

Також є компонент під назвою “нижня навігація”, який також важливий для нативного додатка Material Design. Нижні навігаційні панелі полегшують виявлення та перемикання між представленнями вищого рівня одним натисканням кнопки. У керівництві Android не рекомендується одночасно використовувати нижню навігацію та вкладки, оскільки під час навігації це може спричинити плутанину.

Нижня навігація (матеріал дизайн)

У (HIG) від Apple немає стандартного навігаційного меню (і відповідно гамбургер-кнопки). Натомість рекомендації компанії Apple радять розміщувати глобальну навігацію на панелі вкладок. Панель вкладок розміщена в нижній частині екрану програми та забезпечує можливість швидкого перемикання між основними розділами додатка.

Зазвичай панель вкладок містить не більше п’яти кнопок. Як ми бачимо, цей компонент схожий на нижню навігацію в матеріал дизайні, але найчастіше використовується в програмах iOS.

Вгорі ліворуч – сегментоване меню iOS; внизу праворуч – панель вкладок в iOS (HIG)

Хоча існують аналогічні елементи, які виконують подібні функції в обох операційних системах (вкладки та сегментоване меню, нижня навігація та панель вкладок), навігація залишається однією з основних відмінностей між iOS і Android. Крім наявності різних елементів управління, є ще різне бачення платформ щодо цього питання.

Apple вважає, що первинні елементи навігації повинні бути на передньому плані, а в гамбургер-меню слід використовувати лише ті функції, які користувачі використовують рідко, наприклад, налаштування профілю. З іншого боку, приховати основну навігацію в гамбургер-меню – це загальноприйнята практика для Android.

За матеріалами: medium.muz.li

ДАЛІ БУДЕ!

Вас також ЗАЦІКАВИТЬ:

Вам сподобалося?

Читайте щотижня наші кращі статі про дизайн!

email рассылки

Корисна розсилка!

Все найцікавіше про дизайн і дизайнерів!
А ще свіжі вакансії і трішки гумору)

Ваш email:
email рассылки
Позначки:

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