Похожие презентации:
Эргономическая экспертиза. Эргономический консалтинг. Проектирование рабочих мест и пользовательских интерфейсов
1.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Дизайн – это разработка и создание формы и стиля какого-либо объекта.
Дизайн – разновидность художественно-проектной деятельности, сочетающей
принципы удобства, экономичности и красоты.
Дизайн — это творческий метод, процесс и результат художественно-технического
проектирования промышленных изделий, их комплексов и систем, ориентированного
на достижение наиболее полного соответствия создаваемых объектов и среды в
целом возможностям и потребностям человека, как утилитарным, так и
эстетическим.
Компьютерный дизайн – разработка и создание формы, а так же стиля объекта при
помощи электронных средств.
«В дизайне законов нет. Не было и не будет. Есть
рекомендации, советы, перечни пунктов житейского опыта…»
А. Лебедев
1
2.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Этапы работы дизайнера:
• поиск идеи;
«Дизайн всегда происходит от идеи. Таким образом, дизайн – это идея,
облаченная в форму. Идеи – мимолетны, и для того, чтобы мы могли ими
воспользоваться, им необходимо придать физическую форму. Успешный
дизайн – это тот, который сумел заключить в себе идею, его вдохновившую»
Эмануэль Дитрич
• выбор средств реализации;
• реализация.
2
3.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Поиск идеи
3
4.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Поиск идеи
«Наблюдай за всем, что происходит вокруг тебя, за каждым человеком, за каждым моментом
времени. И если вдруг заметишь хоть малейшую зацепку, немедленно начинай работать»
Карим Рашид
4
5.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Поиск идеи
Метод фокальных объектов
Алгоритм применения:
1. Выбирают «фокальный» объект.
2. Выбирают три-четыре случайных объекта, которые должны быть далеки друг от
друга по смыслу.
3. Составляют списки признаков «случайных» объектов. К признакам относятся
свойства, функции, параметры, какие-либо особенности отмеченные нашим
сознанием, ассоциации связанные с объектом.
4. Генерируют новые идеи путем присоединения к фокальному объекту признаков
случайных объектов.
5. Развивают полученные сочетания путем свободных ассоциаций до получения
конечного результата.
6. Оценка полученных решений и их отбор для последующего внедрения.
5
6.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Зрительное восприятие
Основные свойства:
1. Последовательность
2. Избирательность
3. Целостность
6
7.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Зрительное восприятие
Основные свойства:
4. Реакция на движение.
5. Запоминаемость.
6. Константность.
7
8.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Зрительное восприятие
Основные свойства:
7. Соотносительность.
8
9.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Зрительное восприятие
Основные свойства:
8. Иллюзорность.
Иллюзия стрелок Мюллера-Лиера
Иллюзия не параллельности
параллельных линий
Иллюзия сходящихся и расходящихся линий
Иллюзия изменения размера и кривизны
Иллюзия искажения прямого угла и окружности
9
10.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Перспектива – это изображение глубины трехмерного пространства в соответствии с
кажущимся изменением величины, очертаний, резкости контуров и детальности
предметов, которое обусловлено степенью отдаленности их от точки наблюдения.
Ракурс – это рисунок объекта в перспективе с сокращением удаленных от переднего
плана его частей.
Основные виды:
• линейная;
• панорамная;
• плафонная;
• театральная;
• рельефная;
• диорамная;
• архитектурная;
• стереоскопическая;
• воздушная перспектива;
• обратная перспектива.
10
11.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Линейная
11
12.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Основные ошибки
Линейная
12
13.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Панорамная
13
14.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Плафонная
14
15.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Плафонная
15
16.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Театральная
16
17.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Рельефная
Барельеф
17
18.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Рельефная
Рельеф
18
19.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Рельефная
Горельеф
19
20.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Диорамная
20
21.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Архитектурная
21
22.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Стереоскопическая
22
23.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Воздушная перспектива
23
24.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Перспектива
Обратная
24
25.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Тени
Построение теней
при солнечном освещении
Построение теней
при центральном освещении
Изображение собственной и падающей тени, блика, рефлекса.
25
26.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
?
26
27.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
27
28.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
простые, чистые,
яркие цвета
контрастные сочетания
ЧСС и
сильные, активные
раздражители
кровяное давление
сложные,
малонасыщенные
цвета;
ахроматические;
нюансные сочетания
успокаивают; вызывают сложные,
неоднозначные эмоции, нуждаются в
более длительном созерцании для их
восприятия, удовлетворяют потребность
в тонких и изысканных ощущениях
28
29.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Красный
29
30.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Оранжевый
30
31.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Желтый
31
32.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Зеленый
32
33.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Голубой
33
34.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Синий
34
35.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Фиолетовый
35
36.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Белый
36
37.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Психофизиологическое и психологическое воздействие цвета
на человека
Черный
37
38.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
Цветовые модели:
• RGB;
• CMYK.
38
39.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
Цветовые модели:
• LAB;
• HSB и HLS.
HSB
LAB
39
40.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
При использовании освещения необходимо помнить следующее:
• чем сильнее освещение, тем ярче и насыщеннее любой цвет;
• предмет одного цвета с освещением, становится ярче, усиливает свою
насыщенность;
• белый цвет окрашивается в оттенок цвета освещения;
• при удалении цвета несколько изменяются. Из-за толщи воздушного пространства
между наблюдателем и объектом, приобретают синеватый оттенок. С увеличением
расстояния светлые предметы несколько темнеют, темные наоборот смягчаются и
светлеют;
• при искусственном освещении цвета могут несколько изменяться.
40
41.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
По Гете
КФ
К
Круг Освальда
КО
Ф
О
СФ
ЖО
С
Цветовой круг
по Иоханнесу Иттену
Ж
СЗ
З
ЖЗ
Формула гармоничного соотношения размеров цветовых пятен:
Ж:К:С = 3:6:8
41
42.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
42
43.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Цвет
Некоторые виды цветового контраста:
• контраст по тону;
• контраст светлого и темного;
• контраст хроматических и ахроматических цветов;
• контраст холодного и теплого;
• контраст дополнительных цветов;
• контраст по насыщенности;
• контраст по площади цветовых пятен.
43
44.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Фронтальная – произведение строится в одной плоскости
44
45.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Объемная композиция используется при дизайне архитектурных объектов, упаковок и
различных объектов
45
46.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
В пространственной композиции преобладают размеры пространства в котором размещены
объекты
46
47.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифтовая композиция
47
48.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Инструменты
48
49.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Характеристики композиции
Форма
49
50.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Форма
Симметрия и асимметрия
50
51.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Характеристики композиции
Равновесие
Равновесие формы – состояние, при
котором все элементы сбалансированы
между собой
51
52.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Характеристики композиции
Равновесие
52
53.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Характеристики композиции
Равновесие
53
54.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Характеристики композиции
Равновесие
54
55.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Характеристики композиции
Равновесие
55
56.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Характеристики композиции
Равновесие
56
57.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Гармония и центр композиции
57
58.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Гармония и центр композиции
58
59.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Гармония и центр композиции
59
60.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Основные принципы построения композиции
Для передачи движения (динамики)
используются:
• диагональные линии;
• свободное пространство перед
движущимся объектом;
• момент кульминации движения.
60
61.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Основные принципы построения композиции
Условия для выражения покоя (статики):
• нет диагоналей;
• нет свободного пространства;
• статичные позы;
• симметрия, уравновешенность;
• вся композиция вписана в простую
геометрическую форму (треугольник, квадрат,
овал).
61
62.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Основные принципы построения композиции
62
63.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Основные принципы построения композиции
63
64.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Основные принципы построения композиции
64
65.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Характеристики шрифтов:
1. Гарнитура шрифта (Type family).
2. Начертание (Type face).
3. Насыщенность шрифта.
4. Пропорции шрифта.
5. Контрастность.
6. Кегель.
7. Комплектность (полиграфический
алфавит).
8. Тип (функциональные возможности).
Форматы шрифтов:
1. TrueType – шрифты векторные.
2. PostScript шрифты – масштабируемые векторные шрифты.
3. OpenType – первый кроссплатформенный формат шрифта.
65
66.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
=
?
66
67.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Univers
Bodoni
Garamond
67
68.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Заголовок
Девиз
Основной текст
адреса, телефоны, имена авторов
68
69.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Основные гарнитуры:
1. Академическая.
2. Балтика.
3. Журнальная.
4. Журнальная рубленая.
5. Кудряшевская энциклопедическая.
6. Гельветика.
7. Лазурского.
8. Таймс.
9. Школьная.
Варианты начертания:
• нормальное;
• курсивное;
• жирное;
• жирное курсивное.
69
70.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Межстрочный интервал и трекинг
70
71.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Печатная реклама должна:
• быть целостной, упорядоченной, не
содержать таких элементов или частей,
которые противоречили бы ее
функциональному назначению;
• система ее построения должна основываться
на взаимоотношении главных и
второстепенных элементов;
• быть броской и выделяться из ряда себе
подобных.
71
72.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Классификация художественных эффектов, применяемых к тексту
72
73.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Псевдотрехмерные эффекты, применяемые к тексту
73
74.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Шрифт
Советы:
• необходимо целесообразно располагать информационные блоки;
• строка должна не превышать 150-170мм;
• количество символов в строке 50-70;
• пустое пространство должно быть!!!;
• печатный материал должен быть систематизирован;
• необходимо акцентировать внимание на главном материале;
• учитывать индивидуальные особенности, характер каждого текстового материала;
• набор прописными читается на ≈12% медленнее прямого строчного начертания;
• основным наборным шрифтом являются не слишком светлые и средние по
жирности начертания;
• буквы должны быть черными и печататься по белой или кремовой бумаге;
• отрицательные эмоции требуют жирного шрифта с острыми краями, приятные
чувства передаются неформальными шрифтами светлых начертаний.
74
75.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Реклама
Эффективная реклама – это реклама, которая сразу же приковывает внимание
потребителя.
Правила:
1. Для того чтобы рекламу заметили, нужна идея:
• ахнул ли я от удивления, увидев, как она воплотилась?
• мне жаль, что это придумал не я?
• оригинальна ли сама идея?
• сможет ли она просуществовать лет тридцать?
2. Весьма важен текст рекламы, но еще важнее аргументация.
3. О появлении нового товара следует заявить во весь голос.
4. Потребителя всегда интересует цена.
5. Потребителю нужно раскрыть полезные качества товара.
6. Потребитель должен хорошенько запомнить название товара,
поэтому не бойтесь повторений.
7. Не преувеличивайте, захваливая товар.
8. Всегда выигрывает тот, кто постоянно нацелен на создание четкого
образа марки.
75
76.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Реклама
9. Не пользуйтесь шаблонами!
10. Научитесь правильно представлять товары различной аудитории.
11. Реклама не должна быть агрессивной - не следует путать рекламную кампанию
с войной.
12. Избегайте всего того, что "дурно пахнет".
13. Изучите то, что собираетесь рекламировать.
Маркетинговые исследования:
1. Определение конкурентоспособности товаров и услуг.
2. Выявление социального портрета покупателя, мотивов покупки.
3. Изучение конкурентов.
4. Определение спроса и предложения.
Товар
Бренд
76
77.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Композиция
Реклама
Товар
Бренд
Услуги
77
78.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Виды наружной рекламы:
1. Реклама на щитах (билбордах).
2. Реклама на установках
«prismavision».
3. Реклама на тумбах.
4. Реклама на городской мебели.
5. Реклама на опорах уличного
освещения.
6. Рекламные установки на зданиях.
7. Реклама на дисплеях.
8. Реклама на транспорте.
9. Реклама на мостах, путепроводах
и над проезжей частью.
10. «Неонка».
78
79.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на щитах (билбордах)
79
80.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на установках «prismavision»
80
81.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на тумбах
81
82.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на городской мебели
82
83.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на опорах уличного освещения
83
84.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Рекламные установки на зданиях
84
85.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на дисплеях
85
86.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на транспорте
86
87.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
Реклама на мостах, путепроводах и над проезжей частью
87
88.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Наружная реклама
«Неонка»
88
89.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
89
90.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Вначале думаем, потом делаем
От большего к меньшему,
от общего к частному
90
91.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Модульная сетка
91
92.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Масштабируемость
Шрифтовая схема
92
93.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Запас на рост сайта
93
94.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Реакция на пользователя
В зависимости от типа и масштабности
сайта, нужно показать ряд состояний
пункта навигации.
Типичный набор:
• нормальный вид;
• мы навели курсор;
• мы находимся в этом разделе;
• мы находимся в этом разделе, но
прошли глубже;
• мы навели курсор на пункт
родительского раздела.
Минимальный набор:
94
95.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Реакция на пользователя
Ссылки с дополнительными свойствами
Псевдо-ссылки
95
96.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Оформление содержания
96
97.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Принципы эффективного веб-дизайна.
Как мы думаем?
• мы ищем что-то интересное или полезное;
• мы ценим качество и доверие;
• мы не читаем, а сканируем;
• мы нетерпеливы по своей сути;
• мы не умеем выбирать оптимально.
97
98.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Принципы эффективного веб-дизайна
1.
2.
Не заставляйте пользователя думать.
Не испытывайте терпение пользователей.
98
99.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Принципы эффективного веб-дизайна
3.
4.
Управляйте пользовательским вниманием.
Добиваемся понятной композиции.
99
100.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Принципы эффективного веб-дизайна
5.
6.
Эффективное использование текста.
Стремление к простоте.
100
101.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Принципы эффективного веб-дизайна
7.
8.
Не бойтесь пробелов.
Эффективное общение с помощью «зрительного языка».
организация;
экономия;
коммуникация.
101
102.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Принципы эффективного веб-дизайна
9. Традиции наши друзья.
10. Начинаем тестировать на начальном этапе. Тестируем как можно чаще.
102
103.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
WEB-дизайн
Принципы эффективного веб-дизайна
Тестирование
103
104.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Юзабилити-тестирование
1. Экспертная оценка эргономических
показателей качества ПИ.
2. Оценка временных показателей.
Обобщенный алгоритм:
1.
2.
3.
4.
5.
6.
7.
8.
9.
Уточнение иерархии показателей эргономического качества ПИ.
Определение экспертов и оценка их квалификации.
Проведение опроса экспертов.
Анализ результатов работы экспертов.
Получение частных оценок значимости элементов.
Комплексирование мнений групп экспертов.
Определение значений элементов нижнего уровня.
Получение интегральной оценки эргономичности.
Анализ полученной информации и выработка рекомендаций.
104
105.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Компьютерный дизайн
Юзабилити-тестирование
Оценка временных показателей:
Разработка программы и методики проведения натурных экспериментов.
Разработка тестовых задач.
Формирование групп для тестирования.
Проведение тестирования.
Расчет «идеальных» временных
показателей.
6. Сравнение «идеальных» значений
показателей со значениями,
полученными в ходе эксперимента.
7. Выявление слабых мест ПИ,
влияющих на алгоритм деятельности
оператора.
8. Расчет интегральной оценки
эргономичности ПИ.
1.
2.
3.
4.
5.
105
106.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Проектирование ПИ
Методы оценки качества ПИ
Методы:
Параметры качества ПИ:
1. Аналитические методы.
2. Экспериментальные.
• на тренажерах;
• на реальных рабочих местах.
3. Анкетирования.
4. Экспертные.
время выполнения задачи;
число непроизвольных ошибок оператора;
коэффициент стандартизации ПИ;
объем вводимой оператором информации;
субъективная удовлетворенность
оператора.
Классификация ошибок:
1. По месту ошибки в структуре функционирования ЧМС.
2. По системам человека, на которые падает основная нагрузка
при выполнении операции.
3. По ошибкам поведения.
4. По причинам ошибок.
5. По следствиям ошибок.
6. По характеру нарушения правильности функционирования.
7. По средствам обнаружения ошибок.
8. По средствам предупреждения ошибок.
9. По отклонениям в действиях операторов.
106
107.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Проектирование ПИ
Методы оценки качества ПИ
1. Аналитические методы.
Метод GOMS (Goals, Operators, Methods, and Selection Rules – цели,
операторы, методы и правила их выбора)
Оператор
Время
K
0.28 сек
Описание
Нажатие клавиши. Время, необходимое для того, чтобы нажать клавишу.
T(n)
n*K сек
Последовательность нажатий клавиш. Время, необходимое для того,
чтобы нажать последовательно несколько клавиш.
P
1.1 сек
Указание. Время, необходимое пользователю для того, чтобы указать на
какую-то позицию на экране монитора.
B
0.1 сек
Нажать/отпустить кнопку мыши. Время, необходимое пользователю,
чтобы нажать или отпустить кнопку мыши
BB
0.2 сек
H
0.4 сек
Клик кнопкой мыши. Время, необходимое пользователю, чтобы сделать
один клик мышью.
Перемещение. Время, необходимое пользователю для того, чтобы
переместить руку с клавиатуры на ГУВ или с ГУВ на клавиатуру.
M
1.2 сек
Ментальная подготовка. Время, необходимое пользователю для того,
чтобы умственно подготовиться к следующему шагу.
W (t)
0,1 сек
Ответ. Время, в течение которого пользователь должен ожидать ответ
компьютера.
107
108.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Проектирование ПИ
Методы оценки качества ПИ
№
1
2
3
4
5
6
7
8
9
10
11
12
13
Сумма
Действие: запуск сканирования диска С в антивирусе Avast экспертом
Тип
Время
операции операции
Описание
H
0,4
Перемещение руку к манипулятору «Мышь».
M
1,2
Обдумывание.
Перевести указатель «Мыши» к разделу «Сканировать
P
1,1
компьютер» в меню.
BB
0,2
Клик «Мышкой».
M
1,2
Обдумывание.
Перевести указатель «Мыши» к разделу «Выберите папку для
P
1,1
сканирования», к кнопке «Пуск».
BB
0,2
Клик «Мышкой».
M
1,2
Обдумывание.
P
BB
M
P
BB
1,1
0,2
1,2
1,1
0,2
10,4
Переместить указатель мыши к чекбоксу «Локальный диск С».
Клик «Мышкой».
Обдумывание.
Переместить указатель мыши к кнопке «Ок».
Клик «Мышкой».
108
109.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Проектирование ПИ
Методы оценки качества ПИ
1. Аналитические методы.
Закон Фитса
D
1)
S
T – среднее время в мс, потраченное, чтобы закончить движение;
a – среднее время начала/конца движения; b – величина, зависящая от
типичной скорости работы;
D – дистанция от точки старта до центра объекта;
S – ширина объекта, измеренная вдоль траектории движения курсора.
T a b log 2 (
T a b log2 (n 1)
Закон Хика
T – среднее время выбора одной альтернативы в мс;
n – количество альтернатив, a и b – коэффициенты пропорциональности.
1
1)
p(i)
i
p(i) – вероятность выбора каждой из альтернатив.
T= p(i) log 2 (
109
110.
Эргономическая экспертизаЭргономический консалтинг
Проектирование рабочих мест и пользовательских интерфейсов
Проектирование ПИ
Подготовка и проведение юзабилити-тестирования
подбирайте сценарий так,
чтобы как можно больше
было протестировано
проблемных зон
110