Разработка пользовательского интерфейса для киосков с сенсорным экраном

Содержание

Слайд 2

I. Теория

I. Теория

Слайд 3

Примеры

Примеры

Слайд 4

Области применения

Спортивные мероприятия
Выставки и музеи
Банкоматы
Реклама
Продажа товаров и услуг
Кассовые аппараты
Ориентация на местности (в

Области применения Спортивные мероприятия Выставки и музеи Банкоматы Реклама Продажа товаров и
больших зданиях, путеводители по городу)
Транспорт: продажа билетов, справки
Игры и тотализаторы
Системы безопасности
Медицинское оборудование
Управление бытовой техникой

Слайд 5

Преимущества киосков

Максимально прямое взаимодействие человека с компьютером – без опосредующих устройств –

Преимущества киосков Максимально прямое взаимодействие человека с компьютером – без опосредующих устройств
мыши и клавиатуры
Не требуют обучения (если правильно спроектированы)
Не требуют дополнительного пространства рабочего стола

Слайд 6

Недостатки

Габариты пальца диктуют размеры элементов управления – они довольно велики
Последовательный ввод (один

Недостатки Габариты пальца диктуют размеры элементов управления – они довольно велики Последовательный
палец)
Обычно не используется обычная парадигма «выбор объекта – действие»
Трудности при исправлении ошибочного действия
Нельзя перетаскивать объекты (drag’n’drop)
Рука заслоняет экран при касании
Мышечная усталость при длительной работе

Слайд 7

Основные принципы дизайна

Не рассматривайте киоск в качестве компьютера, поскольку пользователь не будет

Основные принципы дизайна Не рассматривайте киоск в качестве компьютера, поскольку пользователь не
воспринимать его в качестве компьютера
У киоска нет опытных пользователей – все пользователи новички, в том числе не имеющие компьютерного опыта
Обеспечьте высокую скорость работы киоска
Обеспечьте помощь пользователю в максимально возможном объёме
Ограничьте число вариантов выбора на каждом шаге работы с киоском
Минимизируйте текстовый ввод (такой ввод – проблема при работе с киоском)

Слайд 8

Организация экрана

Всегда полноэкранный режим
Консистентность цветов и шрифтов
Фиксированные функциональные области (единообразие экранов):
отображение данных
ввод

Организация экрана Всегда полноэкранный режим Консистентность цветов и шрифтов Фиксированные функциональные области
данных
кнопки (особенно навигационные)
статус

EU 450/451 Screen Layout

Слайд 9

Элементы управления

Используются:
кнопки
???
Не используются:
курсоры
двойные касания (double click)
перетаскивание (drag’n’drop)
полосы прокрутки
выпадающие меню и списки
чекбоксы (кнопки

Элементы управления Используются: кнопки ??? Не используются: курсоры двойные касания (double click)
вместо них)
всплывающие диалоги
множественные окна

Слайд 10

Стратегии срабатывания кнопок

Land-on (first contact)
Lift-off (last contact) – Shneiderman & Co
Вариант с

Стратегии срабатывания кнопок Land-on (first contact) Lift-off (last contact) – Shneiderman &
использованием курсора
Чувствительная область может быть больше видимого размера кнопки

Слайд 11

Шрифты

Без засечек
Можно ограниченно использовать шрифты с засечками для того, чтобы отличить введённые

Шрифты Без засечек Можно ограниченно использовать шрифты с засечками для того, чтобы
пользователем данные от системных данных
Минимальный размер:
14 pt (Infopolis 2a)
16 pt (Maguire 1999)
Максимальный размер:
48 pt (Infopolis 2a)

Слайд 12

Размеры управляющих элементов и расстояние между ними

Минимальный размер:
15 мм (NUREG-0700)
16 мм (MIL-STD-1472F)
19

Размеры управляющих элементов и расстояние между ними Минимальный размер: 15 мм (NUREG-0700)
мм (Galitz 2002)
20 мм (Infopolis 2a)
Максимальный размер:
38 мм (MIL-STD-1472F)
40 мм (NUREG-0700)
Минимальное расстояние:
3 мм (Galitz 2002, NUREG-0700, MIL-STD-1472F)
Максимальное расстояние:
6 мм (NUREG-0700, MIL-STD-1472F)

Слайд 13

Время реакции

≤ 100 мсек (MIL-STD-1472F)
Индикация в виде часов или прогресс-бара для запросов,

