'

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

Понравилась презентация – покажи это...





Слайд 0

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


Слайд 1

I. Теория


Слайд 2

Примеры


Слайд 3

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


Слайд 4

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


Слайд 5

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


Слайд 6

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


Слайд 7

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


Слайд 8

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


Слайд 9

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


Слайд 10

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


Слайд 11

Размеры управляющих элементов и расстояние между ними Минимальный размер: 15 мм (NUREG-0700) 16 мм (MIL-STD-1472F) 19 мм (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)


Слайд 12

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


Слайд 13

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


Слайд 14

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


Слайд 15

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


Слайд 16

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


Слайд 17

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


Слайд 18

До дизайна


Слайд 19

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


Слайд 20

HTML-прототип


Слайд 21

Первый экран


Слайд 22

Пассажиры


Слайд 23

Маршрут


Слайд 24

Календарь


Слайд 25

Поиск рейсов


Слайд 26

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


Слайд 27

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


Слайд 28

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


Слайд 29

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


Слайд 30

Стандарты и нормативы [SAP] Waloszek G. (2000) Interaction Design Guide for Touchscreen Applications, 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


Слайд 31

Основная литература [Maguire 1999] Maguire M. C. (1999) A review of user-interface design 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)


Слайд 32

Дополнительная литература [Galitz 2002] Galitz W. O. (2002) The Essential Guide to User 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


Слайд 33

Спасибо за внимание! Контакт: Иван Бурмистров ivan@psychology.ru Подборка первоисточников: sigchi.ru/Seminars/07/Kiosks.zip


×

HTML:





Ссылка: