top of page

10 принципів створення хороших інтерфейсів для усіх пристроїв



Брюс Тоньяццині — провідний спеціаліст Nielsen Norman Group, провідної світової компанії у сфері користувацьких досліджень. Протягом 14 років він працював в Apple, куди його особисто запросив Стів Джобс. Там він створив перший Human Interface та написав вісім версій гайдлайну до нього. Також Тоньяццині — автор 57 патентів в області людино-компʼютерної взаємодії та культової статті First Principles of Interaction Design. В ній він виклав головні принципи створення хорошого інтерфейсу. Антон Фальковський, Product Designer в Headway, партнерській компанії Genesis, поділився деякими з них. Вони універсальні й незмінні для будь-якого пристрою та середовища, та з кожним роком стають все більш актуальними.


Перш за все, «хороший інтерфейс» — означає, що він:

  • візуально-очевидний — користувач бачить увесь спектр можливостей, розуміє як досягти своїх цілей, і ніщо не заважає йому приступити до роботи;

  • пробачає помилки — вся робота користувача дбайливо і безперервно зберігається;

  • дає відчуття контролю — кожна дія користувача може бути скасована в будь-який момент;

  • ефективний — виконує максимум роботи, вимагаючи мінімум інформації.

Далі зібрані десять принципів, як такі інтерфейси створити.



1. Зручність завжди важливіша за моду.


Мода — те, що дозволяє продати все, що завгодно, починаючи від речей до NFT. Але вона не повинна знижувати продуктивність користувача. Велику кількість візуальних змін можна реалізувати у такий спосіб, щоби вони не лише не завдавали шкоди досвіду користувача, а й підвищували його продуктивність.




2. Перевіряйте дизайн інтерфейсу так само прискіпливо, як і його роботу.


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


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




3. Давайте користувачу всю інформацію та інструменти, необхідні на кожному етапі виконання завдання.


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



4. Виконання завдань цілком належать користувачу, але це не означає, що не має бути жодних правил.


Користувачам потрібен простір. Вони швидко вчаться і набувають майстерності в інтерфейсі, коли залишаються наодинці. Дорослим людям комфортно в середовищах, які не крихітні, але й не безмежні, і в яких безпечно. Саме так варто проєктувати інтерфейси.



5. Користувачу потрібно дати можливість самому приймати рішення, навіть якщо вони неестетичні.


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



6. Контроль має бути відповідальним.


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


Наприклад, в Headway дизайнер зробив можливість змінити розмір шрифту в застосунку. Але ми обмежуємо мінімальний та максимальний розмір, адже користувачу точно не знадобиться зробити надто маленький і нечитабельний, або настільки великий, що на екрані вміститься одна літера.




7. Використовуйте засоби визначення поточного стану для інформування користувачів.


Самостійність не можлива без контролю, а контроль — без достатньої інформації. Засоби визначення поточного стану дуже потрібні для того, щоб користувач мав достатньо інформації про умови, що змінюються в інтерфейсі.


До прикладу, перезавантаження iPhone під час оновлення. Проблема в тому, що незрозуміло, коли все закінчиться. Там є індикатор прогресу, але користувачу цього замало, він не знає, коли знову зможе користуватися айфоном.



8. Переконайтеся, що даєте точну інформацію про поточний стан.


Інформація, яку ви надаєте, може бути актуальною, але при цьому неточною. Наприклад, коли користувач захоче оновити айфон, система йому повідомить, що це буде проходити протягом 15 хвилин, але фактично вийде довше, — ще 20 хвилин копіюватиметься iCloud.



9. Подбайте про підказки для людей з дальтонізмом.


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




10. Тестуйте сайти, які проєктуєте, щоб знати, як їх бачать люди, які не відрізняють кольори.


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

Підписуйся на нашу розсилку та отримуй корисні матеріали першим!

Надаючи вашу електронну адресу, ви погоджуєтесь з нашою Політикою приватності.

Дякуємо, що підписалися.

image-from-rawpixel-id-5996033-png.png
bottom of page