Использование визуальных свойств для группировки элементов и создания четкой иерархии

Обычно, имеет смысл группировать логические наборы многофункциональных либо информационных частей средством зрительных параметров, к примеру цвета либо пространственных черт. Поочередно применяя эти зрительные характеристики в интерфейсе, вы сможете создавать шаблонные образы, которые ваши юзеры стремительно научатся распознавать. Согласно инструкциям по проектированию дизайна андроид-приложений, обыденные кнопки должны быть выпуклыми Использование визуальных свойств для группировки элементов и создания четкой иерархии, со скругленными углами, а текстовые поля прямоугольные, обычно подчеркнутые и плоские, при всем этом активные элементы выделяются цветом (см. рис. 3.4). Благодаря периодическому применению этого вида нереально спутать кнопку и поле ввода, невзирая на некие сходства.

Смотря на хоть какой набор зрительных частей, юзер безотчетно задается вопросом: "Что тут представляет энтузиазм?" – и Использование визуальных свойств для группировки элементов и создания четкой иерархии практически сразу: "Какая связь меж этими объектами?" Мы должны стремиться к тому, чтоб интерфейс содержал внутри себя ответ на оба вопроса.


Рис. 3.4.Визуализация кнопок и текстовых полей ввода в Android

При разработке иерархии нужно найти, исходя из сценариев, какие многофункциональные и информационные элементы должны восприниматься юзерами слету, какие являются вторичными Использование визуальных свойств для группировки элементов и создания четкой иерархии, а какие необходимы только в исключительных ситуациях. Такое ранжирование и служит основой для зрительной иерархии.

Чтоб сделать видимые различия меж уровнями иерархии, используйте цвет, насыщенность, контрастность, размер и положение. Важнейшие элементы должны быть более большими, более ярчайших цветов, более насыщенными и поболее контрастными. Их следует располагать над Использование визуальных свойств для группировки элементов и создания четкой иерархии иными элементами либо делать выступающими. Наименее принципиальные элементы должны быть наименее насыщенными, наименее контрастны ми, более маленькими и плоскими. Нейтральные светлые цвета уводят их на 2-ой план.

Очевидно, настройку этих параметров следует делать осторожно. Не следует делать важнейший элемент большущим, красноватым и выпуклым. Нередко бывает довольно поменять только одно из Использование визуальных свойств для группировки элементов и создания четкой иерархии параметров. Если обнаружится, что два элемента различной значимости состязаются за внимание юзера, сделать наименее принципиальный наименее приметным будет наилучшим решением.

Создание точной зрительной иерархии – одна из сложнейших задач в зрительном дизайне интерфейсов, ее решение просит способностей и таланта. Доброкачественную визуальную иерархию юзеры фактически не замечают – а вот ее Использование визуальных свойств для группировки элементов и создания четкой иерархии отсутствие и проистекающая из этого неурядица сходу оказываются на виду.

Чтоб передать связь частей, вновь обратитесь к сценариям. Нужно найти не только лишь элементы со схожими функциями, да и элементы, более нередко применяемые вместе. Вместе применяемые элементы обычно следует сгруппировать в пространстве (поместить на отдельный экран), чтоб минимизировать перемещения меж ними Использование визуальных свойств для группировки элементов и создания четкой иерархии.

Пространственная группировка разъясняет юзерам, каким образом одни задачки, данные и инструменты связаны с другими, и может намекать на правильную последовательность действий. Не плохая группировка средством расположения воспринимает во внимание порядок задач и подзадач и движение взора по экрану.

Элементы, расположенные рядом, обычно, связаны вместе. Если нужно сделать группировку Использование визуальных свойств для группировки элементов и создания четкой иерархии, комфортно реализовывать ее средством расстояний. Элементы, разбитые большенными расстояниями, можно группировать средством общих зрительных параметров.

Определившись с группами и зрительными особенностями этих групп, начинайте подстраивать контраст меж группами – подчеркивая либо, напротив, затеняя группы сообразно их значимости в текущем контексте.

Есть неплохой метод убедиться, что зрительный дизайн отлично использует иерархию Использование визуальных свойств для группировки элементов и создания четкой иерархии и дела, – дизайнеры именуют этот прием тестом с прищуриванием (squinttest). Закройте один глаз и поглядите на экран прищуренным вторым глазом. Направьте внимание на то, какие элементы очень выпирают, какие стали нечеткими, а какие слились в группы. Эта процедура нередко вскрывает не увиденные ранее задачи в композиции интерфейса.

