Скачать презентацию Какая вкладка активна 1 2 3 Скачать презентацию Какая вкладка активна 1 2 3

2lecture-1_analysis_concept.ppt

  • Количество слайдов: 76

Какая вкладка активна? 1 Какая вкладка активна? 1

2 2

3 3

? ? ? Интерфейс ? ? ? 4 ? ? ? Интерфейс ? ? ? 4

5 5

6 6

Московский Городской Психолого-Педагогический университет Факультет «Информационных Технологий» Учебный курс Проектирование пользовательских интерфейсов Преподаватель: Думин Московский Городской Психолого-Педагогический университет Факультет «Информационных Технологий» Учебный курс Проектирование пользовательских интерфейсов Преподаватель: Думин Павел Николаевич dumin. pn@gmail. com 7 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Содержание курса Понятие об ориентированном на пользователя дизайне компьютерных систем и Проектирование пользовательских интерфейсов Содержание курса Понятие об ориентированном на пользователя дизайне компьютерных систем и жизненном цикле разработки пользовательского интерфейса Процесс проектирования пользовательских интерфейсов Анализ деятельности пользователя Создание концепции пользовательского интерфейса Прототипирование Тестирование с пользователями 8 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов I Введение 9 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов I Введение 9 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Основные понятия Интерфейс пользователя – система правил и средств, регламентирующая и Проектирование пользовательских интерфейсов Основные понятия Интерфейс пользователя – система правил и средств, регламентирующая и обеспечивающая взаимодействие программы с пользователем. Дизайн-проектирование – это проектирование рентабельных продуктов, услуг и сред, соответствующих практическим, физическим и эмоциональным потребностям широкого круга людей (Kim Goodwin) Usability – «степень, с которой продукт может быть использован определёнными пользователями при определённом контексте использования для достижения определённых целей с должной эффективностью, продуктивностью и удовлетворённостью» . (ISO 9241 -11) При этом относительная важность всех трех аспектов определяется контекстом. 10 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Определяем контекст, пользователя, его цель и мотивы Контекст Мотивы Цель Пользователь Проектирование пользовательских интерфейсов Определяем контекст, пользователя, его цель и мотивы Контекст Мотивы Цель Пользователь 11 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Цель - ? Задача - ? 12 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов Цель - ? Задача - ? 12 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Цель - одна Осознанный образ предвосхищаемого результата (предмет стремления или желательное Проектирование пользовательских интерфейсов Цель - одна Осознанный образ предвосхищаемого результата (предмет стремления или желательное состояние). Выражается существительным. Задач - может быть несколько Действия, которые необходимо совершить для достижения цели. Выражаются глаголами. 13 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Критерии дружественности интерфейса Эффективность Продуктивность Удовлетворенность Безопасность 14 ИТ МГППУ 2009 Проектирование пользовательских интерфейсов Критерии дружественности интерфейса Эффективность Продуктивность Удовлетворенность Безопасность 14 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов 15 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов 15 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Подходы к проектированию Инженерно-технический подход Когнитивный подход Ориентированный на пользователя (User Проектирование пользовательских интерфейсов Подходы к проектированию Инженерно-технический подход Когнитивный подход Ориентированный на пользователя (User Centered) Деятельностный (Activity-Centered) Экспертный (Genius) Целе-ориентированный (Goal Centered Design) 16 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Инженерно-технический подход Суть технико-центрированного проектирования определяется следующими постулатами: 1) техника важнее Проектирование пользовательских интерфейсов Инженерно-технический подход Суть технико-центрированного проектирования определяется следующими постулатами: 1) техника важнее людей; 2) человек не имеет существенного значения в технических системах; 3) следует полагаться только на технику и инженеров; 4) следует предоставлять информационную технологию специалистам. (С) В. М. Мунипов, В. П. Зинченко. ЭРГОНОМИКА: человекоориентированное проектирование техники, программных средств и среды http: //psychlib. ru/mgppu/MZE-2001/MEC-001. HTM 17 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Инженерно-технический подход «Казалось бы очевидно, что все органы управления машиной должны Проектирование пользовательских интерфейсов Инженерно-технический подход «Казалось бы очевидно, что все органы управления машиной должны быть расположены в зоне досягаемости, чтобы работающий человек мог легко манипулировать ими, не меняя удобного для работы положения. Однако при проектировании это часто упускают из виду. Так, органы управления одного токарного станка, как установил У. Т. Синглтон, были трудно доступны для обычного мужчины и пригодны были лишь для "идеального" станочника ростом 1372 мм, с шириной плеч 610 мм и размахом рук 2348 мм» . (С) В. М. Мунипов, В. П. Зинченко. ЭРГОНОМИКА: человекоориентированное проектирование техники, программных средств и среды http: //psychlib. ru/mgppu/MZE-2001/MEC-001. HTM 18 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Когнитивный подход В его рамках предполагается, что основную роль в поведении Проектирование пользовательских интерфейсов Когнитивный подход В его рамках предполагается, что основную роль в поведении человека играют знания, или репрезентации объектов внешнего мира. Наиболее распространенным и классическим вариантом информационного подхода является символический подход, который понимает когнитивную систему человека как оперирование над дискретными элементами информации — символами. Более новым и пока менее распространенным направлением является коннекционизм, описывающий когнитивную систему в виде сети взаимосвязанных элементов. Информационный подход в психологии близко взаимодействует с исследованиями в области искусственного интеллекта и нейронауками. Словарная статья «Когнитивный подход (в психологии)» 19 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Доисторический период Обратная связь Неоновые лампочки Звук Телетайпы Дисплей: текст Дисплей: Проектирование пользовательских интерфейсов Доисторический период Обратная связь Неоновые лампочки Звук Телетайпы Дисплей: текст Дисплей: графика 20 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Появление персональных компьютеров q. Широкое распространение q. Доступное программное обеспечение q. Проектирование пользовательских интерфейсов Появление персональных компьютеров q. Широкое распространение q. Доступное программное обеспечение q. Неподготовленный пользователь q. Уметь должен каждый q. Учет пользовательских предпочтений q. Покупатель = пользователь 21 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Средства взаимодействия Пространство Время Движение Звук Внешний вид Текстура Вибрация Трение Проектирование пользовательских интерфейсов Средства взаимодействия Пространство Время Движение Звук Внешний вид Текстура Вибрация Трение 22 ИТ МГППУ 2009 г.

