Передача информации визуальным способом. Психология цветовосприятия
Знание теории восприятия и особенностей теории зрения привело к созданию важных фундаментальных рекомендаций по использованию цвета. При правильном использовании цвета цвет может быть мощным инструментом. Цвет на 32% процента эффективнее для привлечения внимания и на 25% -- для вызова ответных действий читателя. Цвет является сильным фактором воздействия и помогает сделать наш интерфейс более дружелюбным, однако нельзя использовать много цвета, чтобы не получался "эффект Лас-Вегаса".
Область фона, представленная тёмными оттенками, смещёнными к красной части, кажется больше, а к голубой части -- меньше. Объекты экрана на голубом фоне или на фоне средней части спектра кажутся более яркими. Наибольший контраст между двумя областями экрана достигается в том случае, если один из них -- чёрный или близкий к любому краю спектра, а другой -- белый или взятый из середины спектра. Также следует учитывать некоторые комбинации цветов. Например, синий цвет на красном фоне будет неприятен. Голубой успокаивает, красный -- раздражает, жёлтый -- жизнерадостный, чёрный -- мрачный, способствует головной боли, но снижает число ошибок. При выборе цветовой палитры следует учитывать ряд дополнительных факторов. Т. к. цвет носит фактически субъективный характер. Целесообразно в рамках одного приложения использовать ограниченное количество цветов, причём предпочтение следует отдавать приглушённым, пастельным цветам.
Мерч -- автор широкоизвестных исследований в области психологии о спектрах света --- предлагает три рекомендации с т. з. физиологии: 1) избегайте насыщенного синего цвета для текста, тонкие линий и малые формы); 2) не используйте близкие цвета, различающиеся лишь вхождением синего; 3) старайтесь выделять края не только цветом, сочетайте противоположные цвета. Рекомендации с т. з. восприятия цветов: 1) не все цвета одинаково хорошо различимы; 2) не все цвета одинаково разборчивы и читаемы; 3) оттенки меняются в зависимости от фона; 4) цветовые различия плохо заметны. Рекомендации с т. з. познавательности: 1) не злоупотребляйте цветом; 2) надо учитывать, что цвет на экране и печатной копии различается; 3) группируйте элементы общим фоном; 4) цвета привлекают внимание; 5) тёплые и холодные цвета должны указывать на уровень действия.
Аарон Маркус (разработчик интерфейсов, консультант в области использования и применения цвета): 1) организация; 2) экономия; 3) выделение; 4) взаимодействие; 5) символизм; 6) коммуникация. Пять заповедей использования цвета: 1) используйте от 3 до 7 цветов; 2) применяйте цвета, расположенные в центре и на периферии, следующим образом: красный и зелёный -- в центре зрительного поля, синий -- для выделения границ экрана; 3) для элементов, принадлежащих к одной группе, назначайте один и тот же цвет; 4) для привлечения внимания пользуйтесь насыщенными цветами; 5) за счёт добавления цвета улучшайте восприятие информации.
Основной принцип использования цветов -- разрабатывайте интерфейс сначала в чёрно-белом варианте, а позже, при необходимости, добавляйте цвет.
К визуальным атрибутам отображаемой информации относятся: 1) расположение и размер отображаемых объектов; 2) общая цветовая палитра; 3) средства привлечения внимания пользователя. Проектирование и размещение данных на экране предполагает выполнение следующих действий: определение состава информации, которая должна появляться на экране; выбор формата представления информации; определение взаимного расположения данных или объектов на экране; выбор средств привлечения внимания пользователя; разработка макета размещения данных на экране; оценка эффективности размещения информации. Процесс проектирования будут продолжаться до тех пор, пока разработчик и потенциальный пользователь не будут удовлетворены.
Расположение элементов должно обеспечить возможность просмотра экрана в логической последовательности, возможность выбора нужной информации, возможность идентификации связанных групп, возможность определить, какие действия требуются от пользователя и требуются ли вообще для продолжения выполнения задания.
Существуют некоторые правила, регулирующие плотность расположения информации в пределах окна: оставить пустым приблизительно половину экрана/окна; оставить пустую строку после каждой пятой строки таблицы; оставлять четыре-пять пробелов между стобцами таблицы. Фрагменты текста должны располагаться на экране, чтобы взгляд пользователя мог сам перемещаться в нужном направлении. Содержимое полей не прижимать к краю экрана, а располагать около его горизонтальных или вертикальных осей. Меню, содержащее относительно небольшой объём информации, должно размещаться в левой верхней части экрана. Чтобы подчеркнуть симметрию, содержимое и расположение полей, относящихся к одной группе, должны выравниваться по вертикали. По возможности следует выравнивать все логически связанные группы полей.
Методы выделения информации
Выделение информации -- это использование специальных атрибутов, которые позволяют привлечь внимание пользователя к некоторой области экрана. В качестве подобных атрибутов можно использовать: применение различных шрифтов, цвет символов, цвет фона, уровень яркости, мерцание, межсимвольный интервал, подчёркивание, различные рамки или тени. Следует использовать минимально необходимое число атрибутов для привлечения внимания человека, чтобы не было перенасыщенности. Для объективной оценки плотности заполнения экрана, и др. показателей рекомендуется отделить содержание от фона. Для этого используется два метода. При применении метода прямоугольника после разбиения экрана каждый из прямоугольников заполняется текстом и отделяется от других пробелом. По центру экрана мысленно проводится ось, позволяющая оценить выравнивание. Метод выделения точек позволяет определить число и расположение элементов экрана, требующих повышения внимания ползователя. Каждая группа точек обозначается группой символов, отличающихся от пробела.
Для всех графических приложений справедливо следующее положение: все графические элементы создают единую графическую среду, поэтому основным этапом разработки является выбор концепции внешнего вида приложения. При использовании графического интерфейса каждый графический элемент и реализуемые им функции тесно взаимосвязаны. Исходя из визуального проектирования, должны быть решены вопросы: как эффективнее использовать пространство экрана, цветовая палитра, выбор адекватных форм представления объектов, композиция графических элементов, набор средств привлечения визуального внимания пользователя к изображённому на экране.
Композиция и организация
При проектировании визуальных элементов интефейса следует придерживаться принципов иерархии, визуального выделения наиболее важных элементов, сбалансированности структуры экрана, визуального выделения наиболее логически взаимосвязанных элементов, обеспечения удобочитаемости и логической согласованности отображаемой информации, использования единых подходов в визуализации информцаии (принцип интеграции). С т. з. работы пользователя, иерархическая огранизация информации определяет доступность данных и последовательность задач. Для успешной организации этого процесса нужно решить вопросы: какая информация для пользователя важная? что хочет сделать пользователь в первую очередь? что нужно для выполнения следующего шага? в каком виде подать информацию для удобочитаемости? как обеспечить интеграцию?
С целью обеспечения единого подхода к пространственному размещению информации введены единые единицы измерения: единица площади диалоговой панели (dialog base unit -- дискрета окна). Дискрета окна -- аппаратно независимая величина, в горизонтальном направлении она равна одной четверти средней величины символов текущего системного шрифта, по вертикали -- одной восьмой высоты. Рекомендуется оставлять между элементами расстояние в 3-4 дискреты, а до краёв окна -- не менее семи дискрет. Между элементами самой панели должно быть не менее четырёх дискрет высоты.
Основные кнопки управления
Кнопки "OK" и "Отменить" должны всегда располагаться рядом. Замыкать группу кнопок должна кнопка "Справка", если она поддерживается данным приложением. Если "OK" не используется, в конце лучше расположить "Отменить".
Выравнивание: горизонтальное, вертикальное, смежное. Информацию целесообразно по левому краю области, изменяемые числовые данные -- по правому.
Визуальные объекты
Рекомендации по разработке интерфейса окна
Асимметрия -- активное состояние, симметрия -- стабильное.
<...>
Элементы, не соответствующие шаблону, выделяются из общей массы.
<...>
Прототипирование пользовательского интерфейса
Одна из наиболее важных задач при разработке интерфейса -- прототипирование макета
Прототипирование -- процесс создания макета, черновой версии программы с целью проверки пригодности предлагаемых для применения концепций, а также представления программы заказчику на ранних стадиях процесса разработки. Прототип также позволяет получить обратную связь от будущих пользователей, причём тогда, когда это необходимо. Процесс создания прототипа обычно состоит из следующих шагов: 1) определение начальных требований; 2) построение прототипа, содержащего только интерфейс системы; 3) изучение прототипа заказчиком, получение обратной связи; 4) переработка и улучшение прототипа с учётом предложенных изменений; 5) GOTO 3. Все методы прототипирования основаны на двух основных типах: быстрое протипирование (разработчик делает макет, который на каком-то этапе будет остановлен -- подход скорости; очень важно, чтобы оно было выполнено в кратчайшие сроки; не обязательно выполнять в рамках той же платформы и технологии, в которых разрабатывается система).