Зрительная структура и Использование визуальных свойств для группировки элементов и создания четкой иерархии логические маршруты

Интерфейсы комфортно представлять для себя состоящими из зрительных и интерактивных частей, объединяемых в группы при помощи панелей, которые, в свою очередь, можно группировать в экраны. Такая группировка может проводиться средством рассредотачивания в пространстве либо с помощью общих зрительных параметров. Очень принципиально сохранять прозрачную визуальную структуру, чтоб Использование визуальных свойств для группировки элементов и создания четкой иерархии юзер мог просто перебегать от одной части интерфейса к другой в согласовании со своим рабочим процессом.

Опишем ряд принципиальных параметров, помогающих задать четкую визуальную структуру.

Выравнивание

Выравнивание зрительных частей – один из основных приемов, позволяющих дизайнеру представить продукт юзерам в систематизированном и упорядоченном виде. Сгруппированные элементы следует сглаживать как по горизонтали, так и Использование визуальных свойств для группировки элементов и создания четкой иерархии по вертикали ( рис. 3.5).

В общем случае каждый элемент на дисплее следует выровнять по очень вероятному числу других частей. Отказ от выравнивания 2-ух частей либо 2-ух групп частей должен быть осознанным: это допустимо только для заслуги определенного разделяющего эффекта. В числе остального дизайнерам следует уделять свое внимание на:

Выравнивание подписей Использование визуальных свойств для группировки элементов и создания четкой иерархии. Подписи для частей управления, расположенные друг над другом, должны быть выровнены по общей границе.

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

Выравнивание частей, разнесенных по группам и панелям. Группы частей управления и остальные объекты на дисплее всюду Использование визуальных свойств для группировки элементов и создания четкой иерархии, где это может быть, должны быть привязаны всё к той же сетке.


Рис. 3.5.Приложение uTorrent отлично употребляет выравнивание по композиционной сетке. Текст и многофункциональные элементы верно выравниваются по сетке с фиксированным шагом.

Сетка

Сетка – один из самых массивных инструментов зрительного дизайнера. Сетка обеспечивает однородность и последовательность структуры композиции. После того как проектировщики Использование визуальных свойств для группировки элементов и создания четкой иерархии взаимодействия обусловили общую инфраструктуру приложения и частей его пользовательского интерфейса, дизайнеры интерфейса должны организовать композицию в структуру в виде сетки, которая будет подабающим образом подчеркивать принципиальные элементы и структуры и оставлять актуальное место для наименее принципиальных частей и частей более малого уровня.

Обычно, сетка разделяет экран Использование визуальных свойств для группировки элементов и создания четкой иерархии на несколько больших горизонтальных и вертикальных областей. Отменно спроектированная сетка использует понятие шага, другими словами малого расстояния меж элементами. Например, если шаг сетки составляет четыре пиксела, все расстояния меж элементами и группами должны быть кратны четырем.

В безупречном случае сетка должна задавать и пропорции разных областей экрана. Такие дела Использование визуальных свойств для группировки элементов и создания четкой иерархии обычно выражаются дробями. Посреди всераспространенных дробей – прославленное "золотое сечение" (равное приблизительно 1,62), которое нередко встречается в природе и считается в особенности приятным для людского глаза; величина, оборотная квадратному корню из 2-ух (приблизительно 1:1,41), которая является основой интернационального эталона размера бумаги (к примеру, листа A4). В программировании для мобильных устройств не следует полагаться на Использование визуальных свойств для группировки элементов и создания четкой иерархии соотношение сторон мониторов, потому что для устройств на Android не существует одного эталона размера экранов.

Внедрение сетки в зрительном дизайне интерфейсов дает ряд преимуществ:

Удобство внедрения. Так как сетка делает размещение частей единообразным, юзеры стремительно получают способности поиска подходящих частей в интерфейсе. Последовательность в расположении частей и выборе расстояний меж Использование визуальных свойств для группировки элементов и создания четкой иерархии ними упрощает работу устройств зрительной обработки в мозгу человека. Отменно спроектированная сетка упрощает восприятие экрана.

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

