ИНТЕРФЕЙС ПОЛЬЗОВАТЕЛЯ Банников Сергей Руководитель группы Москва МЭИ

ИНТЕРФЕЙС ПОЛЬЗОВАТЕЛЯ Банников Сергей Руководитель группы Москва, МЭИ, 12 ноября 2015

ТЕРМИНОЛОГИЯ • ИНТЕРФЕЙС (interface) – совокупность возможностей, способов и методов взаимодействия двух информационных систем, устройств или программ • ИНТЕРФЕЙС ПОЛЬЗОВАТЕЛЯ (user interface) – разновидность интерфейсов, в котором одна сторона представлена человеком (пользователем), другая — машиной/устройством • ГРАФИЧЕСКИЙ ИНТЕРФЕЙС ПОЛЬЗОВАТЕЛЯ (GUI) – интерфейс, в котором элементы интерфейса, представленные пользователю на дисплее, исполнены в виде графических изображений. 2 /6

ИСТОРИЯ ВОПРОСА • Для программирования компьютера ENIAC использовались простые электрические провода • Требовалось корректно соединить сотни гнезд и выставить положения более шести тысяч тумблеров, расположенных на 40 панелях машины. • На программирование одной программы уходило до двух дней работы, при этом права на ошибку не было. 3 /6

ТЕКСТОВЫЕ ИНТЕРФЕЙСЫ - CLI • Интерфейс командной строки (CLI - Command line interface, CLI) • Инструкции компьютеру даются путём ввода с клавиатуры текстовых строк (команд) • Результат выполнения команд также представлен в текстовой форме 4 /6

ТЕКСТОВЫЕ ИНТЕРФЕЙСЫ - CUI • Текстовый пользовательский интерфейс (TUI - Text user interface или CUI - Character User Interface) • Разновидность интерфейса пользователя, использующая при вводе-выводе и представлении информации исключительно набор буквенно-цифровых символов и символов псевдографики. • Просто, но со вкусом 5 /6

ГРАФИЧЕСКИЕ ИНТЕРФЕЙСЫ - GUI • GUI - Graphical User Interface • В отличие от интерфейса командной строки, в GUI пользователь имеет произвольный доступ ко всем видимым элементам интерфейса и осуществляет непосредственное манипулирование ими • WIMP (Windows-Icons-Menus -Pointing device) – окна, значки, меню и указатели 6 /6

АППАРАТНЫЕ СРЕДСТВА • Изначально графический интерфейс немыслим без мыши или эквивалента (touchpad, trackball и т. п. ) • Современный интерфейс ориентирован на touch screen и поддерживает управление при помощи multi touch (то есть несколькими пальцами одновременно) 7 /6

ИНТЕЛЛЕКТУАЛЬНЫЕ ИНТЕРФЕЙСЫ • Интерфейсы, основанные на распознавании речи и образов (жестов, мимики) • SILK (Speech, Image, Language, Knowledge) – речь, изображение, язык, знание Реализации • Окей, Google! • Smart. TV от LG 8 /6

GUI – ОСНОВНЫЕ ЭЛЕМЕНТЫ • Окно – традиционно прямоугольная область экрана • Примитивы – базовые элементы интерфейса (виджеты) • Контейнеры – элементы интерфейса, содержащие в себе другие элементы • Сложные – элементы интерфейса, имеющие структуру 9 /6

БАЗОВЫЕ ВИДЖЕТЫ Name Название Тип данных Text Box, Edit Field Поле ввода Строка или текст Radio Button Переключатель Целое число Check Box Выключатель Логический List Box Список Целое число или логический массив Combo Box Выпадающий список Строка, целое число Checked List Box Список с выбором Логический массив Date Time Picker Выбор даты Дата и время Numeric Up Down Счетчик Целое число Rich Text Box Ввод форматированного текста RTF или эквивалент Track Bar Ползунок Целое число Button Кнопка Multistate Набор состояний ― Целое число 10 /6

ВСПОМОГАТЕЛЬНЫЕ ВИДЖЕТЫ Name Название Label Метка Icon Значок Tool Tip, Hint Всплывающая подсказка Scroll Bar Полоса прокрутки Progress Bar Индикатор выполнения Link Label Гиперссылка Picture Box Изображение 11 /6

КОНТЕЙНЕРЫ Name Название Panel Панель Group Box Группа Split Container Контейнер с разделителем Tab Control Набор закладок Status Bar Строка состояния Tool Bar Панель инструментов Ribbon Лента Menu Bar Меню Context Menu Контекстное меню 12 /6

СЛОЖНЫЕ ВИДЖЕТЫ Name Название Table Таблица Grid Сетка Tree View Дерево Trend График, тренд Chart Диаграмма Map Карта Gauge Индикатор 13 /6

ДОСТУПНЫЕ ДЕЙСТВИЯ • Задача: напечатать документ • Проблема: в меню нет команды печати, и непонятно, что делать вообще 14 /6

