1 Проектирование пользовательских интерфейсов ИТ МГППУ 2009 г. Учебный курс Московский Городской Психолого-Педагогический университет Факультет «Информационных Технологий» Преподаватель: Алина Зотова Лекция 3: Этап концепции.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

18 Проектирование пользовательских интерфейсов ИТ МГППУ 2009 г. Наш основной учебный ресурс Адрес моей электронной почты

19 Проектирование пользовательских интерфейсов ИТ МГППУ 2009 г. Информационные источники Юзабилити в Википедии ( Один из самых первых информационных ресурсов, поддерживающий сообщество проектировщиков интерфейсов Usability.ru ( Русское отделение ACM SigCHI – RusCHI ( ) Тематический блог на habrahabr.ru ( ) Сообщество в ЖЖ: ru_ucdesign ( Блоги о дизайне интерфейсов: события, идеи, методы, обсуждения (Gui.ru и fresh.gui.ru) Неформальное профессиональное сообщество проектировщиков пользовательских интерфейсов ( ) Основные понятия: «Терминологические войны», Иван Дегтяренко ( )