Форма, подпись и положение подсказывают, что элемент интерактивен.
Элемент обещает и отвечает
Хороший интерфейс сообщает три вещи: что можно сделать, что происходит сейчас и чем действие закончилось.
Нажатие, загрузка и блокировка защищают от повторного действия.
Успех или ошибка видимы, понятны и предлагают следующий шаг.
Быстрая проверка: Проверяйте цепочку: ожидание -> действие -> состояние -> следующий шаг. Пропущенное звено превращает интерфейс в догадку.
Эвристики Nielsen Norman Group требуют видимости состояния системы и предотвращения ошибок. W3C также рекомендует ясные элементы и понятную обратную связь.источники
Сравните панель действий
В первой версии пользователь угадывает иконки и не видит результат. Во второй действие подписано и подтверждено.
Вариант А: иконки без обещания
Материалы урока
После нажатия экран не меняется.
Что произошло?
Сбой: Непривычные символы не объясняют действие, а отсутствие состояния не подтверждает результат.
Вариант Б: действие и ответ
Материалы урока
✓ Урок сохранен в «Мои материалы»
Состояние говорит, что произошло и где искать результат.
Система: Форма, подпись и обратная связь складываются в понятную цепочку.
Выберите состояние загрузки
Пользователь отправил видео. Какой вариант лучше сообщает процесс?
Мини-лаборатория
Ищите действие, текущий статус и возможность понять, когда ждать результат.
Исправьте неясную форму
После отправки заявки кнопка исчезает, форма остается заполненной, а подтверждения нет.
Что видит пользователь
Кнопкаисчезла
Поляостались заполнены
Сообщениеотсутствует
Следующий шагнеясен
Какая команда лучше?
Дайте задачу агенту
Используйте шаблон как рамку разговора. Сначала наблюдение и критерии, затем изменение.
Проведи аудит только по понятности элементов и состояниям.
1. Перечисли все интерактивные элементы и действие каждого.
2. Найди элементы, которые выглядят неактивными или требуют угадывать иконку.
3. Для главного действия опиши состояния: покой, наведение, фокус, загрузка, успех, ошибка, недоступно.
4. Добавь видимую обратную связь и следующий шаг.
5. Не меняй структуру, тексты страницы и визуальную систему за пределами этих элементов.Урок освоен, если вы можете
Ваш преподаватель - агент
Попросите агента пройти страницу только по названиям кнопок и состояниям, не читая основной текст. Все места, где он вынужден предполагать, занесите в аудит.