Що дратує дизайнерів в інтерфейсах

Відхід від стандартів

«Приклад, коли інтерфейси ускладнюють наше життя, — це порушення гайдлайнов платформи. Незвичне розташування і зовнішній вигляд елементів, непередбачувану поведінку збивають з пантелику і дратують. Варто побоюватися таких помилок, потрібно читати гайдлайны і перевіряти рішення на користувачів — хоча б на друзів і колег. Гучний приклад — використання бічного меню (або гамбургер-меню) як основної навігації додатків для айфона. Проблема в тому, що таке рішення ігнорує головні функції навігації — відповідати на питання „Де я перебуваю?“, „Куди можу потрапити?“ і „Що мене там чекає?“».

 

«Дизайнери змінюють зовнішній вигляд „контролів“ (керуючих елементів, кнопок, табів, заповнення форм і так далі. — Прим. ред.) на сайтах, щоб зробити сприйняття бренду цілісним, але іноді забувають про особливості поведінки стандартних елементів. Так виходять кастомні випадаючі списки, в яких можна вибрати потрібний елемент, натиснувши першу букву. Або кнопки „завантажити файл“, які не підтримують drag-and-drop, як, наприклад, зробив Atlassian в останніх версіях JIRA (комерційна система відстеження помилок. — Прим. ред.). Біль у тому, що поки це була стандартна кнопка, я міг перетягнути файл на неї. Якщо щось виглядає як фіалка, пахне, як фіалка, то і працювати він має не гірше. Часто ж у гонитві за красою забувають, що крім зовнішнього вигляду потрібно дублювати і поведінка з усіма його нюансами».

 

«Мене дратує неединообразие. Посилання в одному місці сайту підкреслені, а в іншому — ні. Одні кнопочки реагують на ховер (індикацію взаємодії, наприклад, коли кнопка змінює колір при наведенні на неї курсора. — Прим. ред.), інші — немає. Одні опуклі, інші — ні. Напевно, в мені помер прапорщик. Бридко, зате узгоджено».

Гальмуючі інтерфейси

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

 

«Враження часто псують гальмують, скачуть, абияк працюють інтерфейси. Проблема виявилася на рівні розробки, але відповідальність лежить на дизайнера. Результат дизайну — продукт, працююче рішення, тому помилково вважати, що на макетах проектування закінчується. Щоб досягти якісного результату, дизайнер повинен стежити за всіма етапами аж до повної готовності.

Ще одна область, де допускають помилки, — використання анімації в інтерфейсі. Вона дратує і псує враження, коли гальмує. Вона ускладнює роботу, якщо занадто затягнута. Хороша анімація дає зворотний зв’язок, відмінна — доповнюється кайф-ефектом. Інтерфейсна анімація допомагає зрозуміти, який процес відбувається, переконатися, що нічого не зламалося. Якщо ці функції не виконуються, то, швидше за все, від анімації потрібно позбутися».

«За те, що приклеивающиеся тулбари починають лагают при скролінгу, потрібно карати розробників, а не дизайнерів. Та й автоматичні слайд-шоу справді дратують. Я не люблю, коли інтерфейс працює сам по собі, без бажання користувача. Є чудові приклади реалізації, коли до слайда приставляють невеликий прогрес-бар, завдання якого — відстежувати таймінг перегортання слайда. Така поведінка менше дратує користувача, оскільки відразу дає зрозуміти, скільки часу залишилося на подумати».

Просування сторінок, гонитва за кліками та KPI

 

«Сьогодні майже всі новинні портали грішать любов’ю до просування своїх сторінок в соціальних мережах. Я перейшов по посиланню, нічого не встиг прочитати, а мені пропонують любити їх і ділитися посиланнями. Я ж ще нічого не прочитав! Пустіть мене на сторінку там я вже зможу вирішити, чи хочу я ділитися цією інформацією чи ні. Мораль проста: не заважайте користувачеві доступ до інформації. Людина приходить в першу чергу за інформацією, а не за дизайном і анімаціями».

 

