7 евристичних правил для дизайну інтерфейсу Web3

Евристика юзабіліті — це загальні «емпіричні правила», які можна використовувати для вимірювання зручності використання вашого сайту. Наведені тут 7 евристичних правил спеціально розроблені для Web3 і повинні використовуватися разом із 10 загальними принципами дизайну взаємодії (opens in a new tab) Якоба Нільсена.

Сім евристичних правил зручності використання для web3

1. Зворотний зв'язок слідує за дією
2. Безпека та довіра
3. Найважливіша інформація є очевидною
4. Зрозуміла термінологія
5. Дії максимально короткі
6. Підключення до мережі є видимими та гнучкими
7. Керування з застосунку, а не з гаманця

Визначення та приклади

1. Зворотний зв'язок слідує за дією

Має бути очевидно, коли щось сталося або відбувається.

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

Поради:

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

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

2. Безпека та довіра вбудовані

Безпека повинна бути пріоритетом, і на цьому слід наголошувати для користувача. Люди дуже піклуються про свої дані. Безпека часто є головною проблемою для користувачів, тому її слід враховувати на всіх рівнях дизайну. Ви завжди повинні прагнути заслужити довіру своїх користувачів, але спосіб, у який ви це робите, може означати різні речі в різних застосунках. Це не повинно бути запізнілою думкою, а має бути свідомо спроєктовано на всіх етапах. Зміцнюйте довіру протягом усього досвіду користувача, включаючи соціальні канали та документацію, а також кінцевий інтерфейс користувача. Такі речі, як рівень децентралізації, статус мультипідпису казначейства, а також те, чи є команда розкритою (doxxed), — усе це впливає на довіру користувачів

Поради:

• З гордістю вказуйте свої аудити
• Проводьте кілька аудитів
• Рекламуйте будь-які розроблені вами функції безпеки
• Висвітлюйте можливі ризики, включно з базовими інтеграціями
• Повідомляйте про складність стратегій
• Враховуйте проблеми, не пов'язані з інтерфейсом, які можуть вплинути на сприйняття безпеки вашими користувачами

Приклад: Включіть свої аудити в нижній колонтитул, зробивши їх помітними.

3. Найважливіша інформація очевидна

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

Поради:

• Дослідження користувачів допоможе виявити найважливіший показник
• Зробіть ключову інформацію великою, а інші деталі — маленькими та непомітними
• Люди не читають, а сканують; переконайтеся, що ваш дизайн можна легко просканувати

Приклад: великі токени в повному кольорі легко знайти під час сканування. APR великий і виділений акцентним кольором.

4. Чітка термінологія

Термінологія повинна бути зрозумілою та доречною. Технічний жаргон може стати величезною перешкодою, оскільки він вимагає побудови абсолютно нової ментальної моделі. Користувачі не можуть співвіднести дизайн зі словами, фразами та концепціями, які вони вже знають. Усе здається заплутаним і незнайомим, і їм доводиться довго вчитися, перш ніж вони зможуть навіть спробувати це використати. Користувач може прийти в DeFi, бажаючи заощадити трохи грошей, і ось що він знаходить: майнінг, фармінг, стейкінг, емісії, хабарі (bribes), сховища, локери, veTokens, вестинг, епохи, децентралізовані алгоритми, ліквідність, що належить протоколу… Намагайтеся використовувати прості терміни, які будуть зрозумілі найширшій групі людей. Не винаходьте абсолютно нові терміни лише для свого проєкту.

Поради:

• Використовуйте просту та послідовну термінологію
• Використовуйте існуючу мову якомога більше
• Не вигадуйте власних термінів
• Дотримуйтесь умовних позначень у міру їх появи
• Навчайте користувачів якомога більше

Приклад: «Ваші винагороди» — це загальнозрозумілий, нейтральний термін, а не нове слово, вигадане для цього проєкту. Винагороди номіновані в доларах США, щоб відповідати ментальним моделям реального світу, навіть якщо самі винагороди надаються в іншому токені.

5. Дії максимально короткі

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

Поради:

• Поєднуйте «Підтвердити» з іншими діями, де це можливо
• Згрупуйте етапи підписання якомога ближче один до одного

Приклад: поєднання «додати ліквідність» і «зробити стейкінг» є простим прикладом прискорювача, який економить користувачеві час і газ.

6. Мережеві підключення видимі та гнучкі

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

Поради:

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

Приклад: Покажіть користувачеві, до якої мережі він підключений, і дозвольте йому змінити її на панелі застосунку.

7. Керування із застосунку, а не з гаманця

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

Поради:

• Повідомляйте про стан системи за допомогою зворотного зв’язку в інтерфейсі користувача
• Ведіть запис їхньої історії
• Надайте посилання на оглядачі блоків для старих транзакцій
• Надайте ярлики для зміни мереж.

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