Gestalt principles and some other aspects of visual perception

Фигура и фон

Перед нами два цветовых пятна — две области, однородно окрашенные в разные цвета. Они воспринимаются как фигура и фон.

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

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

• левая половина пикселей картинки это одна группа, а правая половина — другая;
• чётные ряды пикселей это одна группа, нечётные — другая;
• один единственный первый пиксель в уголке — это первая группа, а все остальные пиксели — вторая.

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

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

Близость

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

Если изменить расстояния, мы увидим три пары объектов:

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

Это и есть принцип близости: расположенные рядом объекты ощущаются связанными, формируют новую целостность.

Принцип близости применим к любым объектам — к строчкам текста, к объектам на фотографии, к изображениям на листе. Он позволяет управлять вниманием и подсказывать зрителю взаимосвязи. Например:

• строчка текста рядом с фотографией будет восприниматься как комментарий к этой фотографии, как её осмысленное продолжение;
• кнопка рядом с текстовым полем создаст ожидание, что в команде, которую запускает кнопка, будет использоваться информация, которую ввели в поле;0
• буквы легко группируются в слова, потому что разделены пробелами, абезэтогоразобратьтексточеньсложно.0

Принцип близости позволяет не только создавать взаимосвязи, но и усиливать их, подчёркивать — и, как правило, в результате получается более естественный и гармоничный0 дизайн.

Синхронность

Перед нами однородная группа объектов, но некоторые движутся, причём синхронно. Совместное движение объединяет объекты в новую устойчивую группу.

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

Этот принцип широко используется в интерфейсах, интерактивном и моушен-дизайне, видеосъёмке, монтаже и анимации.

Подобие

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

Получится три группы. Вместо поворота можно изменить пропорции.

Или цвет.

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

А если признаки будут конкурировать, пытаться создавать альтернативные версии группировки — появится ощущение хаоса и незавершённости.

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

Непрерывность

Объекты, расположенные в виде непрерывной цепочки, словно вдоль невидимой линии, образуют устойчивую целостность.

Целостность сохранится, даже если присоединить ещё одну похожую фигуру. Мы всё ещё видим верхнюю часть как что-то одно, а нижнюю — как другое.

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

Если просто нарисовать линию и буквально воткнуть в неё ещё одну, эффект сохранится.

Непрерывность позволяет проследить за объектом глазами, задаёт направление. Этот эффект помогает делать довольно хитрый дизайн.

Замыкание

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

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

Замкнутая структура отделяет фигуру от фона, делает её сильнее, чем сам фон или разрозненные части, из которых она состоит.

Регулярность

Перед нами две линии. Скорее всего, вы видите прямую горизонтальную линию как один объект, а волнообразную диагональную — как другой.

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

Но у каждой линии есть своя внутренняя закономерность — одна линия прямая, другая волнистая. Мы называем это принципом регулярности.

Можно возразить, что на разделение влияет направление линий — одна горизонтальная, другая диагональная. Но вот ещё один пример.

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

Ещё пример.

Здесь непрерывность явно указывает, что линия, рисующая зубчатое колесо, перетекает в квадратную волну, а другая — наоборот, из волны в колесо. Но всё-таки мы видим зубчатое колесо как что-то одно, а квадратную волну как другое. Так диктует принцип регулярности.

Камуфляж

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

Слева показана исходная форма, справа на неё накладывается ещё три объекта, и они не мешают её увидеть.

Но если добавить объекты не случайно, а в определённых точках — в местах излома формы — можно замаскировать, «закамуфлировать» исходную форму (слева). Ещё можно создать новую регулярность, и тогда исходная форма тоже в ней растворится (справа). Это «эффект камуфляжа».

Опыт восприятия

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

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

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

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

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

Это ещё одна причина знать своего клиента и аудиторию, пытаться увидеть дизайн их глазами. И понимать, что они могут иначе его — нет, не оценивать! — а буквально видеть.

* * *

Это были принципы гештальта. Теперь вы их знаете, ура. Что с этим делать?

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

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

:—)

Чтобы узнать, когда мы выпустим что-то новое, подпишитесь.