1. Тестирование
пользовательского
интерфейса

2. Usability – показатель качества, определяющий степень простоты доступа
пользователя к функциям системы, предоставляемый через интерфейс
пользователю. Например:
 легкость обучения
 эффективность обучения
 запоминаемость обучения
 ошибки - часто ли человек допускает ошибки в работе
 общая удовлетворенность
UI тестирование - предполагает проверку соответствия приложения требованиям
к графическому интерфейсу, профессионально ли оно выглядит, выполнено ли оно
в едином стиле. Подразумевает виды тестирования:
 функциональное тестирование пользовательского интерфейса;
 тестирование на соответствие стандартам графических интерфейсов;
 тестирование с различными разрешениями экрана;
 отражаемость в различных Интернет-браузерах;
 тестирование локализованных версий: точность перевода, проверка длины
названий элементов интерфейса и т.д.;
В чем же разница UI тестирования
и Usability?

3.  Ручное тестирование. Проводится, ориентируясь на документацию в
виде набора сценариев и интуицию (Ad-hoc testing). Удобно тем, что
контроль корректности интерфейса проводится человеком, т.е.
основным "потребителем" данной части программной системы.
Автоматизированное тестирование GUI. При выполнении
автоматизированного теста инструмент тестирования имитирует
действия пользователя, описанные в сценарии, и анализирует
интерфейсную реакцию системы.
Способы тестирования UI

4.  Определение корректности отображения в разных
браузерах (кроссбраузерное тестирование)
 Проверка валидности ссылок (Функциональное
тестирование UI)
 Определение размеров и расположения элементов
 Определение цвета в UI
 Проверка правописания
Основные параметры
тестирования интерфейса

5.  BrowserStack – онлайн сервис, который выдаёт скриншоты того, как выглядят сайты в
разных браузерах, ОС, на мобильных девайсах , в различных разрешениях экрана. В
свою очередь Browserstack – это облачный симулятор популярных операционных
систем и браузеров.
• http://www.browserstack.com
 Browsershots – бесплатный онлайн-сервис. Данный сервис поддерживает большое
количество браузеров, более 144 комбинаций различных браузеров и операционных
систем.
 http://browsershots.org/
 TestIE - Это бесплатная загружаемая Windows-программа, которая является
бесплатным ресурсом, позволяющим полностью протестировать все актуальные
версии Internet Explorer.
 http://ietester.en.softonic.com/
Инструменты для кроссбраузерного
тестирования UI

6. BrowserStack: проверка внешнего
интерфейса сайта mail.yandex.ru
Windows 8, IE 11.0 Windows 8.1, IE 10

7.  Xenu's link sleuth. Бесплатное десктопное приложение, которое
проверяет ссылки по всему сайту. Позволяет генерировать
отчеты.
http://home.snafu.de/tilman/xenulink.html
 Link Evaluator. Надстройка FireFox. Бесплатная
https://addons.mozilla.org/en-US/firefox/addon/link-evaluator/
 Web Link Validator . Онлайн сервис.
http://validator.w3.org/checklink
Проверка валидности ссылок

8. Xenu's link sleuth: Проверка ссылок
mail.yandex.ru

9. Определение размера элементов
 MeasureIt . Надстройка для всех браузера Chrome
https://addons.mozilla.org/ru/firefox/addon/measureit/
 PixelZoom . Бесплатная надстройка для Firefox. Делает скриншот
текущего веб-сайта и предоставляет различные инструменты для
анализа пикселей. Вы можете увеличить на веб-сайтах до 3200%,
измерять расстояния и подобрать цвета с пипетки.
https://addons.mozilla.org/ru/firefox/addon/pixelzoomer/
 Screen Calipers. Платный инструмент, который используется для
десктопных приложений.
http://www.iconico.com/caliper/

10. PixelZoom

11. WhatFontIS. Бесплатный
интернет-сервис позволят
определять шрифты через
образы. Распознает шрифт по
изображению.
http://www.whatfontis.com/
Identifont Распознает текст по
картинке, описанию, ключивым
словам. Предоставляет всю
необходимую информацию о
нем( Название, год создания,
создатель и т.д.)
http://www.identifont.com/
Определение шрифта

12.  Инструменты в виде надстроек для FireFox
 ColorZilla
https://addons.mozilla.org/ru/firefox/addon/colorzilla/
 PixelZoomer
https://addons.mozilla.org/ru/firefox/addon/pixelzoomer/
Надстойка для Google Chrome
 Eyedropper
https://chrome.google.com/webstore/detail/eye-
dropper/hmdcmlfkchdmnmnmheododdhjedfccka
Проверка цвета элементов UI

13. Eyedropper

14.  Spell Checker. Бесплатная надстройка в FireFox. Один
словарь по умолчанию, остальные 138 могут быть
скачаны с сайта при необходимости
https://addons.mozilla.org/ru/firefox/addon/spell-
checker/
 Solid Capture. Платное десктопное-приложения.
Позволяет перегнать скриншот в PDF, затем в MS
Word с распознаванием слов, в котором доступна
проверка орфографии.
http://www.soliddocuments.com/ru/products.htm?prod
uct=SolidCapture
 Spell Checker – онлайн интернет-сервес
http://www.spellchecker.net/spellcheck/
Проверка правописания

15.  Спасибо за внимание

16. Спасибо за внимание!