Эффективность. Создание сетки и включение ее Использование визуальных свойств для группировки элементов и создания четкой иерархии в процесс на ранешних шагах детализации проектных решений уменьшает число итераций и действий по "доводке" интерфейса. Высококачественная и очевидно обозначенная сетка закладывает базу для просто модифицируемого и расширяемого дизайна, позволяя разработчикам отыскивать отличные композиционные решения.

Логические маршруты

Композиция должна не только лишь в точности следовать сетке, да и структурировать Использование визуальных свойств для группировки элементов и создания четкой иерархии действенный логический маршрут через интерфейс для юзеров, принимая во внимание тот факт, что (в случае западных языков) взор движется сверху вниз и слева вправо ( рис. 3.6).


Рис. 3.6.Слева представлен неплохой логический маршрут: движение взора и маршрут в интерфейсе совпадают. Справа – неловкий логический маршрут: все разбросано по экрану.

Симметрия – полезное средство организации интерфейса Использование визуальных свойств для группировки элементов и создания четкой иерархии исходя из убеждений заслуги зрительного равновесия. Несимметричные интерфейсы обычно смотрятся так, как будто вот-вот завалятся на один бок. Бывалые дизайнеры могут достигать асимметричного равновесия, управляя зрительным весом отдельных частей. Тест с прищуриванием позволяет проверить сбалансированность интерфейса.

В интерфейсах в большинстве случаев используют два типа симметрии: вертикальная осевая Использование визуальных свойств для группировки элементов и создания четкой иерархии симметрия (симметрия относительно вертикальной полосы, проведенной через центр группы частей) и диагональная осевая симметрия (симметрия относительно диагонали). В большинстве приложений находится симметрия 1-го из этих типов.

Целостные, непротиворечивые и надлежащие контексту образы

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

Дизайнеры Использование визуальных свойств для группировки элементов и создания четкой иерархии должны отдавать для себя отчет в том, что цвет в разных культурах имеет разные значения (в Китае красноватый цвет не считается предупреждающим), равно как жесты и знаки. Не считая того, необходимо знать цветовые коды, принятые в различных областях людской деятельности. К примеру, в поликлиниках желтоватый цвет обозначает радиацию, а красноватый, обычно Использование визуальных свойств для группировки элементов и создания четкой иерархии, употребляется в ситуациях, угрожающих жизни. На терминале фондового рынка красноватый – сигнал продавать. До того как вы возьметесь за дело, удостоверьтесь, что осознаете зрительный язык, принятый в сфере деятельности и культурном окружении ваших юзеров.

Зрительные элементы должны быть частью глобального зрительного языка связывающего составляющие интерфейса. Это значит, что логически схожие Использование визуальных свойств для группировки элементов и создания четкой иерархии элементы обязаны иметь общие зрительные характеристики, такие как положение, размер, толщина линий и общий стиль, различаясь только в том, что подчеркивает их значение. Мысль состоит в разработке связной системы частей. Интерфейс, в каком эта цель достигнута, кажется идеальным: ни один элемент не смотрится так, как будто его добавили в Использование визуальных свойств для группировки элементов и создания четкой иерархии последнюю минутку.

Кроме многофункциональной ценности пиктограммы способны играть значительную роль в передаче атрибутов бренда. Калоритные "мультяшные" пиктограммы могут попасть в точку, если вы проектируете игру для деток, а сверенные сдержанные пиктограммы больше подходят для бизнес-приложения. Независимо от того, какой стиль избран, соблюдайте преемственность – если на одних пиктограммах Использование визуальных свойств для группировки элементов и создания четкой иерархии полосы – жирные и темные со скругленными углами, а на других – тонкие ломаные, зрительный стиль "развалится".

Пиктограммы

Дизайн и рисование пиктограмм – совсем самостоятельная область. Создание понятных изображений при низком разрешении просит значимого времени и практики – лучше делегировать эту задачку опытным дизайнерам. Основная трудность заключается в представлении абстрактных понятий на пиктографическом, зрительном Использование визуальных свойств для группировки элементов и создания четкой иерархии языке. В таких случаях заместо образов, в каких никто не разберется, лучше опираться на идиомы и пичкать их всплывающими подсказками либо подписями.

В случае тривиальных и определенных функций придерживайтесь последующих правил:

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

Остерегайтесь метафор и представлений, которые могут не владеть требуемыми значениями в очах мотивированной аудитории. Например, поднятый ввысь большой палец может показаться подходящей пиктограммой для обозначения положительной реакции, но на Среднем Востоке и в других культурах этот жест является оскорбительным – в любом приложении Использование визуальных свойств для группировки элементов и создания четкой иерархии, созданном для глобального рынка, его следует избегать.