23 23

24 24

Проектирование пользовательских интерфейсов Мы проектируем взаимодействие человека с другими людьми и сообществами собой организацией Проектирование пользовательских интерфейсов Мы проектируем взаимодействие человека с другими людьми и сообществами собой организацией и с инструментом 25 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Процесс создания программного продукта Анализ бизнес-требований, выявление заинтересованных лиц и их Проектирование пользовательских интерфейсов Процесс создания программного продукта Анализ бизнес-требований, выявление заинтересованных лиц и их целей Проектирование программного продукта и его интерфейса Программная реализация продукта на основе проекта, графический дизайн, наполнение контентом Тестирование и пилотное внедрение Внедрение в эксплуатацию 26 ИТ МГППУ 2009 г.

Процесс проектирования интерфейса Анализ бизнес-процессов и деятельности пользователей Концепция Формализация информации в виде диаграмм Процесс проектирования интерфейса Анализ бизнес-процессов и деятельности пользователей Концепция Формализация информации в виде диаграмм бизнес-процессов и сценариев Выработка концепции Прототипирование интерфейса Уточнение прототипов Тестирование с пользователями Получение обратной связи от пользователей и ее анализ 27 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов II Этап анализа 28 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов II Этап анализа 28 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Этап анализа Отвечаем на вопросы Кто наш пользователь? Какие у него Проектирование пользовательских интерфейсов Этап анализа Отвечаем на вопросы Кто наш пользователь? Какие у него цели и задачи? В каком контексте он их достигает и решает? В рамках каких бизнес-процессов? Какие конкретные сценарии решения каждой задачи? 29 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов На выходе получаем Пользовательские профили (персоны) Сценарии использования Пользовательские требования 30 Проектирование пользовательских интерфейсов На выходе получаем Пользовательские профили (персоны) Сценарии использования Пользовательские требования 30 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Пользовательские профили Пользователи Составить профиль каждой группы: пол, возраст, профессия, особенности Проектирование пользовательских интерфейсов Пользовательские профили Пользователи Составить профиль каждой группы: пол, возраст, профессия, особенности характера, поведения, культурные особенности и проч. Цели и задачи Определить цель, составить перечень задач, которые выполняет каждая группа пользователей для достижения этой цели Контекст и среда Описать, в каких условиях каждая группа пользователей будет использовать интерфейс, какие ограничения на задают эти условия, на каком устройстве, как осуществляется ввод/вывод информации 31 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Целевая аудитория? Кто это? 32 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов Целевая аудитория? Кто это? 32 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов По каким формальным признакам можно понять, относится ли конкретный человек, встреченный Проектирование пользовательских интерфейсов По каким формальным признакам можно понять, относится ли конкретный человек, встреченный на улице, к целевой аудитории продукта или нет? ЦГ ЦГ Целевая аудитория ЦГ Множество всех людей Персонаж представляет Целевую Группу 33 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Этап анализа: методы сбора информации Интервью с владельцами проекта / потенциальными Проектирование пользовательских интерфейсов Этап анализа: методы сбора информации Интервью с владельцами проекта / потенциальными пользователями / другими заинтересованными лицами Полевые наблюдения Анкетирование Фокус-группы Экспертная оценка Юзабилити-тестирование Конкурентный анализ / анализ тенденций Анализ статистики … 34 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов 35 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов 35 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Цели исследования Создать базу для принятия решений, связанных с Интерфейсом Определить Проектирование пользовательских интерфейсов Цели исследования Создать базу для принятия решений, связанных с Интерфейсом Определить ориентировочный объем проекта Определить стратегические направления развития продукта/сервиса Выйти за рамки поставленной задачи Найти инновационные решения 36 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Интервью с владельцем Общие цели метода Выявление бизнес-целей и требований Выявление Проектирование пользовательских интерфейсов Интервью с владельцем Общие цели метода Выявление бизнес-целей и требований Выявление маркетинговых целей и требований Выявление технических целей и требований Осознание политической ситуации 37 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Интервью с пользователями Общие цели метода Выявление целей пользователей Фиксация задач Проектирование пользовательских интерфейсов Интервью с пользователями Общие цели метода Выявление целей пользователей Фиксация задач пользователей Выявление функциональных и нефункциональных требований Изучение предметной области 38 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Интервью с пользователями «+» «-» Метод дешевле полевых исследований Сложно зафиксировать Проектирование пользовательских интерфейсов Интервью с пользователями «+» «-» Метод дешевле полевых исследований Сложно зафиксировать нефункциональные требования Быстрое погружение в предметную область Недостаточная выборка для статистики Можно использовать удаленных респондентов Сложно зафиксировать рабочий процесс Возможность узнать что-то за рамками плана исследования Не все детали могут быть выявлены Потребность в оборудовании Косвенно можно выявить цели пользователей 39 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Полевые наблюдения Общие цели метода Выявление целей пользователей Фиксация задач пользователей Проектирование пользовательских интерфейсов Полевые наблюдения Общие цели метода Выявление целей пользователей Фиксация задач пользователей Выявление функциональных и нефункциональных требований Изучение предметной области 40 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Полевые наблюдения «+» «-» Самый точный способ сбора данных Сложность поиска Проектирование пользовательских интерфейсов Полевые наблюдения «+» «-» Самый точный способ сбора данных Сложность поиска респондентов Возможность узнать о контекстах использования Недостаточная выборка для статистики Возможность выявить паттерны коммуникации Сложность организации Возможность быть в роли ученика Дополнительные расходы на организацию и проведение Быстрое погружение в предметную область Низкая скорость проведения исследований Необходимость выезда к респонденту Потребность в оборудовании 41 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Составить вопросы для интервью 42 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов Составить вопросы для интервью 42 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Методы обработки информации Целевая аудитория Цели и задачи Контекст Персонажи Сценарии Проектирование пользовательских интерфейсов Методы обработки информации Целевая аудитория Цели и задачи Контекст Персонажи Сценарии Требования 43 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Персонажи 44 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов Персонажи 44 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Персонажи 45 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов Персонажи 45 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Персонажи: Первичный анализ Вопросы Кто наши пользователи? Сколько их? Что они Проектирование пользовательских интерфейсов Персонажи: Первичный анализ Вопросы Кто наши пользователи? Сколько их? Что они делают с системой? Методики Анализ рынка, интервью, наблюдения, ФГ Результат Отчет с общими характеристиками ЦА 46 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Персонажи: Построение гипотезы Вопросы В чем разница между пользователями? На какие Проектирование пользовательских интерфейсов Персонажи: Построение гипотезы Вопросы В чем разница между пользователями? На какие группы они разбиваются? Методики Выделение Целевых Групп Результат Черновое описание целевых групп 47 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Персонажи: метод шкал 1) Генерация переменных (10 -20) – важных для Проектирование пользовательских интерфейсов Персонажи: метод шкал 1) Генерация переменных (10 -20) – важных для ЦГ параметров при решении типичных задач в заданном контексте например, «активность» или «возраст» или «страсть к приключениям» 2) Одна переменная – одна шкала 3) Задать шкале размерность например, «много/средне/меньше среднего/мало 2 или « 1/3/5/7/9» 4) Разместить на каждой шкале показатель для каждой ЦГ Таким образом, на каждой шкале будет по точек – переменных каждой ЦА. несколько 48 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Персонажи: метод шкал 5) Проанализировать группу шкал с целью выявить схожие Проектирование пользовательских интерфейсов Персонажи: метод шкал 5) Проанализировать группу шкал с целью выявить схожие ЦГ, которые можно объединить в одну Схожие ЦГ будут иметь большинство переменных на близких другу позициях 6) Объединить схожие ЦГ. При необходимости, разбить одну ЦГ на несколько. Одну ЦГ стоит разбить на несколько, если проставлении переменных в команде возникали разногласия относительно определения позиций многих переменных 7) Получить оптимизированный список ЦГ (от 3 х до 5 ЦГ) например, «много/средне/меньше среднего/мало 2 или « 1/3/5/7/9» 8) Перейти к ранжированию персонажей Еще их называют персонами 49 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Персонажи: Выявление ключевых Вопросы Каков размер ЦГ, покрываемой персонажем? Эффект, приносимый Проектирование пользовательских интерфейсов Персонажи: Выявление ключевых Вопросы Каков размер ЦГ, покрываемой персонажем? Эффект, приносимый им? Его влияние? Чьи требования наиболее критичны? Методики Ранжирование, расстановка приоритетов Результат Ключевые персонажи (1 -3), другие группы, веса 50 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов 51 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов 51 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Полина: покупательница Цель Новая вечерняя блузка черного цвета меньше чем за Проектирование пользовательских интерфейсов Полина: покупательница Цель Новая вечерняя блузка черного цвета меньше чем за 50$ Задачи Узнать адрес магазина и как до него доехать Попросить таксиста отвезти ее в магазин по этому адресу Распознать знак валюты, в которой указана цена и получить примерную цену в $ Спросить у продавца, подойдет ли ей выбранная кофта , сколько она стоит и попросить померить 52 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов История использования (типичная ситуация) 1) История «как есть» Как эти люди Проектирование пользовательских интерфейсов История использования (типичная ситуация) 1) История «как есть» Как эти люди решают свои задачи сейчас? 2) Оптимизация 3) История «как будет» Как этим людям будет легче, приятнее и удобнее решать свои задачи с помощью вашего продукта? 53 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов История использования (типичная ситуация) Начальник вызвал Эдуарда и сообщил, что один Проектирование пользовательских интерфейсов История использования (типичная ситуация) Начальник вызвал Эдуарда и сообщил, что один их постоянный клиент хочет устроить корпоративный праздник через пару недель. Дал телефон контактного лица и отправил работать. У себя в кабинете Эдуард созвонился с контактным лицом, и за пол часа узнал, что компания хочет устроить тим-билдинг для улучшения взаимоотношений между сотрудниками, на 150 человек, событие планируется в середине недели, и люди должны иметь возможность быстро и легко добраться до дому. В процессе Эдуард успел позаниматься текущими делами, ответив на пару писем и пообщавшись с исполнителями по аське. Потом он поставил в КПК напоминалку о корпоративе и уехал мотаться по городу, решая другие свои задачи. После обеда, когда сработала напоминалка, он залез в Яндекс и, потратив пол часа, набросал список мест, в которые стоит позвонить. После чего снова занялся текущими разъездами. … 54 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов История использования (типичная ситуация) Начальник вызвал Эдуарда и сообщил, что один Проектирование пользовательских интерфейсов История использования (типичная ситуация) Начальник вызвал Эдуарда и сообщил, что один их постоянный клиент хочет устроить корпоративный праздник через пару недель. Дал телефон контактного лица и отправил работать. У себя в кабинете Эдуард созвонился с контактным лицом, и за пол часа узнал, что компания хочет устроить тим-билдинг для улучшения взаимоотношений между сотрудниками, на 150 человек, событие планируется в середине недели, и люди должны иметь возможность быстро и легко добраться до дому. В процессе Эдуард успел позаниматься текущими делами, ответив на пару писем и пообщавшись с исполнителями по аське. Потом он поставил в КПК напоминалку о корпоративе и уехал мотаться по городу, решая другие свои задачи. После обеда, когда сработала напоминалка, он залез в Яндекс и, потратив пол часа, набросал список мест, в которые стоит позвонить. После чего снова занялся текущими разъездами. … 55 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Сценарии Последовательность действий, которую совершает персонаж для решения своей задачи Сценариев Проектирование пользовательских интерфейсов Сценарии Последовательность действий, которую совершает персонаж для решения своей задачи Сценариев столько же, сколько задач, или больше, а еще они могут ветвиться 56 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов У сценария есть Предусловия Код Область действий Действия Название задачи Входы Проектирование пользовательских интерфейсов У сценария есть Предусловия Код Область действий Действия Название задачи Входы в сценарий Связи Выходы из сценария 57 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов III Этап концепции 58 ИТ МГППУ 2009 г. Проектирование пользовательских интерфейсов III Этап концепции 58 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Что такое концепция? Конце пция, или конце пт, (от лат. conceptio Проектирование пользовательских интерфейсов Что такое концепция? Конце пция, или конце пт, (от лат. conceptio — понимание, система) — определённый способ понимания (трактовки) какого-либо предмета, явления или процесса; основная точка зрения на предмет; руководящая идея для их систематического освещения. Употребляется также для обозначения ведущего замысла, конструктивного принципа в научной, художественной, технической, политической и других видах деятельности. 59 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Цели концепции Обеспечить взаимодействие сторон Показать результаты как можно раньше Вовлечь Проектирование пользовательских интерфейсов Цели концепции Обеспечить взаимодействие сторон Показать результаты как можно раньше Вовлечь заказчика в процесс проектирования Проверить реализуемость концепции Озвучить ценные идеи Наметить план проектирования 60 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Что на входе? q Персонажи q Список требований q Сценарии q Проектирование пользовательских интерфейсов Что на входе? q Персонажи q Список требований q Сценарии q Артефакты (объекты) q Результаты сбора данных Что на выходе? q. Информационная архитектура q. Архитектура взаимодействия q. Система навигации q. Компоновка ключевых экранов q. Концепция контента q. Концепция предметной области q. План работ по детальному проектированию 61 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Создание концепции 1. Оптимизировать сценарии Можно ли выполнить задачу быстрее/с меньшими Проектирование пользовательских интерфейсов Создание концепции 1. Оптимизировать сценарии Можно ли выполнить задачу быстрее/с меньшими затратами/сократить количество шагов/ автоматизировать какие-л. действия? 2. Сгенерировать требования по сценариям 3. Выделить артефакты (сущности, которыми оперирует персонаж) q из описания персонажей q из историй использования продукта q из сценариев 62 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Требования Функциональные (какие функции система должна предоставлять каждому персонажу) Нефункциональные (как Проектирование пользовательских интерфейсов Требования Функциональные (какие функции система должна предоставлять каждому персонажу) Нефункциональные (как именно эти функции должны работать) То есть, зафиксировать, что можно делать в системе, и как это должно быть устроено. А потом оценить важность каждого требования для каждого персонажа. 63 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Фиксация требований Вопросы Что требуется пользователям? Насколько важно конкретному персонажу? Все Проектирование пользовательских интерфейсов Фиксация требований Вопросы Что требуется пользователям? Насколько важно конкретному персонажу? Все равно? Мешает? Методики Уточнение требований, присваивание весов Результат Таблица требований 64 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Вес требований для каждого персонажа Персонажи: Требование Пенсионеры Тусовщик Семья Набор Проектирование пользовательских интерфейсов Вес требований для каждого персонажа Персонажи: Требование Пенсионеры Тусовщик Семья Набор типичных фраз 2 2 2 Реализовать текстовые, голосовые и фотографические подсказки при сопровождении по маршруту; 2 2 2 Локация типа Home должна иметь особый статус и быстро вызываться в качестве конечного пути маршрута. 2 2 2 Каталог экстремальных ситуаций (что делать в экстремальных случаях) 2 2 2 Список телефонов экстренных служб 2 2 2 Оценка необходимости требования 2 - важное требование 1 - желательное 0 - нейтральное -1 - отрицательное 65 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Фиксация артефактов Вопросы Какие объекты фигурируют в требованиях? В сценариях решения Проектирование пользовательских интерфейсов Фиксация артефактов Вопросы Какие объекты фигурируют в требованиях? В сценариях решения задач? Какие объекты использует персонаж при решении своих задач? Метод Последовательный проход по сценариям и требованиям Результат Таблица артефактов 66 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Создание концепции 4. Выделить основные типы экранов (ключевые) Если это сайт, Проектирование пользовательских интерфейсов Создание концепции 4. Выделить основные типы экранов (ключевые) Если это сайт, то, например, главная страница, страница с тестом, страница со статьей, и т. д. 5. Создать модель навигации по типам экранов Как пользователь, решая свои задачи, будет взаимодействовать с объектами, в какой последовательности? 67 ИТ МГППУ 2009 г.

68 ИТ МГППУ 2009 г. 68 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Создание концепции 6. Определить паттерны в интерфейсе Паттерн – фрагмент интерфейса, Проектирование пользовательских интерфейсов Создание концепции 6. Определить паттерны в интерфейсе Паттерн – фрагмент интерфейса, который будет использоваться на нескольких ключевых экранах. Например, вертикальное меню или интерфейс закачки файлов. 69 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Создание концепции 7. Описать модель потоков данных Какая информация, откуда и Проектирование пользовательских интерфейсов Создание концепции 7. Описать модель потоков данных Какая информация, откуда и как возникает. С какого на какой экран переходит (в соответствии со сценариями). 8. Определить требования к содержанию Какая информация будет находится на каждом типе страниц, какой формат (текст, картинка, видео, т. д. ), как она должна быть оформлена 70 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Создание концепции 9. Создание компоновочных макетов ключевых экранов Какие информационные блоки Проектирование пользовательских интерфейсов Создание концепции 9. Создание компоновочных макетов ключевых экранов Какие информационные блоки будет содержать каждый тип экрана, как они будут расположены? 10. Проверить модель навигации и поправить в случае необходимости используя метод прохода по сценариям 71 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Создание концепции 11. Проверить соответствие компоновочных макетов сценариям Для каждого персонажа Проектирование пользовательских интерфейсов Создание концепции 11. Проверить соответствие компоновочных макетов сценариям Для каждого персонажа пройтись по всем сценариям и проверить соответствие навигационной модели и компоновочных макетов сценариям. 72 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Наш основной учебный ресурс http: //ergogames. pbworks. com/ Адрес моей электронной Проектирование пользовательских интерфейсов Наш основной учебный ресурс http: //ergogames. pbworks. com/ Адрес моей электронной почты allileja@gmail. com 73 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Стандарты и руководства IBM (представление интерфейса, согласованность, состав компонент, принципы проектирования) Проектирование пользовательских интерфейсов Стандарты и руководства IBM (представление интерфейса, согласованность, состав компонент, принципы проектирования) ISO 14915 регламентирует мультимедийный интерфейс ISO 9241 требования по эргономике к офисной работе с визуальными дисплейными терминалами ISO 13407 описание процесса проектирования, ориентированного на пользователя Windows User Experience Interaction http: //msdn. microsoft. com/enus/library/aa 511258. aspx Apple Human Interface Guidelines http: //developer. apple. com/mac/library/documentation/User. Experience /Conceptual/Apple. HIGuidelines/XHIGIntro. html 2007 Microsoft Office System User Interface Design Guidelines 74 ИТ МГППУ 2009 г.

Проектирование пользовательских интерфейсов Информационные источники Юзабилити в Википедии (http: //ru. wikipedia. org/wiki/Usability) Один из Проектирование пользовательских интерфейсов Информационные источники Юзабилити в Википедии (http: //ru. wikipedia. org/wiki/Usability) Один из самых первых информационных ресурсов, поддерживающий сообщество проектировщиков интерфейсов Usability. ru (http: //www. usability. ru/glossary. htm#UI) Русское отделение ACM Sig. CHI – Rus. CHI (http: //ruschi. ru/index_ru. htm ) Тематический блог на habrahabr. ru (http: //habrahabr. ru/blogs/ui_design_and_usability/ ) Сообщество в ЖЖ: ru_ucdesign (http: //livejournal. com/community/ru_ucdesign/) Блоги о дизайне интерфейсов: события, идеи, методы, обсуждения (Gui. ru и fresh. gui. ru) Неформальное профессиональное сообщество проектировщиков пользовательских интерфейсов (http: //friendfeed. com/ruschi ) Основные понятия: «Терминологические войны» , Иван Дегтяренко (http: //www. gui. ru/ivan/terminilogy_wars_1) 75 ИТ МГППУ 2009 г.

http: //pinktentacle. com/2010/06/surrealistic-paintings-by-tetsuya-ishida/ 76 http: //pinktentacle. com/2010/06/surrealistic-paintings-by-tetsuya-ishida/ 76