Все предыдущие уроки этой главы искали ФУНКЦИОНАЛЬНЫЕ дефекты — что-то не работало технически: не отрисовывался блок, ломалась вёрстка, не проходила валидация, не работала навигация с клавиатуры. Юзабилити — про другое: продукт может пройти все эти проверки безупречно и при этом остаться неудобным для реального человека.
Чему научишься за этот урок:
— объяснить, что такое юзабилити и почему оно зависит от целевой аудитории;
— применить несколько практических эвристик юзабилити к находкам на полигоне;
— отличить юзабилити-дефект (нарушение конкретной эвристики) от вкусовщины (личное предпочтение).
Что такое юзабилити
Юзабилити (usability) — насколько легко и приятно реальному пользователю решить свою задачу в продукте. Юзабилити зависит от целевой аудитории: то, что удобно опытному пользователю (например, горячие клавиши или свёрнутое по умолчанию меню), может быть неудобно новичку, который ещё не знает, где что искать, — и наоборот, слишком много поясняющих подсказок раздражает опытного пользователя.
Пять практических эвристик
Полный список принципов юзабилити большой — здесь пять самых применимых для повседневной работы тестировщика.
- Видимость состояния системы — пользователь должен видеть, что происходит: например, что заявка отправляется, а не «зависла молча».
- Соответствие с реальным миром — термины и порядок действий понятны пользователю, а не только разработчику.
- Узнавание лучше, чем запоминание — не заставлять пользователя запоминать информацию с одного экрана, чтобы использовать её на другом.
- Предотвращение ошибок — лучше не дать пользователю ошибиться, чем потом показать сообщение об ошибке: например, кнопка «Удалить» требует подтверждения.
- Помощь в распознавании и исправлении ошибок — если ошибка всё же случилась, сообщение должно понятно объяснять, что не так и как это исправить.
Юзабилити-дефект vs вкусовщина
Юзабилити-дефект — нарушение конкретной эвристики, которое реально мешает пользователю выполнить задачу; для него можно указать, какое именно правило нарушено. Вкусовщина — личное предпочтение без нарушения конкретного принципа. Пример вкусовщины: «я бы сделал кнопку зелёной, а не синей» — если синяя кнопка и так хорошо видна и понятна, это не дефект, а личный вкус.
Проверочный вопрос для любой находки: можно ли назвать КОНКРЕТНУЮ нарушенную эвристику и объяснить, что именно это мешает сделать пользователю? Если нет — вероятно, перед вами вкусовщина, а не дефект.
НАХОДКА | ТИП | ПОЧЕМУ ----------------------------------------+-------------+-------------------------------- После клика "Сохранить" пользователь | дефект | нарушена "видимость состояния": не видит реакции 3+ секунды | | непонятно, идёт ли сохранение ----------------------------------------+-------------+-------------------------------- Кнопка и так хорошо видна и понятна, | вкусовщина | нет нарушенного правила, это но один из коллег хотел бы её ярче | | личное предпочтение
Итог:
— юзабилити — насколько легко и приятно пользователю решить свою задачу, и зависит оно от целевой аудитории;
— пять практических эвристик: видимость состояния системы, соответствие с реальным миром, узнавание лучше запоминания, предотвращение ошибок, помощь в распознавании и исправлении ошибок;
— юзабилити-дефект нарушает конкретную эвристику и мешает выполнить задачу; вкусовщина — личное предпочтение без нарушения конкретного правила.
Контрольный вопрос. Что такое юзабилити продукта?
Подсказка: Речь про удобство решения задачи пользователем, а не про технические метрики.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Контрольный вопрос. Почему юзабилити зависит от целевой аудитории?
Подсказка: Подумай про разницу в опыте между новичком и опытным пользователем.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Контрольный вопрос. Какая эвристика нарушена, если после отправки заявки на полигоне пользователь не видит никакого индикатора (ни спиннера, ни сообщения) и не понимает, отправилось ли что-то?
Подсказка: Речь про то, видит ли пользователь, что сейчас происходит с его действием.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Контрольный вопрос. Кнопка «Удалить курс из корзины» требует подтверждения перед выполнением действия. Какую эвристику это иллюстрирует?
Подсказка: Речь про то, чтобы не дать пользователю ошибиться, а не про то, что происходит уже после ошибки.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Контрольный вопрос. Как называется эвристика, требующая, чтобы термины и порядок действий в интерфейсе были понятны обычному пользователю, а не только разработчику? Ответь формулировкой из урока, без слова «эвристика».
Подсказка: Речь про сопоставление интерфейса с тем, к чему пользователь привык вне продукта.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Контрольный вопрос. Если сообщение об ошибке при неверном пароле понятно объясняет, что именно не так и как это исправить, какая эвристика соблюдена? Ответь формулировкой из урока.
Подсказка: Эта эвристика вступает в игру уже ПОСЛЕ того, как ошибка случилась.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Контрольный вопрос. Что из перечисленного — пример вкусовщины, а не юзабилити-дефекта?
Подсказка: Вкусовщина — личное предпочтение, которое не нарушает ни одной конкретной эвристики или работоспособности продукта.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Контрольный вопрос. Какие из утверждений о разнице между юзабилити-дефектом и вкусовщиной верны (выбери все подходящие)?
Выберите все верные варианты.
Подсказка: Дефект и вкусовщина различаются тем, нарушен ли КОНКРЕТНЫЙ принцип, а не просто тем, что кому-то не нравится.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Задание. Находка на полигоне: на экране каталога курсов кнопки фильтра расположены в другом порядке, чем такие же по смыслу кнопки на экране «Мои курсы» — пользователю приходится каждый раз заново искать нужный фильтр глазами, хотя раньше уже находил его на другом экране. Как правильно классифицировать эту находку? Ответь одним словом.
Подсказка: Подумай, приходится ли пользователю каждый раз заново запоминать/искать расположение вместо того, чтобы узнавать привычное.
✅ Готово, если: ты ввёл(а) верный ответ, и онлайн-проверка его приняла.
Проверить ответ →
Реальная проверка — на нашей платформе, бесплатно и без регистрации. Открыть задачу и ввести ответ →
Задание. Находка на полигоне: при оформлении заказа поле «Промокод» и кнопка «Применить» расположены справа от суммы заказа, тогда как в остальном интерфейсе конструкции «действие → результат» идут слева направо. Оператор поддержки (не тестировщик) отдельно заметил: «мне лично больше нравится, когда поле промокода сверху, а не сбоку». Классифицируй ОБА замечания — расположение относительно общего потока интерфейса и личное пожелание оператора — как юзабилити-дефект (с эвристикой) или вкусовщину, и объясни в 2-3 предложениях разницу между ними.
Критерий приёмки: первое замечание (расположение, не совпадающее с общим потоком «действие → результат» интерфейса) классифицировано как юзабилити-дефект с указанием на нарушение эвристики «соответствие с реальным миром» или «узнавание лучше, чем запоминание» — расположение сбивает привычный пользователю паттерн; второе замечание (личное «мне нравится сверху») классифицировано как вкусовщина, потому что это предпочтение конкретного человека без указания, какое правило нарушено и как это мешает пользователю выполнить задачу.
Подсказка: Спроси у каждого замечания: можно ли указать конкретное правило, которое оно нарушает, или это просто чьё-то персональное пожелание?
✅ Готово, если: ответ раскрывает то, что просит критерий приёмки в задании выше.
Онлайн-проверка ответа появится позже
Задание. Три находки при использовании полигона:
1) После нажатия «Оплатить» страница 4 секунды не показывает вообще никакой реакции (ни спиннера, ни текста), пока не откроется страница успеха.
2) Кнопка «Удалить аккаунт» удаляет аккаунт сразу по одному клику, без какого-либо окна подтверждения.
3) Один из тестировщиков команды считает, что шрифт заголовков «слишком строгий», и предлагает более округлый шрифт — при этом текущий заголовок хорошо читается и не создаёт путаницы.Классифицируй КАЖДУЮ из трёх находок как юзабилити-дефект (укажи, какая именно эвристика нарушена) или вкусовщину, и обоснуй каждую в 1-2 предложениях.
Критерий приёмки: находка 1 классифицирована как юзабилити-дефект, нарушена эвристика «видимость состояния системы» (нет индикатора процесса оплаты); находка 2 классифицирована как юзабилити-дефект, нарушена эвристика «предотвращение ошибок» (необратимое действие выполняется без подтверждения); находка 3 классифицирована как вкусовщина (личное предпочтение стиля шрифта без указания нарушенной эвристики, при этом текущий шрифт и так хорошо читается). Все три классификации обоснованы, а не просто названы.
Подсказка: У каждой находки спроси: указано ли, какое конкретное правило нарушено и мешает ли это реально выполнить задачу, или дело в отсутствии реакции/отсутствии подтверждения/личном стиле?
✅ Готово, если: ответ раскрывает то, что просит критерий приёмки в задании выше.
Онлайн-проверка ответа появится позже
Что дальше
На этом глава 7 «Веб-тестирование, DevTools и юзабилити» завершена. Мы прошли: из чего состоит веб-продукт и как он рендерится; вёрстку и адаптивность; формы ввода и валидацию на клиенте и на сервере; кроссбраузерность и локализацию; доступность; и в этом уроке — юзабилити. Дальше курс переходит к тестированию API через Postman — этому посвящена отдельная глава: вы научитесь собирать запросы, читать ответы сервера и находить дефекты на уровне API.
