Основы дизайна: пространство и соотношение фигуры и фона

Стивен Брэдли, создатель таких популярных блогов, как: Основы дизайна: элементы, атрибуты и принципы и CSS анимация и современный веб-дизайн, продолжает рассматривать принципы гештальта и их влияние на сайтостроение.

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

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

Соотношение фигуры и фона

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

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

«Пустое пространство следует рассматривать в качестве активного элемента, а не пассивного фона».

— Ян Чихольд

Соотношение фигуры и фона. (Графический материал позаимствован из учебника Алекса Уайта « Элементы графического дизайна »)

1. Равномерно размещенные черные линии, создают серое поле. Фигура и фон находятся в устойчивом соотношении.

2. Пространство устранено. Фигура доминирует и мы видим сплошное черное поле.

3. Устранены две черные линии. Пространство стало активным и проявилось.

Соотношение фигуры и фона. (Графический материал позаимствован из учебника Алекса Уайта «Элементы графического дизайна»)Рассмотрим три фрагмента на картинке выше. Слева мы видим ряд черных линий с равным количеством белого пространства между ними. Вместе черные линии и белое пространство образуют серое поле, каждый в равной степени обеспечивает результат. Удаление пространства (второй фрагмент) полностью изменяет поле, и делает его непроглядно-черным. Мало того, что пространство пропало, но и отдельные элементы стали единым целым.

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

Стабильное, обратимое и неоднозначное соотношение фигуры и фона.

Кстати, рекомендую посмотреть прямо сейчас:

 

Есть три типа соотношения фигуры и фона:

· Стабильное (вверху слева)
Понятно, где фигура, а где фон. Одно или другое обычно доминирует в композиции.

· Реверсивное (вверху в центре)
И фигура, и фон привлекают внимание зрителя в равной степени. Это создает напряжение, в результате чего любое из двух может обойти другого, что приводит к динамичности дизайна.

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

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

Фигура и фон являются не единственным принципом «гештальта», в котором пространство играет важную роль. Два других таковы:

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

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

Замыкание.