«Дратують інтерфейси-тирани („Ви були неуважні, спробуйте ще раз“), інтерфейси-жебраки („Підпишіться, а то мене звільнять“), інтерфейси-роботи (повсюдний канцелярит: „У зв’язку зі збоєм на стороні постачальника послуг в інтернет-банку „Х“ і мобільному банку „Y“ недоступно поповнення транспортної карти „Z“. „Приносимо вибачення за доставлені незручності“. Канцелярит робить систему марудною і складною для спілкування, як тітка у віконці паспортного столу)».

 

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

Гонка за кліками іноді заважає. Я б виходив з кореляції CTR, фідбек користувачів і того, як продукт у підсумку вирішує бізнес-завдання. Можна відсунути банер від кнопки, продукт почне приносити, умовно, на 30% менше грошей, і ось тут вже власник продукту повинен вирішити, як дотримати баланс між UX і дзвінкою монетою. Але можу сказати, що рішення, яке не шкодить користувачеві, можна придумати майже завжди.

Те ж саме з нескінченною стрічкою прокрутки. Вона виправдана в соціальних мережах, де через неї досягається високий KPI у вигляді часу, проведеного в сервісі. Це часом різко скоротиться, якщо зробити пейджинацию (розбивку вмісту на окремі сторінки. — Прим. ред.). А ось в інтернет-магазині, наприклад, нескінченна стрічка шкідлива, оскільки людина орієнтується за основним параметром вибірки (наприклад, ціна) і може перебирати в розумі, на якій сторінці каталогу опиняться товари потрібної йому цінової категорії. Все залежить від завдання».

Форми для заповнення

 

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

Діють на нерви дефолтні налаштування. Майже у всіх програмах дефолтні налаштування за замовчуванням жахливі. У деяких выбиралках дати народження по дефолту стоїть нинішній рік або який-небудь 1900. Хоча подивитися в аналітиці, будь користувачів приходить найбільше, займає хвилину. Так, помилка на пару років буде, але хоча б скролл весь XX століття не доведеться. Досить зробити хороші, дійсно розумні налаштування за замовчуванням, і ось вже 80% людей, які не вникають у деталі і не змінюють ці параметри, виконають своє завдання швидше та краще».

 

«Про шкоду кнопки Reset вже багато писали, а кейс розташування поруч кнопки „скасування“ і „збереження“ можна відмінно вирішувати або чорновим автозбереженням (наприклад) у поштових програмах), або додатковим, необов’язковим вікном підтвердження, що сама зрозуміє, що потрібно зараз відображатися. В цілому завдання дизайнера — передбачити UX інтерфейсу таким чином, щоб мінімізувати ризики втрати даних.

Взагалі, використання приховують символів — багаторічний, вироблений мільйонами користувачів патерн поведінки полів для введення пароля. Основна причина їх появи — щоб ніхто не зміг підглянути пароль звідки-небудь з-за плеча, або якщо ти його запровадила, а потім відвернувся і відійшов від комп’ютера. При цьому я допускаю, що на мобільних пристроях або планшетах, коли дійсно ризик підглядання невеликий, цілком можна перевірити гіпотезу відмови від точок в поле введення пароля, але слід розуміти, що частина користувачів може почати вважати сервіс небезпечним, тому що „навіть пароль у них у відкритому вигляді“.

До повідомлень виду „Are you sure?“ потрібно ставитися дуже уважно. Потрібно чи повідомлення перед стартом форматування диска? Напевно, так. Чи потрібно воно при спробі зайти в каталог інтернет-магазину? Напевно немає. А от чи потрібно воно при відправці великий і довгої форми, результат обробки якої спише 8000 рублів з вашої банківської картки?».

Інші спірні моменти

 

Додатки, які не закриваються хрестиком

