Тестирование пользовательского интерфейса или UI-тестирование: цели, методы и подходы

Вы создали программное обеспечение, мобильное приложение, веб-сайт — и практически готовы выйти на рынок. А ведь новый продукт еще нужно проверить. Перед релизом важно убедиться, что все работает как надо: интерфейс удобный и понятный, дизайн привлекательный, все операции выполняются быстро и точно. Конечно, можно выпустить бета-версию, отследить отзывы, а затем доработать основной продукт. Но если речь идет не о единичных ошибках, а о системных проблемах, «косметического ремонта» будет явно недостаточно. Имеет смысл еще на этапе разработки ПО проверить юзабилити пользовательского интерфейса, то есть его простоту и удобство. В статье рассказываем, зачем и когда проводится тестирование, рассматриваем различные техники и подходы. А в конце вас ждет чек-лист — какие элементы и функции проверяют тестировщики.

UI-тестирование: что это такое и для чего нужно

UI-тестирование — это проверка пользовательского интерфейса. Аббревиатура происходит от англоязычного названия User Interface.

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

Также проверяется графический интерфейс (GUI-тестирование). Учитывают самые разные аспекты дизайна: внешний вид, читабельность текста, размер шрифта, гармоничность цветов, общее впечатление. Важно все: как расположены картинки и иконки, как сделаны визуальные акценты и т. д.

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

Типы и методы тестирования интерфейса

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

Один из самых распространенных методов — работа с бумажными прототипами. Она напоминает реальный процесс работы с приложением, однако позволяет выявить проблемы навигации, дизайна, функциональности. Отличный вариант для приложений, в которых много кнопок и окон. Способ довольно дешевый и быстрый. Нарисовать прототип на бумаге можно за несколько часов, интерактивный создается несколько дней.

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

При всех достоинствах метода интерактивные (кликабельные) прототипы дают более точные результаты, «ведут» себя почти так же, как реальный продукт. Вероятность ошибок при такой проверке намного ниже.

Есть два подхода к тестированию web-интерфейса:

• Ручное тестирование. Оператор взаимодействует с элементами системы и проверяет, как они работают, соответствуют ли требованиям. Такой способ помогает выявить проблемы, не замеченные при автоматизации, зато очевидные для «живого» пользователя: неинтуитивное поведение элементов, некорректный или некрасивый вывод на экран. Минусы тоже есть: пропуски, неточная интерпретация результатов, небольшой охват, длительность процесса, ресурсоемкость, большой процент ошибок.

• Автоматизированное тестирование. Требует специальных программных инструментов. Сценарии проверяются без участия человека. Способ быстрый, эффективный, с низким уровнем ошибок при повторяющихся действиях.

Среди методов автоматизации выделяют:

• Использование специальных утилит. Сначала проводится ручное тестирование. Действия тестировщика записывают и воспроизводят программными методами. Результаты сравнивают с ожидаемым поведением.

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

Применяются различные типы тестирования интерфейса:

• Функциональное — проверяют основные функции, элементы управления: как работают кнопки, переключатели, поля для ввода текста. Они должны соответствовать требованиям, правильно реагировать на команды пользователя.

• Нагрузочное — тестируется производительность системы при больших нагрузках, то есть при выполнении сложных операций, подключении множества пользователей.

• На совместимость с различными браузерами, платформами, отображение на экранах разного размера.

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

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

Когда проводят UI-тестирование

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

UI-тестирование актуально для больших приложений. Для небольших и краткосрочных можно использовать сквозное тестирование (E2E) реального сервиса на предмет функциональности. Еще один вариант — юнит-тесты. Они определяют, как работают отдельные компоненты. В таких случаях также проводится UX-тестирование, определяющее, как пользователь себя чувствует при взаимодействии с системой.

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

Чек-лист: что важно учесть при тестировании приложения

Приложение должно работать в реальных условиях, а интерфейс — быть красивым, удобным, понятным, функциональным. Поэтому важно изучить все аспекты. Всего их пять:

1. Визуальный дизайн.
2. Удобство и простота (юзабилити интерфейса приложения).
3. Производительность.
4. Функциональность.
5. Согласованность работы компонентов.

Учитываются две стороны интерфейса:

• визуальное представление — отображение на экране элементов, их размер, цвета, шрифты и т. д.;
• функциональность — работа всех элементов управления (кнопок, полей ввода, раскрывающихся списков и др).

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

Что именно проверяют при тестировании:

• панель инструментов, соответствие пунктов меню выбранному режиму;
• работу комбинаций клавиш в любых браузерах и девайсах;
• реагирование системы на действия с различных устройств ввода: мыши, клавиатуры и др.;
• флажки, иконки, кнопки, их срабатывание;
• отключенные поля, полосы прокрутки, скролл в таблицах;
• текстовые поля, отображение данных различных типов (цены, даты и др.), возможность ввода только допустимых значений;
• ширину полей для ввода, ограничение количества символов;
• читабельность шрифта, понятность текста, отсутствие пунктуационных, орфографических, грамматических ошибок;
• размер видео фреймов и картинок, их обтекание текстом;
• скорость загрузки страниц, выполнения операций;
• гиперссылки, навигацию, в том числе и кнопки для перенаправления на нужные страницы;
• анимацию — она должна быть плавной, переходы между экранами происходить без задержек;
• индикаторы прогресса работы;
• подсказки ввода в выпадающем меню: при введении первых букв появляются только те слова, которые им соответствуют;
• кнопки подтверждения сохранения, удаления, загрузки и других действий;
• журнал ошибок — в отдельный файл автоматически записываются сведения об ошибках;
• доступность для лиц с ограниченными возможностями, использование ассистивных технологий.

Кроме тестирования логики интерфейса и дизайна важно проверить сквозные процессы — сценарии выполнения задач. За основу берут комплекс сценариев, для которого в первую очередь создавался продукт. Пример: покупка в интернет-магазине. Сначала полностью тестируется сценарий заказа онлайн, а затем уже проверяется работа ссылок, фильтров и кнопок.

Общие рекомендации при проверке:

• Ориентируйте команду вашей компании на использование методов автоматизации.
• Начните с единичных тест-кейсов, постепенно увеличивайте охват.
• Привлекайте экспертов для мозговых штурмов.
• Приглашайте в качестве «подопытных» сотрудников, не связанных с разработкой проверяемого продукта.
• Нельзя вмешиваться в процесс тестирования. Можно наблюдать, записывать, но не комментировать действия оператора, не объяснять и не помогать ему.
• После аудита создавайте интерактивный прототип основных сценариев или тех из них, которые вызвали сомнение. Используйте цифровое хранилище для сценариев.

Тестирование интерфейса прототипов поможет создать конкурентоспособный, востребованный, продаваемый IT-продукт, обеспечить его соответствие спецификации. Приложение будет работать без сбоев, не вызывать затруднений у пользователя, четко выполнять поставленные задачи. Тестирование могут проводить сотрудники компании-разработчика, но только не те специалисты, которые создавали проект.

Если вам нужно создать мобильное или веб-приложение, обратитесь к профессионалам. Продуктами IT-компании Fortech пользуются клиенты из России, США, Израиля, Великобритании и других стран мира. Команда опытных разработчиков создаст удобное, функциональное и надежное решение для вашего бизнеса. Вы можете также заказать тестирование любого продукта. Наши специалисты проверят программный код, выявят проблемные места и помогут их устранить. Связаться с нами просто: заполните форму или воспользуйтесь контактами, указанными на сайте.