Як дизайнери, ми можемо за секунду визначити, який дизайн є хорошим, а який поганим.
Насправді слабкий дизайн настільки впадає у вічі, що йому присвячені цілі сабреддити (приб. підфоруми на конкретну тематику). Справа в тому, що ми навчені вигадувати інтуїтивні рішення, які, до того ж, виглядають привабливо. Тому ми відразу бачимо те, що потребує покращення. Поганий дизайн оточує нас всюди: починаючи від непрацюючих кнопок і закінчуючи некоректними формами та дратівливою навігацією. Хоча, іноді це може бути смішно, але в деяких випадках, такі помилки можуть призвести до серйозних наслідків. Завжди є сенс повчитися на вже зроблених помилках в дизайні, щоб не повторювати їх у майбутньому. Давайте розглянемо деякі найпоширеніші фак-апи у проєктуванні, з яких ви можете винести для себе урок! «Найдивовижніше у хорошому дизайні — це те, що для людей, далеких від цієї сфери, він залишиться непоміченим.» Twitter
Класична дизайнерська «помилка» відома під назвою Двері Нормана. Якщо ви ніколи не чули про неї, запитайте себе: чи зустрічали ви коли-небудь двері, на вигляд яких було незрозуміло, потрібно її тягнути чи штовхати? Вітаємо, то були двері Нормана!
Проблема полягає в тому, що такий дизайн збиває вас з пантелику. Або ви взагалі не знаєте, як відкрити двері, або ви думаєте, що знаєте, як вони відкриваються, але ваше припущення виявляється невірним.
Двері Нормана не тільки надзвичайно плутають і вводять у подив (я ніколи не міг відкрити їх правильно з першої спроби!), вони ще й стали дуже поширеними в нашому житті. Можна припустити, що це могло б призвести до створення найкращого дизайнерського рішення, але проблема, як і раніше, залишається. З нею стикається майже кожен у той чи інший момент свого життя.
Висновки:
Урок, який можна отримати з цієї помилки, полягає в тому, що досвід взаємодії та тестування з користувачами дуже важливі! Якщо люди, для яких ви проєктуєте, не розуміють, як працює ваш дизайн, або як у ньому орієнтуватися, у ньому немає жодного сенсу.
Інтерфейс дуже важливий, особливо для веб-дизайну. Гарне оформлення не означає, що людина знатиме, де знайти потрібну інформацію на сайті. Вам необхідно створити такий дизайн, щоб користувачі розуміли, як діяти далі.
"Перевірити свою роботу" простіше, ніж ви думаєте: проведіть тестування юзабіліті, щоб отримати зворотний зв'язок від вашої цільової аудиторії. Не давайте їм надто багато інформації, а просто подивіться, як вони переміщуються сайтом. Це допоможе вам розібратися в тому, як вони ним користуватимуться. Задавайте їм питання та дозвольте їм звертатися до вас за роз'ясненнями, якщо їм щось незрозуміло.
Урок 2: Запобігання людським помилкам
Незалежно від того, наскільки гарний дизайн, люди роблять помилки. Ми вибираємо не ті речі, натискаємо не на ті кнопки і натискаємо не на ті клавіші. Тоді виникає питання: чи може дизайн допомогти нам подолати людський фактор? Одним із прикладів є відправлення населенню помилкового попередження про ракетну атаку на Гаваях співробітником Гавайського агентства з надзвичайних ситуацій на початку 2018 року. Його помилка була викликана натисканням тієї кнопки. Цей випадок змусив багатьох дизайнерів засумніватися в тому, що навіть найкращий дизайн може запобігти наявності людського фактору.
Якщо ви самі не натискаєте кнопку, у вас не буде жодної впевненості в тому, як саме працює цей процес. Однак люди почали думати над вирішенням цієї проблеми, а саме над тим, як дизайн може допомогти запобігти вчиненню людських помилок. Наприклад, можливо, якби кнопки «навчальна» та «справжня» відрізнялися одна від одної або були розташовані в різних меню, такої ситуації можна було б уникнути.
Ця подія вкотре показала, наскільки важливим є проєктування з погляду захисту від помилок, які може зробити людина. Навіть у таких дрібницях, як онлайн-покупки, невелика помилка покупця може викликати великі проблеми з платежами та для вашого бізнесу загалом. Як то кажуть, найкращий захист — це напад.
Висновки:
«Незалежно від того, що ви створюєте, пам'ятайте: «Технології розумні, як і ваші користувачі». Twitter
Необхідно вводити додаткову перевірку під час здійснення важливих змін. Я говорю про те, що якщо у вашої бази даних при натисканні кнопки "Видалити" не спливає вікно "Ви впевнені?", тоді я не знаю, як ви досі вижили з такою невизначеністю у своїй роботі.
Навіть в основі кодування є інформація про те, як мінімізувати людські помилки там, де це можливо. Ось чому навіть прості профілактичні заходи, такі як встановлення належних дозволів, резервні копії або налаштування типів даних параметрів, мають першочергове значення!
Захист від людської помилки також дуже важливий для користувачів вашого сайту. Подумайте ось про що: можливо, у вас є довга форма для заповнення. Чи з'являються на екрані допущені помилки після натискання кнопки «Надіслати»? Чи є попередження "Ви впевнені, що хочете піти?", якщо користувач випадково закриває вікно під час покупки? Це прості речі, які допоможуть вашим клієнтам отримати найкращий досвід взаємодії та позбавлять вас від потенційних проблем у майбутньому.
Урок 3. Не можна забувати про типографіку
Пам'ятаєте, як на врученні «Оскара» у 2017 році було оголошено не того переможця у номінації «Найкращий фільм»? Поговоримо про маленьку помилку, якої можна було б уникнути за допомогою простої ієрархії у типографіці!
Хоча є кілька факторів, які вплинули на хибне оголошення переможця, одна зміна, яка, безумовно, могла б допомогти внести невелику ясність, — це ефективніше застосування типографіки на самій картці. (приб. Організатори переплутали картки. У конверт «Найкращий фільм» вони поклали картку з переможцем у номінації «Найкраща актриса». На неправильній картці було написано ім'я актриси та фільм, у якому вона знімалася. У результаті ведучі озвучили назву фільму без імені актриси, оскільки йшло оголошення переможця в номінації «Кращий фільм». Говориться про те, що якби дизайнери за допомогою ієрархії виділили ім'я акторки як головну інформацію, то можливо, ведучі зрозуміли б, що перед ними неправильна картка і не озвучили її на весь зал). Незважаючи на невелику кількість інформації, її необхідно відображати таким чином, щоб користувачі правильно зрозуміли. Все це зводиться до боротьби з людськими помилками: якщо типографіка опрацьована недостатньо, щоб користувач міг легко розібратися в порядку розташування інформації, йому залишається тільки здогадуватися. А якщо він неправильно вгадав, то трапляються помилки і не той фільм отримує нагороду.
Висновки:
Будь-який проєкт необхідно розпочинати зі структурування важливої інформації та використання основних принципів проєктування. Переходьте до суті та подумайте про головну мету або заклик до дії, якими ви хотіли би поділитися. Як їх можна виділити серед решти контенту? Якби користувач просто переглядав сторінку, зрозумів би він, що потрібно дізнатися чи зробити?
Ніхто не хоче заходити на ваш сайт, щоб нескінченно шукати потрібну інформацію. Іноді найпростішим вирішенням цієї проблеми є простий та акуратний дизайн. Він дозволить уникнути дублювання чи прихованої інформації, і кожен зможе знайти те, що йому потрібне!
Урок 4. Можливо, ваші користувачі не знайомі з останніми тенденціями у дизайні
Завжди цікаво пробувати у своїх проєктах нові тренди у дизайні. Візьмемо, наприклад, прозорі/контурні кнопки (я зараз говорю не про кнопку у формі ghost). Ghost кнопка зазвичай злегка окреслена за допомогою контуру в тон фону (якщо він не прозорий) і розташована на сторінці, не особливо привертаючи уваги користувача.
Ці кнопки наробили багато шуму через свій цікавий дизайн. Але можуть вводити в оману, якщо виконані неналежним чином. Користувачі можуть сприймати таку кнопку, як один з елементів дизайну на сторінці, а не як інтерактивний об'єкт, на який можна натиснути.
Висновки:
Ви завжди будете в курсі останніх тенденцій у світі дизайну. Однак, вони не завжди будуть підходити вашим проєктам. Сайт з базовим дизайном, який вже добре робить свою роботу, завжди кращий за сайт з крутим дизайном, який не працює.
Дуже важливо переконатися, що кнопки не загубилися серед іншого контенту. Якщо вони мають прямокутну форму і розташовані на сторінці, яка заповнена іншими прямокутними формами, то, швидше за все, вони не будуть виділятися так сильно, як ви спочатку розраховували.
Ще одна порада — заклик до дії має бути дуже чітким. Слово "NICE" ("ДОБРЕ") на кнопці може бути недостатньо чіткою вказівкою на те, що на неї потрібно натиснути. Вона може бути сприйнята як заголовок або декоративний елемент. Користувачам буде зрозуміліше, якщо ви будете використовувати такі дієслова, як «Дізнатися більше» або «Подати заявку».
Висновок
Хоча недоліки дизайну легко помітити, ми всі знаємо, що дизайнери завжди виконують свою роботу з найкращими намірами. Важливо володіти інформацією та вчитися одне в одного. Один із найпростіших способів навчитися проектування – допомогти дизайнеру: друга пара очей нікому ніколи не зашкодить!
Коли ви критично оцінюватимете свою дизайнерську роботу, постарайтеся зробити це з позиції користувача. Запитайте себе: чи можна розібратися на веб-сайті на інтуїтивному рівні? Наскільки він є інформативним, незважаючи на свій простий дизайн? Чи можу я попросити когось глянути на цю роботу? Об'єктивно подивитися на власний проект іноді буває складно, але це простий крок до того, щоб покращити якість своєї роботи.
Джерело: Getflywheel.com