Ли клиент никогда не просил вас сделать логотип bigger ¹ ?Может быть, они спросили, что сразу после завершения их просьбу, чтобы сделать заголовок больше.Новая рубрика выделяется, но теперь логотип слишком мал в сравнении и не быть замеченным.Клиенты хочет сделать логотип больше .

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

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

Акцент относительно.Для одного элемента, чтобы выделиться, другой должен служить фоном из которых первый, чтобы выделиться. Некоторые элементы должны dominate ² другие для того, чтобы ваш проект для отображения какой-либо визуальной иерархии .

Note: Это пятый пост в серии, посвященной принципам проектирования.Вы можете найти первые четыре сообщения в серии здесь:

• Принципы проектирования: визуальное восприятие и Принципы Gestalt ³
• Принципы проектирования: Пространство и фигура-фон Relationship ⁴
• Принципы проектирования: соединения и разделения элементов через контрастности и Similarity ⁵
• Принципы проектирования: визуальный вес и визуализация Direction ⁶

Dominance

Сравнить любые два элемента в дизайне.Либо элементы будут равны во всех отношениях или один будет оказывать некоторый уровень доминирования над другой.Более доминирующим элементом будет привлекать глаз и быть замеченными в первую очередь.Это может даже показаться, чтобы показать какой-то контроль над менее доминирующий элемент .

Более доминирующим элементом всего, имеет большую визуальную вес, чем элементы доминирует.Это, кажется, оказывают силы на то, чтовокруг него .

⁷

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

Как создать Dominance

Вы проектируете один элемент, чтобы иметь больше господство, чем другой, давая ему более визуальный вес.Больше его визуальный вес, более элемент будет привлекать глаз и выставочная господство .

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

Ваша цель заключается в создании элементов с заметным различиям в визуальный вес .

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

• Размер,
• Форма,
• Цвет,
• Значение,
• Глубина,
• Текстура,
• Плотность,
• Насыщенности,
• Ориентации,
• Местного белого пространства,
• Самостоятельный интерес,
• Воспринимается физический вес,

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

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

В идеале, вы хотите одного доминирующим элементом .

Категории Element

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

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

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

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

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

Фокусное Points

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

Координаторы в ваш дизайн должен выделяться, но следует отметить, после элемента с большей господства.На рисунке ниже показан одинокий круг на фоне моря в основном серых квадратов.Круг не только разные формы, но больше, и ярко-красный.It’ ˘S вероятно, первая вещь, глаз уведомления в графическом .

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

Круг и три красноватые квадраты, все координационные центры, поскольку они выделяются из большинства других элементов в графике.Они контрастируют с массой серых квадратов.Большой ярко-красный круг выделяется больше всего.Это доминирующим центром, или доминирующим элементом в этом образе .

⁹

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

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

Уровни о Dominance

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

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

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

• DominantЭто на одном уровне с наиболее визуального веса и тот, который получает наибольшее внимание.Ваше доминирующим уровень, как правило, состоят из одного элемента на переднем плане .
• Sub-dominantЭто уровень координационных центров, за исключением преобладающего элемента или доминирующим координационного центра.Он получает среднее акцент.Элементы на этом уровне получают меньше внимания, чем доминирующей уровне, но больше, чем подчиненного уровня .
• SubordinateЭто этот уровень с наименьшим визуального веса.Следует отойти на фоне некоторой степени.Этот уровень, как правило, содержат ваше тело текста .

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

Видео Hierarchy

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

База ваша визуальная иерархия на реальных приоритетов информации, представлены.Во-первых, приоритет все, что пойдет на странице, и как только он установлен, дизайнвизуальная иерархия следовать этому приоритетов .

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

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

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

Перевернутая пирамида из Writing

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

¹²

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

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

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

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

Гештальт-принципы и визуальные Hierarchy

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

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

Такие законы, как те, о prägnanz и симметрии о создании заказ и сделать вещи проще и понятнее.Это именно то, что вы делаете, когда …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров