14 з 31 уроку UX-інтенсиву від Джоеля Марша (Joel Marsh)

Share Button

14from31

(Якщо ви щойно приєдналися до нашого курсу, почніть звідси.)

***

Старі добрі гумові каченята тріумфально повертаються!

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

pattern-unbroken copy

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

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

Ламання патернів:

patterns-broken

Друга картинка знову зображає тих самих 5 гумових каченят (ну правда ж вони милі?), але цього разу одне з них співає соло. Ми назвемо її Бейонсе.

І це усе змінює.

Тепер ми бачимо ряд з чотирьох (заздрісних) каченят, і окремо Бейонсе, освітлену прожекторами, палку і пристрасну. І дуже важко не фокусуватися саме на Бейонсе, навіть якщо думати, що усі 5 каченят однаково величні створіння.

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

Це дуже могутня річ для розуміння.

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

Будьте обачні: ламання патернів може також відволікти погляд користувача від інших важливих речей. Перед тим, як зламати патерн, вам варто зробити його.

Поєднуйте усі принципи:

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

Щоб поламати патерн, просто змініть його у тому місці, на яке ви хочете направити фокус. Зробіть кнопку “Зареєструйтеся зараз” несподіваного кольору, розміру, форми чи стилю, і спостерігайте, як збільшується кількість кліків, цілісіньку ніч!

***

Наступного разу ми вивчимо більш розгорнутий варіант цієї ідеї: Домінування лінії та домінування країв.

Взято звідси.

Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

nine + ten =