Человеко-машинное взаимодействие (Human-Computer Interaction - HCI )

Содержание

Слайд 2

Рекомендуемая литература Раскин Д. Интерфейс: новые направления при проектировании компьютерных систем,

Рекомендуемая литература

Раскин Д. Интерфейс: новые направления при проектировании компьютерных систем, [Текст]:

пер. с англ., -СПб: Символ-Плюс, 2015, -272 с.
Алан Купер, Роберт Рейман, Дэвид Кронин, Кристофер Носсел / Интерфейс. Основы проектирования взаимодействия, [Текст]: -СПб: Питер, 2016, -720 с.
Элам, К. Графический дизайн. Принцип сетки = Grid Systems: Principles of Organazing Type (Desihn briefs) [Текст]:: пер. с англ./ К. Элам. –Санкт-Перербург: Питер, 2014, -120 с.
Круг С. Веб-дизайн: книга Стива Круга или «не заставляйте меня думать!» [Текст]: 2-е издание. – Пер. с англ. – СПб: Символ-Плюс, 2008. – 224 с.: цв. ил.
Лидвелл, У. Универсальные принципы дизайна [Текст]: пер. с англ./ У Лидвелл, К. Холден, Д. Батлер. -СПб: Питер, 2012, -272 с.
Мандел Т.: Разработка пользовательского интерфейса [Текст]: Пер. с англ. –М. : ДМК Пресс, 2001, - 416 с
www.nngroup.com/articles/ten-usability-heuristics ; www.nngroup.com/articles
Унгер, Р. UX-дизайн. Практическое руководство по проектированию опыта взаимодействия [Текст]: пер. с англ. / Р. Унгер, К. Чендлер. –СПб -М: Символ-Плюс, 2011, -336 с.
Дональд Норман "Дизайн обыденных вещей“ (Donald Norman, Design of everyday things).
http://hcibib.org/tcuid/chap-4.html , http://hcibib.org/tcuid/chap-5.html

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 3

Перечень предыдущих дисциплин, знания из которых будут использоваться: Основы программирования; Объектно-ориентированное

Перечень предыдущих дисциплин, знания из которых будут использоваться:

Основы программирования;
Объектно-ориентированное программирование.

эргономики;
искусственного

интеллекта;
когнитивной психологии;
дизайна;
программной инженерии.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Дисциплина Человеко-машинное взаимодей- ствие объединяет данные из многих областей знаний:

Слайд 4

Задачами курса являются: ознакомление с понятиями: интерфейс, качество интерфейса, модели, используемые

Задачами курса являются:

ознакомление с понятиями: интерфейс, качество интерфейса, модели, используемые при

проектировании интерфейса;
изучение основ процессов восприятия и обучения человека;
усвоение стандартов и принципов проектирования интерфейсов;
использование на практике основных методов тестирования и оценки качества программных интерфейсов;
получение представления о тенденциях развития человеко-машинных интерфейсов

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 5

Человеко-машинное взаимодействие (Human-Computer Interaction - HCI ) Лекция № 1 Основные

Человеко-машинное взаимодействие (Human-Computer Interaction - HCI )

Лекция № 1
Основные понятия
человеко-машинного

взаимодействия

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 6

Содержание Ознакомиться с понятиями, связанными с проектированием интерфейсов. План лекции Понятие

Содержание

Ознакомиться с понятиями, связанными с проектированием интерфейсов.

План лекции

Понятие

интерфейса. Разновидности интерфейсов. Стили интерфейса.
Критерии качества интерфейса.
Основные понятия теории моделирования:
система, модель, адекватность модели, моделирование.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 7

Новые термины Интерфейс. GUI, WUI, OOI, Gestural interface Система. Модель. Концептуальная

Новые термины

Интерфейс. GUI, WUI, OOI, Gestural interface
Система. Модель. Концептуальная модель

Перечень ссылок
Раскин

Д. Интерфейс: новые направления при проекти-ровании компьютерных систем, Пер с англ., - СПб: Символ-Плюс, 2015, с. 20-26.
Алан Купер, Роберт Рейман, Дэвид Кронин, Кристофер Носсел / Интерфейс. Основы проектирования взаимодействия, [Текст]: -СПб: Питер, 2016, 43-60 с.
6. Мандел Т.: Разработка пользовательского интерфейса Пер. с англ. –М. : ДМК Пресс, 2001, с. 35-55.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 8

Понятие интерфейса Интерфейс – это способ, путь, с помощью которого два

Понятие интерфейса

Интерфейс – это способ, путь, с помощью которого два

объекта, взаимодействуют между собой или воздействуют друг на друга.
(Мерная кружка. … Удобная мерная кружка)

Вопрос: «Каковы цели пользователя?» –
позволяет понять смысл деятельности для пользователя и таким образом создавать более уместные и качественные продукты.

