Думка «Найкраща іконка — це текст»
Бельгійський дизайнер Томас Баттербір написав у своєму блозі колонку з прикладами того, у яких випадках слід відмовитися від графічної іконки та використовувати лише текст для позначення функціональності.
Я вже писав, що класний інтерфейс насамперед має бути зрозумілим. Іконки - значна частина багатьох інтерфейсів. І проблема в тому, що частіше вони погіршують зрозумілість, ніж покращують.
Піктограми існують із ранніх днів людства. Їх часто вважають першими проявами писемності. Деякі неписьменні народи все ще користуються ними для письмової комунікації.
Вони служать для навігації у громадських місцях. Одного тексту недостатньо, якщо це мультикультурне середовище типу аеропорту.
Іконки швидко завоювали інтерфейси. Погляньте на фото першого комерційного графічного інтерфейсу користувача на настільному комп'ютері (Xerox Star). Дизайнер Девід Сміт придумав концепцію іконок та метафору робочого столу:
Зрозуміло, чому іконки поширилися в інтерфейсах. По-перше, з ними UI стає візуально привабливішим. І при правильному використанні вони надають додатку візуального характеру.
По-друге, іконка може замінити довгий словесний опис. Це дуже добре для маленьких екранів. Але є й зворотний бік: більшість іконок важко зрозуміти. Вони змушують замислитись.
Який сенс у гарному, але незрозумілому інтерфейсі? Звідси висновок: використовуйте іконку лише тоді, коли її зміст зрозумілий усім на 100%.
Мабуть, він зовсім заплутався у незрозумілих іконках із умовами прання.
Під час обговорення цієї теми з клієнтами я часто чую: «Люди працюватимуть із додатком щодня і швидко запам'ятаютьзначення іконок». Звучить логічно, але я не впевнений, що це справді так. Я відкриваю Apple Mail кілька разів на день, але ще не впевнений, на яку іконку треба натиснути, щоб написати листа:
Ось ще погана новина: користувачі уникають незрозумілих елементів інтерфейсу. Недовіра до незнайомого у нашій природі. Коли Google вирішив в інтерфейсі Gmail сховати решту програм за незрозумілою іконкою, очевидно, його підтримка отримала купу запитів із запитаннями на кшталт «Де мій Гугл-календар?»
Інший приклад: нові користувачі Twitter після редизайну не розуміли, що робити далі. Іконка нового твіту була недостатньо зрозумілою.
У наступній версії перейти до написання твіту стало набагато простіше.
А ви знали, що в Instragram можна надсилати приватні повідомлення друзям? Потрібно натиснути ось сюди:
Якщо ви використовуєте Instagram, швидше за все, іконку ви бачили. А натискали? Незрозуміло, що вона означає.
Звісно, важливий контекст. Піктограми, гранично зрозумілі в одному контексті, стають двозначними в іншому. Звертайте на це увагу. Відкрийте лист у Gmail і подивіться на дві дуже схожі іконки, які виконують різні функції:
Я точно не раз повертався до списку листів замість того, щоб написати відповідь. Контекст має значення.
Хтось не зрозуміє іконки Tweetbot, але вони зрозумілі у контексті Twitter. Користувачі Tweetbot користуються Twitter і легко вловлюють зміст, тому їх сміливо можна використовувати:
Те ж саме можна сказати про програму Tumblr для iOS. Більшості з нас іконки здаються дивними, але користувачі Tumblr'а легко в них орієнтуються.
Додаток Rdio для Macвиглядає так:
Більшість іконок зрозуміла в контексті відтворення музики. Єдина дивина в тому, що одна з іконок має два значення: регулювання звуку та ідентифікацію треку, що зараз звучить.
Повторюю: використовуйте іконку лише тоді, коли її зміст зрозумілий усім на 100%. Сумніваєтеся – приберіть іконку. Замініть звичайним текстом, він завжди зрозуміліший.
Якщо хочете зберегти візуальні переваги ікон, комбінуйте їх з текстом. Це чудове рішення, що поєднує переваги обох підходів.
Так зроблено у App Store для Mac. Але їм це необхідно, тому що одні лише іконки будуть надто незрозумілими.
Те саме у веб-версії Twitter:
І останній приклад. Facebook згодом змінив незрозумілий гамбургер на зручну навігаційну панель, де іконки супроводжуються зрозумілим текстом:
Сподіваюся, я переконав вас, що іконки легко можуть погіршити важливу характеристику інтерфейсу — зрозумілість. Будьте уважні та тестуйте! І якщо ви сумніваєтеся, пам'ятайте: найкраща іконка — це текст.