Професійні секрети по UX: намалюйте 2 кнопки і зупиніться

У нашій класній збірці ви знайдете не менш класні поради по UX від американського дизайнера Джоела Марша. Якщо ви тут вперше – то краще розпочніть с першого секрету.

  • Секрет другий – намалюйте 2 кнопки і зупиніться

Для кожного сайту доводиться проектувати кнопки, аби привернути увагу до важливих дій, на кшталт “Опублікувати”, “Далі” або “Купити”. Такі дії називаються Основними Діями, і вони повинні бути очевидні і прості.

Але бувають й інші дії, про які ми часто забуваємо: Другорядні Дії. До них відносяться дії, на кшталт “Скасувати”, “Ні” або “Пропустити”. І вони дуже трапляються дуже часто. У чому різниця між ними?

  • Основні Дії

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

Кнопки основної дії повинні бути сильно контрастними по відношенню до фону, і зазвичай розфарбованими в якийсь колір. На білому тлі добре виглядають темно-червоні кнопки. На чорному тлі – яскраво-жовті. Ці кольори підходять для безлічі випадків. Наприклад, червоні кнопки часто перемагають в A/B тестах тільки тому, що цей колір значно помітніший.

  • Кнопки для Другорядних Дій

Вони повинні бути виконані в тому ж стилі, але бути менш контрастними по відношенню до фону. На білому тлі другорядна кнопка має бути світло-блакитною або “блискуче-білою”. До чорного фону підійде темно-коричнева, темно-сіра або “блискучо-чорна”. Колір не настільки важливий, як контраст. Іноді другорядні кнопки бувають прозорими або просто гіперлінками.

Головна ціль – зробити так, аби користувач спочатку звернув увагу на кнопку Основної Дії. І Бо якщо йому захочеться продовжити, то він не буде більше нікуди дивитися. Хочете – вірте, хочете – ні, але багато людей зроблять непотрібну вам дію, якщо побачать кнопку для цього першою.

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

Не варто покладатися на те, що користувач буде автоматично вибирати потрібну вам дію. Покажіть йому – що потрібно вибирати 😉

__________

Попередній секрет – робимо класний “Call-to-action”

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

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

email рассылки

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

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

Ваш email:
email рассылки

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