Зрительно группируйте взаимосвязанные функции – или пространственно, или, если это нереально, при помощи цвета и других изобразительных средств.

Создавайте обыкновенные пиктограммы; опасайтесь излишних деталей.

Используйте элементы повторно всюду, где это может быть, чтоб юзер исследовал их в один прекрасный момент и навечно.

Создание Использование визуальных свойств для группировки элементов и создания четкой иерархии уникальных знаков для разных типов объектов в интерфейсе также помогает юзеру лучше осознавать интерфейс. Такие зрительные маркеры позволяют юзеру ориентироваться посреди объектов резвее, чем просто подписи. Чтоб установить связь меж эмблемой и объектом, используйте знак каждый раз, когда объект возникает на дисплее.

Дизайнер интерфейсов должен позаботиться также о том Использование визуальных свойств для группировки элементов и создания четкой иерархии, чтоб знаки, представляющие объекты разных типов, визуально различались. Вычленить определенную пиктограмму на дисплее, переполненном практически схожими пиктограммами, настолько же тяжело, как и отыскать конкретное слово на дисплее, заполненном текстом.

Подготовительный просмотр

Заместо того чтоб обрисовывать результаты работы функций в интерфейсе только словами (либо, что еще ужаснее, не давать никаких описаний), демонстрируйте Использование визуальных свойств для группировки элементов и создания четкой иерархии юзеру, какими будут эти результаты. Для этой цели применяйте зрительные элементы. В дополнение к тексту, описывающему параметр либо состояние, расположите картину либо диаграмму, описывающую поведение. Хотя визуализация, обычно, просит дополнительного места на дисплее, ее способность ясно передавать смысл стоит потраченных на это пикселов. К примеру, функция меню "Эффекты" в Использование визуальных свойств для группировки элементов и создания четкой иерархии Android-приложении AdobePhotoshop указывает, как будет смотреться документ, если к нему применить один из эффектов (рис. 3.7).


Рис. 3.7. Эффекты реализованы таким макаром, чтоб юзер просто мог осознать, к каким результатам приводит тот либо другой эффект.

Интеграция зрительного стиля с функциональностью

Если дизайнеры интерфейсов решили придерживаться в интерфейсе определенного Использование визуальных свойств для группировки элементов и создания четкой иерархии стиля, это следует делать глобально. Каждый нюанс интерфейса должен быть проанализирован исходя из убеждений соответствия стилю; нельзя ограничиваться только некими зрительными элементами. Нужно убедиться, что многофункциональные нюансы графического интерфейса программки находятся в полной гармонии с общим зрительным стилем бренда вашей продукции. Поведение программки – часть бренда, и опыт взаимодействия юзера с Использование визуальных свойств для группировки элементов и создания четкой иерархии продуктом должен отражать баланс формы, содержания и поведения.

Для многих заинтересованных лиц (хозяев проекта) зрительный стиль – очень привлекательная область, но стилизованные элементы интерфейса следует держать под неусыпным контролем. Движущими силами в разработке зрительного стиля должны быть базисные формы, поведение и ожидаемое предназначение, тогда как суждения эстетического плана не должны мешать Использование визуальных свойств для группировки элементов и создания четкой иерархии передаче смысла в интерфейсе и взаимодействию юзера с продуктом.

При всем этом образовательные и развлекательные приложения оставляют больше способностей для тестов со стилем. В таких случаях и зрительное воспоминание, создаваемое интерфейсом, и содержимое приложения влияют на то наслаждение, которое юзер получает от взаимодействия с приложением; это служит значимым Использование визуальных свойств для группировки элементов и создания четкой иерархии аргументом в пользу более тесноватой связи дизайна управляющих частей с содержимым. Да и тут следует держать в голове об ожидаемом предназначении, позволяющем юзерам стремительно получать доступ к инфы.

Опасайтесь зрительного шума и кавардака

Зрительный шум в интерфейсе появляется из-за лишних графических частей, отвлекающих внимание от частей, конкретно связанных с Использование визуальных свойств для группировки элементов и создания четкой иерархии функциональностью и поведением программки. Зрительный шум появляется благодаря необязательным декоративным и лишне "большим" элементам, злоупотреблению линиями и другими разделителями меж органами управления, неприемлимому либо лишне насыщенному внедрением цвета, текстур и контраста. Необычные, запутанные либо перегруженные интерфейсы увеличивают информационную нагрузку на юзера и уменьшают скорость и точность его попыток Использование визуальных свойств для группировки элементов и создания четкой иерархии разобраться в содержимом экрана.

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

