Проектирование графических интерфейсов весна 2014...

47
Основы человекоориентированного проектирования Занятие 2

Upload: technopark

Post on 22-May-2015

240 views

Category:

Education


2 download

TRANSCRIPT

Page 1: Проектирование графических интерфейсов весна 2014 лекция 2

Основы человекоориентированного

проектирования

Занятие № 2

Page 2: Проектирование графических интерфейсов весна 2014 лекция 2

История

▪ Слово «юзабилити» - 1979 год«Экономический эффект юзабилити в интерактивных системах», Джон Беннет

�2

Page 3: Проектирование графических интерфейсов весна 2014 лекция 2

История

▪ Корни – в эргономике, в т.ч. военной

�3

Page 4: Проектирование графических интерфейсов весна 2014 лекция 2

История

▪ "...Так, например, резиновые перчатки для работ в промышленности, производившиеся по размерам 30-х годов, сразу же попадали на склад, поскольку не подходили большинству рабочих...."

�4

Page 5: Проектирование графических интерфейсов весна 2014 лекция 2

История

▪ ...Первыми среагировали на слова об эргономике в постановлении правительства СССР военные...K"

▪ Хотя «военная техника — не санаторий, а военный человек — солдат и перенесение тягот — его оплачиваемый крест»,K

▪ Но...Военная техника, созданная без учета антропометрических измерительных признаков, нередко создавала опасные ситуации при её использовании...

�5

Page 6: Проектирование графических интерфейсов весна 2014 лекция 2

История

ЦЕНА ОШИБКИK""

…сегодня в промышленно развитых странах техника, предназначенная для уничтожения людей, — самая совершенная с точки зрения учёта человеческих факторов...

�6

Мунипов, Зинченко. «Эргономика: человекоориентированное проектирование техники, программных средств и среды...»

Page 7: Проектирование графических интерфейсов весна 2014 лекция 2

Предмет дисциплины

Почемуименно

ПОдо сих пор остается неудобным

?�7

Page 8: Проектирование графических интерфейсов весна 2014 лекция 2

Предмет дисциплины

Почемуименно

ПОдо сих пор остается неудобным

?�8

Page 9: Проектирование графических интерфейсов весна 2014 лекция 2

Предмет дисциплины

▪ Изначально компьютер – инструмент ученого (= человека с хорошо развитыми навыками)K

▪ Ученые писали ПО для себяK▪ Сегодня ПО пишут все, нет лицензии и цензуры

�9

Page 10: Проектирование графических интерфейсов весна 2014 лекция 2

Предмет дисциплины

�10

Page 11: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Что измерять?K▪ Количество необходимых действийK▪ Сложность этих действий (% ошибок на пути к цели)K▪ Количество неудач (% достижений конечной цели)K▪ Скорость достижения целиK▪ Скорость обучения

�11

Page 12: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Сложность действий �12

Количество

необходимых действий Как правило

Page 13: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

▪ Количество действий - многоK▪ Возможный процент ошибок – многоK▪ Скорость достижения цели - низкая

�13

Page 14: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

▪ Количество действий - 1K▪ Возможный процент ошибок – 0K▪ Скорость достижения цели - ?K"""""""

Хороший ли это интерфейс?�14

Page 15: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Как измерятьK▪ Количество необходимых действий и Количество неудачK▪ считать

�15

Page 16: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Как измерятьK▪ Сложность действий:K▪ количество повторных попыток"▪ время на выполнение"▪ количество ошибок

�16

Page 17: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�17

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Как измерятьK▪ Скорость достижения цели:не абсолютная, а отклонение от плановой

Page 18: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�18

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Как измерятьK▪ Скорость обучения:время достижения устойчивого % ошибок

Page 19: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Лучше – это больше или меньше?

�19

Page 20: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Бухгалтерская программаK▪ Количество необходимых действий - ?K▪ Сложность этих действий - ?K▪ Скорость достижения цели - ?

�20

Page 21: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

ИграK▪ Количество необходимых действий - ?K▪ Сложность этих действий - ?K▪ Скорость достижения цели - ?

�21

Page 22: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Просмотр фильмаK▪ Количество необходимых действий - ?K▪ Сложность этих действий - ?K▪ Скорость достижения цели - ?

�22

Page 23: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

"

"

КОНТЕКСТ!

�23

Page 24: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Хороший интерфейс – эффективный интерфейсK

▪ Количество необходимых действийK▪ Сложность этих действий (% ошибок на пути к цели)K▪ Количество неудач (% достижений конечной цели)K▪ Скорость достижения целиK▪ Скорость обучения

�24