Слайд 9

Разновидности интерфейсов Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Разновидности интерфейсов

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 10

Понятие интерфейса Применительно к компьютерным системам, слово интерфейс означает место, где

Понятие интерфейса

Применительно к компьютерным системам, слово интерфейс означает место, где одна

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

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 11

Понятие интерфейса В более широком смысле интерфейс включает в себя устройства

Понятие интерфейса
В более широком смысле интерфейс включает в себя устройства

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

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 12

Проектирование интерфейса Наиболее продуктивный путь проектирования оптимального интерфейса – его создание:

Проектирование интерфейса

Наиболее продуктивный путь проектирования оптимального интерфейса –
его создание:
с

учетом имеющегося опыта
и в соответствии с нуждами,
ожиданиями и пожеланиями
предполагаемого пользователя.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 13

Стили интерфейсов GUІ (Graphical User Interface); WUІ (Web User Interface); ООI

Стили интерфейсов

GUІ (Graphical User Interface);
WUІ (Web User Interface);
ООI (Object Oriented Interface);
Gestural

interfaces
Каждый из них имеет свои преимущества и особенности, которые влияют на выбор стиля интерфейса конкретного программного продукта (ПП).

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 14

GUІ (Graphіcal user interface) GUІ (Graphical User Interface) Его еще называют

GUІ (Graphіcal user interface)

GUІ (Graphical User Interface)
Его еще называют

WIMP-интерфейсом, так как в нем используются такие фундаментальные элементы: окна windows, иконки icons, меню menu и указатель мыши pointer;
Важнейшие свойства GUI-интерфейса: вся информация выводится в виде графики, осуществляется поддержка указателя мыши, главным объектом интерфейса является окно, внутри которого предусмотрены области для отображения доступных функций и размещения данных приложения.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 15

WUІ (Web User Interface) WUІ - используется для организации работы в

WUІ (Web User Interface)

WUІ - используется для организации работы в

Интернет.
Основные особенности WUI- стиля:
информация отображается, обычно, в одном GUI-окне (окне браузера);
браузер обеспечивает меню для Web-приложения;
поддержка указателя осуществляется в основном для однократного нажатия мыши, с помощью которого осуществляется переход по ссылкам;
технология drag-and-drop (перетащить и поместить ), в основном, не поддерживается.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 16

Object Oriented Interface (ООІ) Многие системы и объекты реального мира могут

Object Oriented Interface (ООІ)

Многие системы и объекты реального мира могут быть

отображены с использованием ООП подхода.
Так как такие объекты обладают свойствами: инкапсуляции (сокрытия в себе своих данных), наследования (возможности создания иерархической классификации родственных объектов) и полиморфизма (возможности применения одного о того же действия к разнотипным объектам).
Основные особенности ООІ:
широкая поддержка drаg-аnd-drop;
обеспечение возможности непосредственного ввода данных;
поддержка выдачи контекстно-зависимой информации.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 17

Gestural interfaces Управление устройствами жестами, которые совершаются в воздухе, часто не

Gestural interfaces

Управление устройствами жестами, которые совершаются в воздухе, часто не

касаясь поверхностей: хлопки, движения руками вверх / вниз, долгое нажатие(на смартфоне) и т.д.
Основные особенности такого стиля:
важность обратной связи;
понятность, возможность интуитивного определения, правильная концептуальная модель как надо пользоваться.
Примеры: Сушилки для рук, умывальники,
жесты выделения в смартфонах,
демонстрационные панели, skinput,…

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 18

Стили интерфейсов GUI и WUI преобладают в сфере персональных компьютеров; ООI

Стили интерфейсов

GUI и WUI преобладают в сфере персональных компьютеров;
ООI

получил распространение в смартфонах, i-box’ах и различных терминалах;
Смешанные интерфейсы;
Gestural interfaces – интерфейсы будущего.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 19

Критерии качества интерфейса Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Критерии качества интерфейса

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 20

Качество интерфейса Качество интерфейса оценивается по таким критериям: 1) насколько разработчики

Качество интерфейса


Качество интерфейса оценивается по таким критериям:
1) насколько разработчики понимают нужды(цели)

и задачи пользователей (User Experience);
Любая новая разработка (startup)– это «переработка» чего-то уже существующего для:
* расширения перечня предоставляемых функций, удаление болевых точек;
* расширения диапазона пользователей;
Важно: кто пользователи, чего они хотят достигнуть, используя продукт (устройство), какова их последовательность действий для выполнения задачи, болевые точки ( например: как поехать в отпуск и дать возможность соседям выгуливать собаку, но не оставлять ключи).
Как узнать: наблюдения, «сафари», интервью (2 видов), анализ продуктов-аналогов
2) насколько интерфейс может изменяться при взаимодействии с разными группами пользователей (калькулятор: обычный и для программиста; посетители магазина с велосипедами или детскими колясками, люди на инвалидных колясках – как открыть/закрыть дверь? ПО для внесения данных абит-в);
3) является ли этот продукт результатом тщательно продуманного проектирования ( результат качественного проектирования делает пользователей более эффективными.! Идеация, изучение пользователей, поиск их нужд, итеративное прототипирование интерфейса (от storyboard и бумажного прототипа до mockup), программирование интерфейса, тестирование (по эвристикам, когнитивный сквозной просмотр, A/B тестирование ,…);
(продолжение на следующем слайде)
Слайд 21

Качество интерфейса (продолжение) 4 Пригодность к изучению и использованию 4.1) наглядно