«На мою думку, те, що деякі програми не закриваються таким чином, засноване на статистичних даних, коли користувачі закривають його, насправді чекаючи, що воно продовжить роботу у фоновому режимі. А на Mac OS в цьому плані більш адекватна поведінка, коли користувач абсолютно точно знає, що додаток при натисканні на хрестик не закриється, а згорнеться у фоновий режим, і закрити його можна тільки вручну».

Вкладені меню з вкладеними меню

«В випадаючих меню я також не бачу нічого поганого, якщо вони забезпечують правильний UX і допомагають, а не заважають користувачеві. Зате в них при грамотному підході можна розмістити досить складну ієрархію вкладених структур».

Капча

«Є різні способи, що дають можливість відрізнити користувача від бота. Наприклад, тест Тюрінга — найпростіший і, напевно, до цих пір один з найдієвіших способів».

 

Підказки для новачків

«Перебуваючи в захваті від складності своєї системи, розробники часто намагаються розповісти про усієї сотні функцій, які вони запхали в нещасне додаток. Гордість не дозволяє додати їм менше півдюжини екранів зі стрілками і підказками. А людина, включивши в перший раз додаток, може й не добратися до початку роботи з ним, втомившись від читання короткого мануала шість сторінок по використанню user-friendly-додатки».

Чому важливий контекст

 

«Можна передивитись весь інтернет, з серйозним обличчям зібрати список 25 найбільш частих і дратівливих помилок в дизайні інтерфейсів“ і зрубати всі перепис Галактики. Тільки тоді доля цієї колонки — очолити той самий список, адже жодних норм з цього не вивести. Вся сіль — у контексті використання.

Інтерфейс — це думка, яку одні люди хочуть донести до інших. Чекбокс, кнопка, діалогове вікно, клавіатура, дверна ручка або дорожній знак з обмеженням швидкості. Нам важливо заздалегідь знати, як саме поведуть себе всі ці речі ще до контакту з ними. Якщо повернути дверну ручку, двері, швидше за все, відкриється (принаймні, я на це сподівався). Піктограми або напис „від себе“ допоможуть зрозуміти, в яку саме сторону, а форма ручки допоможе зробити це швидше. Може бути, двері взагалі зможе відкритися автоматично, коли людина наблизиться до неї.

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

Не володіючи контекстом, не можна стверджувати, що кнопки „зберегти“ і „видалити“ не можуть перебувати поруч, випадаюче меню не повинно містити подвійну структуру, а автоматичне слайд-шоу на сайті зашкодить сприйняттю інформації.

Натискаючи на хрестик, я не хочу знати, закрилося додаток або згорнулося — я просто хотів би перестати його бачити. Перезавантажиться сторінка, збережуться дані, куди веде кнопку „підтвердити“ — все це неважливо для користувача. Людина хоче відправити повідомлення, купити мікрохвильову піч і забронювати столик у ресторані. А завдання дизайнера — створити для цього просту систему, не розставляючи перешкод.

Спробуйте, наприклад, закрити вкладку в браузері, попередньо заповнивши поле написання статусу на фейсбуці. Або перейти куди-то всередині самого сайту. Бар’єр, який виникає абсолютно несподівано для людини. Сайт проявив ініціативу і заборонив браузеру себе закрити, щоб зберегти якусь інформацію. Найкращим дією була б можливість відновити вкладку разом з усіма даними, але тільки після її закриття. Така маленька магія вже існує, наприклад, у поштових клієнтів: чернетки листів зберігаються автоматично. А браузер дбайливо зберігає недавно закриті вкладки.

Поки одні працюють над простотою змісту і форми інтерфейсу, пояснюючи користувачеві, як слід їм користуватися, інші роблять так, щоб користувачеві не потрібно було знати про його існування. А будь-які елементи, які в кожному конкретному випадку не вирішують завдання, поставлене людиною, можна називати помилками».

  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
(1 голос, в среднем: 5 из 5)

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

Ваша e-mail адреса не оприлюднюватиметься. Обов’язкові поля позначені *