Page 25: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Хороший интерфейс – эффективный интерфейсK

"Военная эргономика:KБыстрое, удобное, понятное оружие бесполезно, если ты не попадаешь в цель.

�25

Page 26: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Кому должно стать лучше?KЧто русскому хорошо, то немцу смерть

�26

Page 27: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Хороший интерфейс с точки зрения работодателя

�27

Page 28: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Хороший интерфейс с точки зрения

работника

�28

Получить зарплату

Почитать новости

Попить кофе

Page 29: Проектирование графических интерфейсов весна 2014 лекция 2

Основные этапы проектирования

""

СЕМИНАРKМетодологии

проектирования ПО

�29

Page 30: Проектирование графических интерфейсов весна 2014 лекция 2

Основные этапы проектирования

�30

Эволюция проектирования

Page 31: Проектирование графических интерфейсов весна 2014 лекция 2

Основные этапы проектирования

�31

Триада задач разработки

Page 32: Проектирование графических интерфейсов весна 2014 лекция 2

Основные этапы проектирования

�32

Примеры реальных триад разработки

Page 33: Проектирование графических интерфейсов весна 2014 лекция 2

Основные этапы проектирования

�33

Page 34: Проектирование графических интерфейсов весна 2014 лекция 2

Основные этапы проектирования

�34

Сбор данных

Концептуальное проектирование"

Детальное проектирован

ие

Тестирование

Page 35: Проектирование графических интерфейсов весна 2014 лекция 2

Методы и измеряемые показатели

Преимущества продукта,который проектировали, а не просто писали:K

▪ Снижение затрат на разработку"▪ Снижение затрат на поддержку"▪ Высокий КПД пользователя"▪ Любовь и преданность пользователей

�35

Page 36: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�36

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Эвристики – более или менее универсальные принципы проектирования интерфейсов""http://www.nngroup.com/articles/ten-usability-heuristics/

Page 37: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�37

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Visibility of system statusKThe system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Page 38: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�38

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Match between system and the real worldK

The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

Page 39: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�39

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

User control and freedomKUsers often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.

Page 40: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�40

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Consistency and standardsKUsers should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.

Page 41: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�41

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Error preventionKEven better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

Page 42: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�42

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Recognition rather than recallKMinimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

Page 43: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�43

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Flexibility and efficiency of useK

Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

Page 44: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�44

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Aesthetic and minimalist designK

Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

Page 45: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�45

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Help users recognize, diagnose, and recover from errorsK

Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

Page 46: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�46

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Help and documentationKEven though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.

Page 47: Проектирование графических интерфейсов весна 2014 лекция 2

Эвристики

�47

Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

▪ Отображение статуса системыСистема всегда должна информировать пользователя о том, что происходит - давать обратную связь в реальном времени."

▪ Соответствие между системой и реальным миромСистема должна говорить с пользователем на понятном ему языке, понятными словами и фразами. Следите за тем, чтобы информация подавалась в логическом порядке."

▪ Свобода действий и контрольПри использовании функций системы пользователи часто совершают ошибки и нуждаются в «аварийном откате», чтобы избежать непоправимых изменений. Настройте функции отмены и повтора."

▪ Единообразие и стандартыОднажды поняв принцип работы интерфейса, пользователь должен быть уверен, что в будущем система будет работать по тем же алгоритмам. Всегда следуйте одним и тем же правилам внутри продукта."

▪ Профилактика ошибокЛучше всякого сообщения об ошибках будет тщательная работа по их предотвращению. Помните об этом в первую очередь."

▪ Наглядность и узнавание, а не запоминаниеДелайте объекты, опции и действия видимыми. Пользователь не должен запоминать информацию, переходя от одного объекта к другому. Инструкции по использованию системы должны быть видимыми или легкодоступными. "

▪ Гибкость и эффективность использованияФункции, не видимые новичкам, зачастую могут ускорить процесс взаимодействия опытных пользователей с сайтом. Упрощайте функции, которыми ваши клиенты пользуются чаще всего."

▪ Эстетика и минимализмТексты не должны содержать явно лишнюю или неактуальную информацию. Каждая относительно бесполезная информация конкурирует с полезной и делает ее менее заметной."

▪ Помогите пользователям распознавать, диагностировать и исправлять ошибкиСообщения об ошибках должны быть выражены простым языком (никакого кода), точно указывать на проблему и предлагать её решение."

▪ Помощь и документацияЛучше, если систему можно использовать, не прибегая к помощи документации, однако не стоит ей пренебрегать. Любую подобную информацию должно быть легко найти, она должна быстро выводить пользователя на искомый вопрос и состоять из малого количества шагов.