Ux-дизайн: 4 психологічних правила, які допоможуть в роботі
Від того, яким буде перше враження про сайт, залежить дуже багато чого. Згідно з дослідженням, проведеним Університетом науки і техніки Міссурі, в 94% випадків основна увага користувачів, що вперше відвідують будь-якої сайт, залучав дизайн. Дослідження також показали, що 88% людей не поверталися на одного разу переглянутий сайт через проблеми з юзабіліті. 88 відсотків - це занадто велика цифра, тому сьогодні для користувача досвіду потрібно приділити найпильнішу увагу, інакше сайт просто загубиться на тлі своїх конкурентів.
Може здатися, що досить створити сайт з гарним дизайном і хорошим функціоналом для того, щоб він став популярним. Так, естетика вкрай важлива, але це лише один з факторів успіху. Юзабіліті також має велике значення, тому при створенні сайту, потрібно пам`ятати про психологію користувача і керуватися декількома правилами, які зроблять сайт більш зручним для перегляду. Що ж це за правила?
Правило №1: Контекст вирішує все в UX
Всі бачили оптичні ілюзії і графічні ребуси. Часом зір нас обманює і ми сприймаємо контент трохи інакше ніж задумано. Ось простий приклад. Що ви бачите на зображенні вище? Число або букву? 13 або B? Адже не можна одночасно бачити і те й інше. Тому, щоб правильно ідентифікувати картинку, потрібен контекст.
І ось цей же символ, але вже в контексті. Що ви бачите? A, B, C, чи не так? Тут помилки бути не може, один і той же трафаретний шрифт, єдиний стиль і розмір. Але двозначний символ перестав бути таким, перетворившись в букву.
Відео: Що таке UI і UX дизайн. Навіщо вони потрібні. UI проти UX
А тепер розглянемо цей символ в іншому контексті. Ніяких сумнівів, перед нами цифра 13. Навіть дивно, що ще кілька секунд тому, наш мозок сприймав символ як букву В.
Повернемося до найпершої зображенні. Так як вона існує сама по собі, то користувач може побачити і букву і цифру, все залежить від його переваг або попереднього досвіду. У другому прикладі помилка малоймовірна, в третьому та ж картина.
Відео: Дизайн інтерфейсу користувача UI UX DESIGN
І останній приклад. Дуже забавно, чи не так? Знову нічого не зрозуміло, і можна самостійно розміщувати картинку в потрібний контекст. Ось тільки для користувацького досвіду такі графічні ребуси не дуже підходять. Одна справа, якщо це якась непримітна пасхалка, але якщо в дизайні з`являється елемент, який неможливо трактувати єдино вірним способом, то це дуже погано. Користувач розраховує на один ефект, а отримує щось зовсім інше, наприклад, непотрібну інформацію. Після такого зазвичай сайт не відвідують повторно. Ось так працює контекст.
Відео: UX UI дизайн - що це таке, уроки для початківців: як малювати тінь, Галочка, посилання,
Розглянемо ще одну відому оптичну ілюзію - «Вазу Рубіна». Що ви бачите? Вазу або особа? Наше сприйняття часом залежить від нашого попереднього досвіду. Якщо перед переглядом картинки людина спілкувався з людьми або просто побачив щось схоже, наприклад, портрет вигляд збоку, то він побачить обличчя. Якщо ж він думав про посуд, скажімо, про кубках, вазах або глечиках, то шанс, що він побачить вазу, істотно зростає.
У психології виділяються чотири рівні сприйняття: виявлення, розрізнення, ідентифікація і впізнання. Тому люди схильні сприймати інформацію певним чином, на основі своїх очікувань і досвіду, отриманого раніше. Перцептивний сет формується під впливом культури, користувацького досвіду, візуальних переваг і ситуацій, в яких побувала людина.
Але як все це відноситься до веб-дизайну.? А ось як.
Правило UX: не кидайте добре опрацьовані моделі User Experience. Залиште їх, але зробіть дизайн крутіше або забавніше
.
Відео: Курси веб-дизайну. Професія: веб-дизайнер і дизайнер інтерфейсів UX & UI
Дизайнерам, як творчим людям, властиво прагнення до нововведень, їм не хочеться використовувати рішення, які здаються їм занадто простими або шаблонними. Але часом нововведення можуть сильно пошкодити сайту. Дизайн повинен бути зрозумілим: коли люди заходять на сайт, вони підсвідомо очікують, що деякі елементи будуть розташовуватися в певних місцях. І дизайнеру, яким би новатором він себе не вважав, краще не чіпати ці елементи, інакше у користувачів виникнуть проблеми з юзабіліті.
Візьмемо, наприклад, просту форму, яка запитує ім`я та адресу електронної пошти. Є безліч вдалих варіантів таких форм, тут нічого вигадувати не потрібно. Користувачі звикли до такого дизайну, значить не варто позбавляти їх звичного контексту. Нехай в першому полі буде ім`я, а в другому пошта. Сприйняття - тонка штука, а в випадку з формою запиту це сприйняття підкріплюється багаторазовим повторенням дії. Дизайнеру не варто шукати тут свіжих рішень без вагомих на те причин. Але якщо дійсно потрібно впровадити щось нове, то краще додати в дизайн підказки, щоб поліпшити взаємодію.
Правило №2: Зображення повинно бути правильно позиционировано
Візуальна складова в веб-дизайні дуже важлива, з цим не посперечаєшся. Однак зображення потрібно правильно позиціонувати, а це не так просто, як здається на перший погляд.
Ось хороший приклад, який кочує з однієї статті про UX в іншу. Це теплова карта, що показує, як користувачі сприймають дизайн і на що звертають основну увагу.
А тепер погляньте на цю картинку. Зображення дуже схожі, і там і там ми бачимо немовляти зліва і текст справа. Але різниця колосальна. Якщо в першому прикладі користувачі цікавилися особою дитини і мало звертали увагу на текстовий контент, то після роботи над помилками, яку провів дизайнер, все змінилося.
Все, що потрібно було для цього зробити - розгорнути немовляти на зображенні так, щоб він як би розглядав заголовок. В результаті користувачі також дивилися на картинку, а потім їх погляд переміщався на текст. Що це означає? Тільки те, що від правильного позиціонування залежить дуже багато чого.
Ось ще один схожий приклад. Хороший дизайн, все начебто правильно, але теплова карта показує, що не все гаразд. Дівчина на зображенні дивиться в об`єктив і відвертає увагу на себе. А планувалося, що головними повинні бути заголовок і тюбик з шампунем.
Проблема була вирішена досить витончено. Всього лише погляд на продукт і в тепловій карті з`явилися червоні плями, які свідчать, що увагу привертають потрібні елементи.
Як це можна використовувати в веб-дизайні? Використання невдало підібраних зображень може відвернути людей від повідомлення, яке хоче донести дизайнер. Особливо важливо ретельно працювати з зображеннями при проектуванні сайтів електронної комерції. Тут помилка може бути фатальною. А ось правильно позиційований зображення дозволять збільшити конверсію. Працюючи над позиціонуванням картинок, потрібно обов`язково використовувати теплові карти і тестувати дизайн на фокус-групах.
Правило №3 Уникайте кардинальних змін в дизайні
Ви не замислювалися, чому найбільші й найуспішніші сайти дуже рідко роблять серйозний редизайн. І чому щоразу, коли дизайн змінюється кардинально, це призводить масового невдоволення користувачів?
Все пояснюється законом Вебера про порозі розрізнення. Закон Вебера говорить, що інтенсивність відчуття прямо пропорційна логарифму інтенсивності подразника. Тобто, якщо замінити люстру, в якій чотири лампочки, на люстру, в якій лампочок вісім, різниця буде дуже помітною. Але якщо додати до чотирьох одну, п`яту лампочку, то людина може і не помітити змін. А якщо і помітить, різницю він майже не відчує.
Закон Вебера можна і потрібно використовувати в веб-дизайні. Приклад таких сайтів, як Facebook або Google, показує, що серйозні зміни в дизайні викликають негативні емоції користувачів. Не так давно Google змінив логотип, всього лише логотип, але мережева громадськість кілька днів не могла заспокоїтися, не дивлячись на те, що новий логотип вийшов дуже вдалим. Його користувачі не люблять змін, особливо великих. Дослідження Скотта Ейдельмана, проведене в 2010 році, показало, що люди віддають перевагу речам, які існують довго і стали звичними. Студенти, які взяли участь в експерименті, вибирали ті курси, які читалися протягом багатьох років. Вибирали звичне, навіть незважаючи на те, що оновлені курси були легше і вимагали менше письмових робіт. Сильний опір змінам може бути пов`язано з еволюцією: наші предки вживали завдяки тому, що знаходили сталість безпечним і боялися нового і невідомого.
Так що третє правило потрібно використовувати з оглядкою на психологію. Зміни повинні бути невеликими і поступовими. Якщо ж сайт сильно застарів і потребує радикального редизайну, то не варто випробовувати долю - краще протестувати новий дизайн на невеликої аудиторії користувачів і подивитися на їх реакцію. Негативні відгуки, звичайно, будуть, від них нікуди не дінешся, з огляду на вищесказане. Але тут важливий відсоток негативу. Якщо вдасться звести його до мінімуму, то радикальний редизайн цілком допустимо.
Правило №4: Використовуйте читаються шрифти
Наше враження про сайт також залежить від використовуваних на веб-сторінці шрифтів. Точніше, від їх розміру. Дослідження показують, що розмір шрифту має велике значення і більші символи викликають у користувачів сильні емоції. Експерти стверджують, що найкращим для позитивного сприйняття є тексти, набрані шрифтом з розміром мінімум 16 пікселів.
Однак дослідження не виявили жодної різниці в розумінні текстів. Користувачі прекрасно все розуміли, змінювалося лише їх настрій. Людям розбірливий шрифт читати було легше, тому вони відчували позитивні емоції. Також слід пам`ятати про такий феномен, як шлях сканування. Коли ми читаємо текст, наші очі не сканують букву за буквою, вони сприймають текст, роблячи невеликі скачки, звані саккадами. Потім очі роблять паузу, це момент називається фіксацією, після чого цикл триває. Чим простіше буде шлях сканування, тим легше користувачам буде читати.
Як це правило може бути застосовано до веб-дизайну? Люди активно переглядають текстовий контент, так що не потрібно створювати їм труднощів. Найкраще використовувати прості шрифти, які не викликають негативних емоцій. Шрифт повинен бути читабельним, значить, він не повинен бути надто дрібним, це погано для юзабіліті. З огляду на попереднє правило, краще не робити різких змін в шрифтах. Тема, набраний шрифтом, який сильно відрізняється від шрифту основного контенту, може викликати роздратування, так що для всіх ключових елементів потрібно використовувати шрифти, які не вплинуть на настрій користувача.