Качество интерфейса

(продолжение)
4 Пригодность к изучению и использованию
4.1) наглядно ли отображены все

особенности продукта (случай в фирме Ксерокс);
4.2) оказывает ли он содействие в упрощении концептуальной модели пользователя; (помощь должна оказываться ВСЕМ пользователям – у них могут быть разные вопросы -> следующий слайд).
Ответы: аффорданс, обратная связь, правильный выбор цвета, размер шрифта, группировка элементов, «легко читаемая» взаимосвязь объектов интерфейса за короткое время, удобное меню, поиск, фильтры, справка (обзорная, контекстная, функциональная…). ☺«Слышу-иду»
5) удовлетворяет ли использование этого продукта эстетические чувства пользователя (приятные цветовые сочетания, гармоничные пропорции элементов, уместная гарнитура шрифта, легкое восприятие подаваемых данных и идей. Например, сайты-визитки итальянских дизайнеров промышленных товаров: одежды, обуви, интерьеров,… ).

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 22

Проектирование интерфейса: пользователи разные Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Проектирование интерфейса: пользователи разные


Розробник: к.т.н., доц. каф. ПІ Мельнікова

Р.В., e-mail: roksana.melnikova@nure.ua
Слайд 23

Понимание нужд пользователей Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Понимание нужд пользователей

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 24

Основные понятия теории моделирования Система – это совокупность элементов, связанных в

Основные понятия теории моделирования

Система – это совокупность элементов, связанных в единое

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

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 25

Модель. Моделирование. Модель – объект-заменитель системы-оригинала, обеспечивающий изучение отдельных свойств системы.

Модель. Моделирование.

Модель – объект-заменитель системы-оригинала, обеспечивающий изучение отдельных свойств системы.
Назначение

модели – сделать обобщающие выводы о возможном поведении реальной системы.
Модель воссоздает описание системы с большими или меньшими упрощениями, которые зависят от намерений и средств исследования.
Моделирование - один из инструментов системного анализа (СА), главная цель какого создания сложных технических систем.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 26

Модель. Моделирование. Моделирование - представление объекта исследования его моделью и проведение

Модель. Моделирование.

Моделирование - представление объекта исследования его моделью и проведение

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

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 27

Проверка адекватности модели true Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Проверка адекватности модели

true

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 28

Концептуальная модель Математические модели делятся на: концептуальные, аналитические и имитационные. Концептуальная

Концептуальная модель

Математические модели делятся на: концептуальные, аналитические и имитационные.
Концептуальная модель

воссоздает описание системы в абстрактных терминах и понятиях, выделяя важные с точки зрения исследования причинно-следственные связи. Описывает те явления, которые должны происходить с системой.

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 29

Експрес-контроль знань Дайте визначення поняття інтерфейс. З чим пов’язаний той факт,

Експрес-контроль знань

Дайте визначення поняття інтерфейс.
З чим пов’язаний той факт, що існує

декілька видів стилів інтерфейсів ПП?
Чи були в Вашому житті випадки, коли Ваша концептуальна модель взаємодії з якимось об’єктом, системою або пристроєм була іншою, ніж у розробника (проектувальника), але на Ваш погляд такою, що могла покращити або спростити процес такої взаємодії? Якщо – так, наведіть приклади.
Наведіть приклади ПП з різними стилями інтерфейсів.
Як визначити якість інтерфейсу ПП?

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 30

Експрес-контроль знань Що таке модель? Що таке система? Яку мету переслідує

Експрес-контроль знань

Що таке модель?
Що таке система?
Яку мету переслідує моделювання?
Що таке

концептуальна модель?
Як перевірити адекватність моделі?
З якою метою використовується синтез в моделюванні?

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua

Слайд 31

Експрес-контроль знань Що таке модель? Що таке система? Яку мету переслідує

Експрес-контроль знань

Що таке модель?
Що таке система?
Яку мету переслідує моделювання?
Що таке

концептуальна модель?
Як перевірити адекватність моделі?
З якою метою використовується синтез в моделюванні?

Розробник: к.т.н., доц. каф. ПІ Мельнікова Р.В., e-mail: roksana.melnikova@nure.ua