Часть втораяПринципы проектирования: пространство и фигура-фон Отношения

Если вы видите графический дизайн как процесс организации фигур на холсте, то Вы видите только половину того, что вы работаете with.

Отрицательное space 1 из холста так же важно, как положительных элементов, которые мы размещаем на холсте .

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

Фигура-фон Relationship

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

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

“ Белое пространство следует рассматривать в качестве активного элемента, а не пассивной Для справки .”
— Ян Tschichold

Figure-Ground Relationship.
Фигура-фон Отношения.(Кредит изображения: “ Элементы графического Design 4 ” Алекс Белый)

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

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

Stable, reversible and ambiguous figure-ground relationships.
Стабильная, обратимые и неоднозначные фигура-фон отношения .

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

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

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

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

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

Closure.
Закрытие .

Космос как дизайн Element

Подумайте о музыке на мгновение.Если каждая нота или аккорд играли в то же время, вам не придется музыку.Вы должны были бы шум.Музыка возникает, когда звуки контрастирует с молчанием.Изменение картины звука и тишины создает ритм и мелодию.Без молчания, нет никакой музыки .

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

Если шум не то, что вы пытаетесь общаться, склоняются к пространству.Люди, менее вероятно, чтобы жаловаться на слишком много места, чем о слишком мало .

Пространство может сделать following:

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

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

Одним из наиболее важных функций пространства для улучшить читабельность legibility.Макро-пространство делает текст более привлекательным.Micro-пространство делает его более четким .

  • Micro-spaceЭто пространство внутри элементов в одной группе.Это пространство между буквами, словами и параграфы .
  • Макро-spaceЭто пространство между основными элементами.Это отдельные элементы или группы элементов и обеспечивает возможности для глаз, чтобы следить и места для отдыха между элементами .

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

Space также может передать атрибуты, кроме качества, такие как:

  • Изысканность,
  • Простота,
  • Роскошь,
  • Чистота,
  • Одиночество,
  • Открытость .

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

Дизайн, в конечном счете расположение форм, в том числе и формы, образованные пространстве. Не бойтесь использовать space.Смотреть его в качестве важного элемента дизайна под вашим контролем .

Несколько примеров пространства в Websites

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

Старый Guard

Дизайн __67 Тома Джонсона | Старый Guard 8 6 использует много белого пространства, давая текста и других элементов комнаты, чтобы дышать.Там не понять, что фигура, а что это земля .

Old Guard uses plenty of white space, giving text and other elements room to breathe. 7
Старый Guard 8 6 использует много белого пространства, давая текст идругие элементы комната, чтобы дышать.( Большая version 9 )

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

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

Heroku в STAUS Page

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

Part of the status page for Heroku 11
Часть странице состояния для Heroku 12 .( Большая version 13 )

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

Введение в Novel

Пространство в верхней части Введение в Novel 16 14 асимметрична и активны.Обратите внимание, как большой блок пространства слева ведет в глаза непосредственн …

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

Comments are closed.