І ще трохи законів/ефектів/принципів, які потрібно знати дизайнеру. Це концентрат зі спостережень за поведінкою користувачів - бери на озброєння і використовуй у своїх проектах. Перша частина статті опублікована раніше ось тут, подивися спочатку її.
Ми вже зробили огляд на кілька важливих законів і принципів у попередньому матеріалі, але це ще не все. Ось тобі ще пачка важливих моментів, продовжимо список.
7. Ефект "Ікеї"
Люди схильні надавати більшого значення продуктам, у створенні або складанні яких вони брали активну участь.
Назва ефекту походить від шведської компанії IKEA, відомої своїми меблями в розібраному вигляді, які покупці повинні зібрати самі.
Ефект можна спостерігати, коли користувачі беруть активну участь у налаштуванні інтерфейсів, персоналізації параметрів або у спільному створенні контенту. І в цьому випадку продукт цінується більше! Застосуй цей ефект, впровадивши у свої розробки технології спільної творчості або персоналізації контенту.
Застосування ефекту "Ікеї" в UX/UI-дизайні включає такі аспекти:
- Користувацьке налаштування: надай користувачам можливість налаштовувати інтерфейс або додаток відповідно до їхніх уподобань. Це може включати в себе вибір колірної схеми, макетів, віджетів тощо.
- Поступове впровадження: дозволь користувачеві поступово вивчати і налаштовувати нові функції і можливості продукту, надаючи йому контроль над швидкістю і ступенем складності цього процесу.
- Навчання та підтримка: не забувай про навчальні матеріали та підказки, які допоможуть користувачам налаштувати інтерфейс або застосунок самостійно, без необхідності залучення сторонньої допомоги.
- Прозорість і управління даними: дай користувачам контроль над своїми даними і налаштуваннями приватності, щоб вони могли регулювати, яка інформація збирається і як використовується.
Ефект "Ікеї" за правильного застосування допомагає дати відвідувачам відчуття контролю і можливості впливати на кінцевий результат. Іноді це формальність, а іноді й реальна зручність та персоналізація.
8. Поріг Доерті
Визначення оптимальної швидкості взаємодії комп'ютера і користувача.
Поріг Доерті в контексті UX/UI-дизайну описує той рівень складності, який користувач готовий перейти, перш ніж він почне відчувати незадоволення або відмовлятися від виконання завдання. Цей закон може допомогти дизайнерам визначити, наскільки складним або криволінійним може бути інтерфейс, перш ніж користувачі втратять інтерес і перейдуть до інших варіантів.
Річ у тім, що не можна взяти і назвати якісь певні показники, які потрібно брати на озброєння. Тому що все залежить від аудиторії. Дуже різні сайти і застосунки виходять, якщо вони заточені під айтішників і під пенсіонерів, наприклад. Тому вкрай важливо знати, який рівень досвіду і навичок мають твої користувачі. Деякі групи юзерів можуть більш терпимо ставитися до складних інтерфейсів, у той час як інші можуть потребувати простіших рішень.
Застосування закону Порогу Доерті в UX/UI-дизайні:
- Забезпечення простої і складної навігації: розроби інтерфейс так, щоб користувачі могли легко почати використовувати його, але також надай більш просунуті функції для тих, хто їх шукає. Модульність і покрокова інтеграція функцій можуть допомогти задовольнити різні потреби.
- Поступове заглиблення: можливість почати з мінімуму і заглиблюватися у функціональність інтерфейсу в міру необхідності вже згадувалася і в інших пунктах. І це дуже гарна ідея майже у всіх ситуаціях.
- Тестування з користувачами: це якраз той випадок, коли бажано проводити тестування з реальними користувачами, щоб визначити, який рівень складності вони готові переносити.
- Збалансований дизайн: постарайся збалансувати складність інтерфейсу, надаючи прості та складні шляхи виконання завдання, щоб користувачі могли вибирати їх залежно від своїх уподобань.
Важливим є розуміння потреб і очікувань користувачів щодо складності інтерфейсу. Задоволення користувачів і їхні очікування можуть варіюватися, тому постарайся надати інтерфейс, який балансує між простотою і функціональністю, щоб задовольняти різні потреби.
9. Ефект фон Ресторфа
Люди мають тенденцію бачити сенс у більш упорядкованих і організованих елементах, ніж у безладних.
Ефект Ресторфа можна застосовувати в UX/UI-дизайні для поліпшення розуміння і сприйняття інформації користувачем. Як це працює:
- Структура та організація: складай інформацію та елементи інтерфейсу так, щоб вони легко сприймалися і були зрозумілі. Це включає в себе логічну структуру, категоризацію даних, групування елементів і правильне вирівнювання.
- Використовуй шаблони: стандартні заготовки допомагають створити впорядкований вигляд інтерфейсу. Застосовуй макети, гріди та сітки. Намагайся дотримуватися єдиного стилю для аналогічних за функціоналом і смисловим навантаженням елементів.
- Чіткість і послідовність: дотримуйся послідовності в розміщенні елементів і наданні інформації. Це допоможе користувачам передбачувано сприймати і використовувати інтерфейс.
- Колірна схема: грамотно підбирай палітру для виділення ключових елементів і позначення структури. Колір також допоможе створити зв'язки між різними частинами інтерфейсу.
- Упорядкована навігація: знову ж таки, послідовність і зрозумілість допоможе швидко і легко переміщатися інтерфейсом і знаходити потрібну інформацію. І візуальна схожість елементів допомагає зрозуміти, як вони працюють - якщо один уже опанований, то другий уже досліджувати не потрібно.
Нюанс: за наявності кількох схожих об'єктів найбільше запам'ятовується той, який відрізняється від інших. Роби акцент на важливому в такий спосіб!
10. Закон зміни фону
Зміна фону = привернення уваги до об'єкта
Об'єкти, оточені нічим, легко зникають з поля уваги, а раптова поява елемента або зміна фону може значно привернути увагу користувача.
Це пов'язано зі здатністю людського сприйняття виділяти нещодавно з'явилися або несподівані елементи в навколишньому середовищі.
У контексті UX/UI-дизайну це використовують таким чином:
- Створення важливих повідомлень: використовуй цей ефект, щоб виділити важливі повідомлення або попередження. Наприклад, виділення таких елементів кольором або анімацією може привернути увагу користувача до ключової інформації.
- Підказки та підсвічування: важливі елементи інтерфейсу, як-от кнопки дії або посилання, можуть бути виділені яскравими кольорами, анімаціями або підсвічуванням під час наведення курсору. Це допомагає користувачам визначити, які дії вони можуть виконати.
- Анімації переходів: додавання руху допоможе користувачеві зрозуміти, як елемент інтерфейсу змінився або перемістився. Наприклад, плавні переходи або анімовані індикатори можуть полегшити сприйняття змін.
- Увага до деталей: додавай мікроанімації, це допоможе зробити інтерфейс живішим і привабливішим: анімація завантаження, прокрутки, перетягування, анімовані іконки.
- Підказки і навчання: використовуй анімацію і підсвічування, щоб вказати користувачам, як взаємодіяти з елементами інтерфейсу, особливо в нових додатках або на сторінках з нетривіальними функціями.
Закон зміни фону може бути потужним інструментом, але слід використовувати його обережно, щоб уникнути непотрібного відволікання та перевантаження інтерфейсу.
11. Закони гештальту
Тут одразу кілька законів, які ми об'єднаємо під одним розділом. Закони гештальта - це набір психологічних принципів, які описують, як людина сприймає та інтерпретує візуальну інформацію як організоване ціле.
У контексті UX/UI-дизайну, ці закони можуть бути потужним інструментом для створення інтерфейсів, які легко сприймаються та є ефективними. Ось основні закони Гештальта і як їх можна застосовувати:
Закон продовження: елементи, вишикувані в лінію або криву, будуть сприйматися як послідовність і можуть бути пов'язані один з одним. Використовуй цей закон для позначення потоку інформації або кроків у процесі, використовуючи лінії, стрілки і напрямок елементів.
Закон замикання: цей закон передбачає, що людина бачить закінчені форми, навіть якщо вони не повністю замкнуті. Використовуй цей закон, щоб створити обведення навколо групи елементів, щоб підкреслити їхній зв'язок, навіть якщо форма не повністю закрита.
Закон подібності: елементи, які схожі за своїм зовнішнім виглядом, згруповуються разом у розумі користувача. Застосування цього закону включає в себе використання схожих кольорів, форм або стилів для позначення пов'язаних елементів, таких як кнопки, меню або посилання.
Закон близькості: елементи, що знаходяться близько один до одного, будуть сприйматися як група. Використовуй відстань і простір, щоб виділити різні групи елементів і створювати структуру в інтерфейсі. І навпаки, не ліпи поруч те, що не має бути групою за логікою.
Закон загального фону: цей закон описує, як елементи можуть об'єднуватися разом на загальному тлі. Створюй контраст між фоном і елементами, щоб підкреслити їхню важливість і зробити їх більш помітними.
Закон фігури і фону: мозок бачить об'єкти або як фігури, або як фон, залежно від їхнього контрасту і контексту. Створюй контраст між елементами і фоном, щоб забезпечити легкість сприйняття інтерфейсу.
12. Ефект естетичності та зручності використання
Користувачі сприймають естетично приємний дизайн як більш зручний та ефективний, навіть якщо він не має жодних функціональних переваг.
Це найважливіша основа того, чому візуальний дизайн такий важливий у UX-проектуванні. І чому нам треба створювати візуально привабливі елементи дизайну для поліпшення користувацького досвіду.
Цей ефект передбачає, що користувачі більш схильні оцінювати і продовжувати використовувати продукт, який не тільки функціональний, а й естетичний і приємний для ока. Ось як можна застосовувати це в UX/UI-дизайні:
- Візуальний дизайн: створи привабливий і збалансований дизайн інтерфейсу з використанням гармонійних колірних схем, якісних зображень і шрифтів, а також вдалого розташування елементів.
- Задоволення запитів: працюй над тим, щоб користувачі не тільки могли виконувати завдання, а й отримували задоволення від процесу. Створюй інтуїтивні інтерфейси, приємні оку анімації та візуальні ефекти.
- Індивідуальність: дозволь користувачам налаштовувати інтерфейс відповідно до їхніх власних уподобань. Наприклад, надай їм можливість обирати теми, колірні схеми або макети. Це одразу задовольнить і згаданий вище Ефект "Ікеї".
- Дотримання стилю і брендингу: приділяй увагу стилю і брендингу продукту, щоб інтерфейс відповідав загальній ідентичності бренду. Якщо брендбуку немає, запропонуй його розробку.
- Увага до деталей: детально розроблені елементи, такі як іконки, кнопки та анімації, сприяють загальному сприйняттю високого рівня якості дизайну. Тут ми писали докладно про кнопки і поля.
Зрештою, красивий і зручний дизайн може призвести до більш високої лояльності користувачів і збільшення успішності продукту.
Хочеш знати більше?
Найкраще всі ці закони, ефекти і принципи запам'ятовуються на практиці. І зробивши пачку інтерфейсів ти зрозумієш, як це працює. Саме практичний підхід наша фішка. Реєструйся на онлайн-курс "UX/UI легенда" і ставай профі!