ДОСТУПНЫЕ ДЕЙСТВИЯ • Задача: напечатать документ • Проблема: в меню есть команда печати, но она отключена и непонятно, как ее включить 15 /6

ДОСТУПНЫЕ ДЕЙСТВИЯ • Задача: напечатать документ • Проблема: в меню есть команда печати, но возникает сообщение об ошибке 16 /6

ДОСТУПНЫЕ ДЕЙСТВИЯ • Задача: напечатать документ • Нам наконец-то объяснили, что оказывается (!) у нас не настроен принтер для печати 17 /6

ИНДИКАТОРЫ – ДОБРО И ЗЛО 18 /6

АНАЛИЗ ДАННЫХ (DRILL-DOWN)

ТРЕНД – ВРЕМЕННОЙ РЯД

МНЕМОСХЕМА ДИАГНОСТИКИ

АРМ СПТК АСТУ ФСК ЕЭС 22 /6

АРМ ПТК ССПТИ ФСК ЕЭС (РЗА) Векторные диаграммы токов и напряжений Структура ПС (включая измерительные устройства) Данные от разных устройств на разных ПС Графики измерений и дискретные сигналы 23 /6

АРМ ПТК ССПТИ ФСК ЕЭС (ЖУРНАЛ) 24 /6

АРМ ПТК ССПТИ ФСК ЕЭС (ПС) Список оборудования ПС Сигнализация Состояние системы охлаждения 25 /6

АРМ ПТК ССПТИ ФСК ЕЭС (ИТСИСС) Состояние серверов Оборудование ПТК ССПТИ Состояние сетевого оборудования Состояние ИБП 26 /6

ТРЕБОВАНИЯ • Требования к программному обеспечению — совокупность утверждений относительно атрибутов, свойств или качеств программной системы, подлежащей реализации • Требования к интерфейсу пользователя — совокупность утверждений относительно атрибутов, свойств или качеств интерфейса пользователя, подлежащей реализации 27 /6

КАЧЕСТВО ТРЕБОВАНИЙ Характеристика Описание Единичность Требование описывает одну и только одну вещь Завершённость Требование полностью определено в одном месте и вся необходимая информация присутствует Последовательность Требование не противоречит другим требованиям и другой документации Атомарность Требование не может быть разбито на ряд более детальных требований без потери завершённости Отслеживаемость Требование полностью или частично соответствует деловым нуждам как заявлено заинтересованными лицами и документировано Актуальность Требование не стало устаревшим с течением времени Выполнимость Требование может быть реализовано в пределах проекта. 28 /6

КАЧЕСТВО ТРЕБОВАНИЙ Характеристика Описание Недвусмысленность Требование кратко определено без обращения к техническому жаргону, акронимам и другим скрытым формулировкам. Оно выражает объективные факты, не субъективные мнения. Возможна одна и только одна интерпретация. Определение не содержит нечётких фраз. Использование отрицательных утверждений и составных утверждений запрещено Обязательность Требование представляет определённую заинтересованным лицом характеристику, отсутствие которой приведёт к неполноценности решения, которая не может быть проигнорирована. Необязательное требование — противоречие самому понятию требования Проверяемость Реализованность требования может быть определена через один из четырёх возможных методов: осмотр, демонстрация, тест или анализ 29 /6

ПРИМЕРЫ ТРЕБОВАНИЙ 1. Отчётные формы должны обеспечивать формирование данных за любой период: сутки, месяц, год и т. д. с начала работы системы в форме табличного отчета с различными итогами 2. Мнемосхемы должны обеспечивать: для оборудования - отображение основных параметров технологических систем и систем безопасности 3. Мнемосхемы должны обеспечивать: расчет необходимых параметров в режиме реального времени 4. Проект предусматривает разработку дополнительных форм и отчётов по запросу пользователей в объеме не более 10% от количества типовых форм 5. Пользовательский интерфейс должен быть удобным, эргономичным и быстрым 30 /6

СПЕЦИФИКАЦИЯ ЭКРАННОЙ ФОРМЫ 31 /6

БИБЛИОТЕКА СИМВОЛОВ • Для каждого элемента оборудования создается и документируется свой отдельный символ • Фиксируются размеры, форма, толщина линий… • Все цвета, используемые для сигнализации состояния, точно фиксируются (используется палитра RGB или иная, принятая в организации) 32 /6

ТРАДИЦИОННЫЕ МНЕМОСХЕМЫ 33 /6

СИТУАЦИОННАЯ ГРАФИКА 34 /6

СИТУАЦИОННОЕ ВОСПРИЯТИЕ 35 /6

СПАСИБО ЗА ВНИМАНИЕ! Банников Сергей Руководитель группы управления производством 111033, Москва, ул. Волочаевская, д. 5, к. 1 Т: (495) 974 2274 | Ф: (495) 974 2277 E-mail: croc@croc. ru