7 эвристик для дизайна интерфейсов Web3

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

Семь эвристик юзабилити для Web3

Обратная связь следует за действием
Безопасность и доверие
Самая важная информация очевидна
Понятная терминология
Действия максимально короткие
Сетевые подключения видимы и гибки
Управление из приложения, а не из кошелька

Определения и примеры

1. Обратная связь следует за действием

Должно быть очевидно, когда что-то произошло или происходит.

Пользователи принимают решения о своих следующих шагах на основе результатов предыдущих. Поэтому крайне важно, чтобы они оставались в курсе состояния системы. Это особенно важно в Web3, так как транзакциям иногда требуется некоторое время для записи в блокчейн. Если нет обратной связи, информирующей их о необходимости подождать, пользователи не уверены, произошло ли вообще что-нибудь.

Советы:

Информируйте пользователя с помощью сообщений, уведомлений и других оповещений.
Четко сообщайте о времени ожидания.
Если действие займет больше нескольких секунд, успокойте пользователя с помощью таймера или анимации, чтобы он чувствовал, что процесс идет.
Если процесс состоит из нескольких шагов, показывайте каждый из них.

Пример: Отображение каждого шага, связанного с транзакцией, помогает пользователям понять, на каком этапе процесса они находятся. Соответствующие значки позволяют пользователю узнать статус своих действий.

2. Безопасность и доверие заложены в основу

Безопасность должна быть в приоритете, и это следует подчеркивать для пользователя. Люди очень заботятся о своих данных. Безопасность часто является главной заботой пользователей, поэтому ее следует учитывать на всех уровнях дизайна. Вы всегда должны стремиться заслужить доверие своих пользователей, но способы достижения этого могут различаться в разных приложениях. Это не должно быть чем-то второстепенным, а должно осознанно проектироваться на всех этапах. Выстраивайте доверие на протяжении всего пользовательского опыта, включая социальные каналы и документацию, а также финальный пользовательский интерфейс. Такие вещи, как уровень децентрализации, статус мультиподписи казначейства и публичность команды, — все это влияет на доверие пользователей.

Советы:

С гордостью перечисляйте свои аудиты
Пройдите несколько аудитов
Рекламируйте любые разработанные вами функции безопасности
Выделяйте возможные риски, включая базовые интеграции
Сообщайте о сложности стратегий
Учитывайте проблемы, не связанные с пользовательским интерфейсом, которые могут повлиять на восприятие безопасности вашими пользователями

Пример: Включите информацию о ваших аудитах в подвал сайта, сделав ее заметной.

3. Самая важная информация очевидна

Для сложных систем показывайте только самые релевантные данные. Определите, что является наиболее важным, и отдайте приоритет отображению этой информации. Слишком большое количество информации перегружает, и пользователи обычно цепляются за одну деталь при принятии решений. В децентрализованных финансах (DeFi) это, вероятно, будет APR в приложениях для получения доходности и LTV в приложениях для кредитования.

Советы:

Исследование пользователей поможет выявить наиболее важную метрику
Сделайте ключевую информацию крупной, а остальные детали — мелкими и ненавязчивыми
Люди не читают, они просматривают; убедитесь, что ваш дизайн легко сканируется взглядом

Пример: Крупные полноцветные токены легко найти при беглом просмотре. APR имеет большой размер и выделен акцентным цветом.

4. Понятная терминология

Терминология должна быть понятной и уместной. Технический жаргон может стать огромным препятствием, поскольку он требует построения совершенно новой ментальной модели. Пользователи не могут соотнести дизайн со словами, фразами и концепциями, которые они уже знают. Все кажется запутанным и незнакомым, и возникает крутая кривая обучения, прежде чем они вообще смогут попытаться использовать продукт. Пользователь может обратиться к децентрализованным финансам (DeFi) с желанием сэкономить немного денег, а обнаруживает следующее: майнинг, фарминг, стейкинг, эмиссии, взятки (bribes), хранилища (vaults), локеры, veTokens, вестинг, эпохи, децентрализованные алгоритмы, ликвидность, принадлежащая протоколу... Старайтесь использовать простые термины, которые будут понятны самой широкой группе людей. Не изобретайте совершенно новые термины специально для своего проекта.

Советы:

Используйте простую и последовательную терминологию
Максимально используйте существующий язык
Не придумывайте собственные термины
Следуйте общепринятым правилам по мере их появления
Обучайте пользователей как можно больше

Пример: «Ваши награды» — это широко понятный, нейтральный термин; а не новое слово, придуманное для этого проекта. Награды номинированы в долларах США (USD), чтобы соответствовать ментальным моделям реального мира, даже если сами награды выплачиваются в другом токене.

5. Действия максимально короткие

Ускорьте взаимодействие пользователя за счет группировки поддействий. Это может быть сделано как на уровне смарт-контракта, так и в пользовательском интерфейсе. Пользователю не нужно переходить из одной части системы в другую — или вообще покидать систему — для выполнения обычного действия.

Советы:

По возможности объединяйте «Одобрить» с другими действиями
Группируйте шаги подписания как можно ближе друг к другу

Пример: Объединение «добавить ликвидность» и «стейкать» — это простой пример ускорителя, который экономит пользователю как время, так и газ.

6. Сетевые подключения видимы и гибки

Информируйте пользователя о том, к какой сети он подключен, и предоставляйте понятные быстрые способы смены сети. Это особенно важно в мультичейн-приложениях. Основные функции приложения должны оставаться видимыми при отключении или подключении к неподдерживаемой сети.

Советы:

Показывайте как можно большую часть приложения в отключенном состоянии
Показывайте, к какой сети в данный момент подключен пользователь
Не заставляйте пользователя переходить в кошелек для смены сети
Если приложение требует от пользователя переключения сети, запрашивайте это действие через основной призыв к действию
Если приложение содержит рынки или хранилища для нескольких сетей, четко указывайте, какой набор в данный момент просматривает пользователь

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

7. Управление из приложения, а не из кошелька

Пользовательский интерфейс должен сообщать пользователю все, что ему нужно знать, и давать ему контроль над всем, что ему нужно сделать. В Web3 есть действия, которые вы выполняете в пользовательском интерфейсе, и действия, которые вы выполняете в кошельке. Как правило, вы инициируете действие в пользовательском интерфейсе, а затем подтверждаете его в кошельке. Пользователи могут чувствовать себя некомфортно, если эти два направления не интегрированы должным образом.

Советы:

Сообщайте о состоянии системы через обратную связь в пользовательском интерфейсе
Сохраняйте запись их истории
Предоставляйте ссылки на обозреватели блоков для старых транзакций
Предоставляйте быстрые способы для смены сетей.

Пример: Ненавязчивый контейнер показывает пользователю, какие релевантные токены есть в его кошельке, а основной призыв к действию (CTA) предоставляет быстрый способ сменить сеть.