Типографика не должна быть очень различной: 1-го либо 2-ух шрифтов в нескольких размерах полностью довольно. Когда несколько Использование визуальных свойств для группировки элементов и создания четкой иерархии частей дизайна служат схожем либо взаимосвязанным логическим целям, эти элементы должны зрительно оформляться таким макаром, чтоб работал принцип наследования. Наследование дает возможность переносить осознание 1-го элемента на другие схожие элементы. Если элемент требуется выделить, сделайте контраст с иными элементами через настройку 1-го либо нескольких зрительных параметров, таких как Использование визуальных свойств для группировки элементов и создания четкой иерархии размер, цвет и положение.

Глупые варианты зрительных параметров мешают создавать целостные и комфортные интерфейсы.

За хоть каким зрительным элементом, хоть каким различием цвета, размера либо другого зрительного характеристики должны стоять определенные предпосылки. Если вы не сможете сконструировать причину для различий, избавьтесь от их.

Неплохой графический интерфейс, как хоть какой неплохой Использование визуальных свойств для группировки элементов и создания четкой иерархии дизайн, зрительно эффективен. Он очень много употребляет малый набор зрительных и многофункциональных частей. Всераспространенный прием – опыт с удалением отдельных частей с целью проверки их вклада в ясность загаданного послания юзеру. Удаляйте элементы, пока продукт не сломается, а потом возвратите последний удаленный элемент на место.

Текст в графических интерфейсах

Текст Использование визуальных свойств для группировки элементов и создания четкой иерархии – неотъемлемая составляющая практических всех пользовательских интерфейсов. Следует очень пристально относиться к применению текста, так как он обладает способностью запутывать и усложнять обыкновенные вещи.

Человек распознает буковкы исходя из их форм. Чем более узнаваема форма, тем проще распознать буковку, потому СЛОВА, СОСТОЯЩИЕ СПЛОШЬ ИЗ Больших БУКВ, ЧИТАТЬ Сложнее, чем написанные обыденным образом: в Использование визуальных свойств для группировки элементов и создания четкой иерархии больших буковках отсутствуют обычные глазу начертания, и потому чтение просит большего внимания. Опасайтесь в собственных интерфейсах слов, состоящих из больших букв.

Определение отдельных слов – не то же самое, что чтение, при котором мы осознанно сканируем отдельные слова и интерпретируем их значения в контексте. Следует стараться минимизировать объем текста Использование визуальных свойств для группировки элементов и создания четкой иерархии, который юзеру нужно прочесть, чтоб сориентироваться в интерфейсе. Применение маленьких обычных слов упрощает навигацию при малой необходимости в чтении.

Что касается читаемого текста в интерфейсе, рекомендуется придерживаться неких принципов:

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

Используйте подходящий шрифт и кегль (размер). Обычно, шрифт без засечек и с резкими контурами, таковой как Verdana либо Tahoma, читается идеальнее всего. Текст мельче 10 пикселов в большинстве ситуаций тяжело читать.

Верно формулируйте мысли. Пользуйтесь наименьшим количеством слов, нужным для ясной передачи смысла. Опасайтесь сокращений. Если они все-же Использование визуальных свойств для группировки элементов и создания четкой иерархии нужны, используйте принятые.

Цвет в графических интерфейсах

Цвет является составной частью зрительного языка интерфейса, и юзеры будут пробовать усмотреть смысл в том, как он применяется. В большинстве приложений цвет должен употребляться сдержанно и отлично сочетаться с иными элементами зрительного языка – знаками, пиктограммами, текстом – и пространственными отношениями меж ними. Если не Использование визуальных свойств для группировки элементов и создания четкой иерархии проявлять осторожность, цвет совсем не сложно применить некорректно. Самые всераспространенные ошибки:

Очень много цветов. Добавление 1-го цвета, выделяющего принципиальные элементы в наборе, существенно уменьшает время поиска. Добавление новых цветов приводит к дополнительному ускорению работы юзера, но при 7 и поболее цветах скорость поиска существенно падает. Уместно представить, что схожие Использование визуальных свойств для группировки элементов и создания четкой иерархии результаты будут получены при любом типе навигации по интерфейсу, так как число семь отражает количество частей инфы, единовременно сохраняемой в краткосрочной памяти человека.

