'

Экранная эргономика и дизайн

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





Слайд 0

Экранная эргономика и дизайн Анна Викторовна Молокова, д-р. пед. наук, доцент, ведущий научный сотрудник НМЦ «Современные технологии», зав. кафедрой начального образования НИПКиПРО


Слайд 1

Это наука, изучающая функциональные возможности человека в трудовых процессах с целью создания для него оптимальных условий труда Что такое эргономика?


Слайд 2

Противоречие экранной эргономики: Подавление содержательных компонентов за счет внешних эффектов Полезность представления материала в игровой форме


Слайд 3

Контент Символьная информация Визуальный ряд Звуковой ряд Текст Числовые данные Реалисти ческий Синтези рованный Реалисти ческий Синтези рованный Статический Статический Динамический Динамический


Слайд 4

Эргономические требования к ЭУМ: удобство интерфейса (графическое представление меню, пиктограммы) удобство контекстно-зависимой помощи и всплывающих подсказок соответствие цветовых, тестовых, звуковых решений, информативной насыщенности возрастным особенностям учащихся


Слайд 5

Эргономические свойства интерфейса: яркость фона яркость изображений контрастность изображения наличие полиэкранных режимов ограничение максимального числа окон (7) и элементов в окне; расположение полей ввода/вывода в нижней части экрана


Слайд 6


Слайд 7


Слайд 8

Виды визуальных сред


Слайд 9

Гомогенная визуальная среда


Слайд 10

Агрессивная визуальная среда


Слайд 11

Комфортная визуальная среда


Слайд 12

Законы цветовосприятия Детали лучше воспринимаются в черном, белом и сером цвете Чем больше экран, тем больше различных цветов можно использовать Допустимо до 8-10 цветов Для быстрого обнаружения объекта по цвету – не более 4 цветов на экране


Слайд 13

Детализация


Слайд 14

Крупный план


Слайд 15

Избыточная цветовая гамма


Слайд 16

Оптимальная цветовая гамма


Слайд 17

Законы цветовосприятия Использование ненасыщенных цветов для фона Использование либо очень светлых, либо очень темных цветов для объектов Увеличение ширины линии Значительное увеличение или уменьшение доли серого в рисунке объекта


Слайд 18

Темный фон


Слайд 19

Светлый насыщенный фон


Слайд 20

Доля серого цвета в объекте


Слайд 21

Идентификация цвета объекта


Слайд 22

Идентификация границ цвета


Слайд 23

Ассоциации при использовании цвета Красный – предупреждение Желтый – привлечение внимания Зеленый – инициирование действия


Слайд 24

Тёплые цвета


Слайд 25

Холодные цвета


Слайд 26

Законы прагматики: учёт потребностей, возможностей и опыта пользователей уменьшение нагрузки на мышление постоянная информационная среда (язык запросов и команд, цвет ….)


Слайд 27

Законы семантики: предметная область в естественном виде (термины, знаки …) цветовой код – средство детальной структуры программы обратная связь о качестве работы пользователя


Слайд 28

Запрещения эргономики: комбинации красного цвета с зеленым и желтым, синего с желтым при различении цветового тона и моделей; синий цвет для малых объектов; красные буквы на синем фоне и наоборот


Слайд 29

Требования к тексту ограничение количества текста выравнивание слева заглавные буквы в заголовках без переносов страницы, а не скроллинг заголовки – элементы навигации списки и таблицы выделения (10%), подчеркивание, (? 3)


×

HTML:





Ссылка: