Контрасты в дизайне

Человеческий глаз обладает особенностью достраивать в уме то, что он должен видеть. К сожалению, не всегда то, что он создает/передает нашему мозгу правильно. Классический пример: «MWA» на светлом фоне выглядит темнее, нежели «MWA» на темном, хотя оба варианта написаны с использованием одного цвета.

image

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

С проблемой контрастов в дизайне я столкнулся, когда сверстал сайт (не будем оценивать дизайн – он не идеален, зато позволяет проиллюстрировать некоторые особенности, которые были открыты).

image

Если вы обратили внимание, то справа, в том месте, где черная плашка меню встречается с серым фоном контраст тени меньше. Кроме того, сама черная плашка выглядит визуально на 1px уже.

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

  1. Принцип близости
    Объекты, расположенные близко, будут объединены в одну группу
  2. Принцип подобия
    Объекты одинаковой формы будут объединены в одну группу
  3. Принцип хорошего продолжения
    Как правило, контур будет продолжен, если он подразумевается. Люди склонны строить ровные линии
  4. Принцип закрытости
    Человеку проще завершить контур, проигнорировав пространство
  5. Принцип правильной формы
    Комбинация из фигур будет максимально упрощена и приведена в хороший (т.е. симметричный, простой завершенный) вид.
  6. Принцип фигуры и фона
    Две контрастирующих объекта, наложенные друг на друга будут выделены в фон и фигуру.

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

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

Опубликовано 01:23 18.02.2008 в: Blogging | Daily Life | Design | Web | Комментарии (0)
Добавить в: Digg it! Tech it! Delicious! StumbleUpon! Reddit! Magnolia! Facebook it! Google! Yahoo!

Имя:

Email:

URL:

Запомнить мои данные

Подписаться на комментарии?

Следующая запись: А так хочется иногда побаловаться...

предыдущая запись: I love you!

<< Back to main