Внедрение насыщенных дополнительных цветов. Дополнительными являются цвета, обратные друг дружке в числовом представлении. Если такие цвета владеют довольно высочайшей насыщенностью и размещены рядом, то порождают зрительные Использование визуальных свойств для группировки элементов и создания четкой иерархии эффекты, препятствующие легкому восприятию и мешающие сосредоточить внимание.

Чрезмерная насыщенность. Очень насыщенные цвета смотрятся кричаще и завлекают очень много внимания. Умеренное насыщение цвета допустимо для маленьких областей, привлекающих внимание юзеров, но такие области всегда следует создавать с осторожностью.

Недостающий контраст. Когда цвет объекта отличается от цветов фона только Использование визуальных свойств для группировки элементов и создания четкой иерархии цветом, но не насыщенностью либо яркостью, объект становится тяжело принимать. Фигура и фон должны различаться по яркости и насыщенности, а не только лишь по колеру. Не считая того, нужно избегать использования цветного текста на цветном фоне всюду, где только может быть.

Недостающая забота о людях с нарушениями цветового восприятия. Приблизительно 10 процентов мужского Использование визуальных свойств для группировки элементов и создания четкой иерархии населения мучается цветовой слепотой той либо другой степени. Это значит, что при использовании (а именно) цветов красноватого и зеленоватого для передачи принципиальной инфы следует проявлять бдительность. Любые цвета, используемые в интерфейсе, должны приметно различаться по насыщенности либо яркости. Если интерфейс остается читаемым после преобразования в черно-белый вариант, люди Использование визуальных свойств для группировки элементов и создания четкой иерархии с нарушениями цветового восприятия сумеют работать и с цветным вариантом интерфейса.

Принципы зрительного информационного дизайна

Разработка зрительного представления инфы имеет свои принципы, и дизайнер может использовать их для заслуги лучшего результата. В сфере зрительного представления инфы есть две принципиальных трудности:

Тяжело визуализировать многомерную информацию (информацию с более чем 2-мя переменными Использование визуальных свойств для группировки элементов и создания четкой иерархии) на двухмерной поверхности.

Разрешение конечного носителя не всегда довольно велико для вывода плотной инфы.

Есть универсальные принципы информационного дизайна, которые помогают повысить эффективность хоть какого представления инфы.

Информация, представленная зрительно, должна:

Содействовать зрительному сопоставлению. Предоставьте юзерам возможность ассоциировать взаимосвязанные переменные и тенденции или сопоставлять варианты "до" и "после". Сопоставление Использование визуальных свойств для группировки элементов и создания четкой иерархии делает контекст, делающий информацию более ценной и понятной юзерам (пример см. на рис. 3.7).

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

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

Соединять воединыжды текст, графику и данные в одном изображении. Диаграммы, требующие дополнительных подписей, легенд либо расшифровок, нагружают юзера дополнительной когнитивной обработкой. Юзеру приходится переключать внимание с диаграммы на подпись и назад, а потом соотносить их в уме. Еще лучше поместить нужные надписи прямо на диаграмме (см Использование визуальных свойств для группировки элементов и создания четкой иерархии. рис. 3.8).

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

Группировать объекты в пространстве, а не во времени. Когда Использование визуальных свойств для группировки элементов и создания четкой иерархии вы отображаете данные, меняющиеся во времени, юзеру легче принимать их динамику, если значения выводятся рядом, а не перекрываются.

Представлять числовые данные в числовом виде. Даже если вы предпочитаете воспользоваться графиками и диаграммами, чтоб облегчать восприятие тенденций и другой количественной инфы, не следует стопроцентно отрешаться от вывода фактически числовых данных (рис. 3.8).


Рис Использование визуальных свойств для группировки элементов и создания четкой иерархии. 3.8. Гистограмма Android-приложения Battery HD дает примерное представление об уровне заряда батареи, но тут же выводится четкое значение.


ispolzovanie-transportnih-sredstv-pri-turisticheskih-puteshestviyah.html
ispolzovanie-treninga-v-obuchenii-studentov-psihologov-kommunikativnoj-kompetentnosti.html
ispolzovanie-uchenimi-vneshnih-kulturnih-resursov.html