Время реакции ≤ 100 мсек (MIL-STD-1472F) Индикация в виде часов или прогресс-бара
требующих длительного времени выполнения
Медленная реакция киоска провоцирует вандализм
Обратная связь в виде трёхмерных эффектов для кнопок и звуковое подтверждение касаний («кликов»)

Слайд 14

Графика

Привлекательный внешний вид
Яркие цвета и светлый текстурированный фон
Исследование предпочтений пользователей
Практические соображения
Стандартное экранное

Графика Привлекательный внешний вид Яркие цвета и светлый текстурированный фон Исследование предпочтений
разрешение для 17”-экранов: 1280 * 1024

Слайд 15

Первый экран

Цель: привлечь внимание пользователя и побудить его начать работу с киоском
Содержит

Первый экран Цель: привлечь внимание пользователя и побудить его начать работу с
приглашение начать работу
Анимация (например, демо-ролик по работе с киоском)
Звук (если не мешает)
Автоматический возврат, если нет активности пользователя

Слайд 16

Средства разработки

Средства разработки

Слайд 17

Физическая эргономика и факторы среды

Физическая эргономика и факторы среды

Слайд 18

II. Пример разработки: Киоск «Аэрофлота»

II. Пример разработки: Киоск «Аэрофлота»

Слайд 19

До дизайна

До дизайна

Слайд 20

Бумажный прототип

Бумажный прототип

Слайд 21

HTML-прототип

HTML-прототип

Слайд 22

Первый экран

Первый экран

Слайд 23

Пассажиры

Пассажиры

Слайд 24

Маршрут

Маршрут

Слайд 25

Календарь

Календарь

Слайд 26

Поиск рейсов

Поиск рейсов

Слайд 27

Варианты рейсов

Варианты рейсов

Слайд 28

Имя пассажира

Имя пассажира

Слайд 29

Завершение работы

Завершение работы

Слайд 30

III. Первоисточники

III. Первоисточники

Слайд 31

Стандарты и нормативы

[SAP] Waloszek G. (2000) Interaction Design Guide for Touchscreen Applications,

Стандарты и нормативы [SAP] Waloszek G. (2000) Interaction Design Guide for Touchscreen
SAP относиться с осторожностью
[Infopolis 2a] European Task Force INPUT & Infopolis 2 (2002) Design Guidelines for Information Kiosks in Travel Centres, Helsinki: Ministry of Transport and Communications
[NUREG-0700] O’Hara J. M., Brown W. S., Lewis P. M. & Persensky J. J. (2002) Human-System Interface Design Review Guidelines (NUREG-0700, Rev. 2), Washington: US Nuclear Regulatory Commission
[MIL-STD-1472F] Department of Defense (1999) Department of Defense Design Criteria Standard: Human Engineering (MIL-STD-1472F), Washington: Department of Defense

Слайд 32

Основная литература

[Maguire 1999] Maguire M. C. (1999) A review of user-interface design

Основная литература [Maguire 1999] Maguire M. C. (1999) A review of user-interface
guidelines for public information kiosk systems, International Journal of Human-Computer Studies, 50, 263-286
[Cooper 2003] Cooper A. & Reimann R. (2003) About Face 2.0, Indianapolis: Wiley Chapter 38: Designing for Embedded Systems
[Elo 2002] Elo TouchSystems (2002) Keys to a Successful Kiosk Application PowerPoint presentation
[Infopolis 2b] Meriaux A. (2000) Guidelines for information systems (Infopolis 2 Deliverable 2)

Слайд 33

Дополнительная литература

[Galitz 2002] Galitz W. O. (2002) The Essential Guide to User

Дополнительная литература [Galitz 2002] Galitz W. O. (2002) The Essential Guide to
Interface Design (2nd Ed.), New York: Wiley Step 6 – Select the Proper Device-Based Controls
[Coveney] Coveney R., Designing for Touch-Screen Kiosks (at infocentre.frontend.com)
[Lee 1997] Lee A. T. (1997) The Human Factors of Touch Input Devices (Technical Report BRI-TR-130997), Los Gatos: Beta Research
[Sears 1991] Sears A. & Shneiderman B. (1991) High precision touchscreens: Design strategies and comparisons with a mouse, International Journal of Man-Machine Studies, 34 (4), 593-613
Имя файла: Разработка-пользовательского-интерфейса-для-киосков-с-сенсорным-экраном.pptx
Количество просмотров: 168
Количество скачиваний: 0