Главная

Психология в web дизайне сайта

Зачастую можно встретить рассуждения, что web дизайн - это оформление информации. Говорят о нём как элементе, существующем отдельно от текста, имеющем свои правила и законы. Не забывают упомянуть и о его важности общими фразами. А неужели текст, графика, заголовки, цвет и вся композиция не составляет информационное содержание страницы? Основной процент получаемой человеком информации приходится на зрение. По статистике 83% информации воспринимается зрительно. И 40% из неё запоминается человеком (против 20% от услышанного!). А изображение может нести в себе ничуть не меньше (а иногда и больше) информации, чем текст. Но как связать воедино изображение и текст? Как заставить web дизайн нести тему страницы? Вот это уже вопрос психологии.

Всё видящее око супруги

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

Творчество web дизайнера в индивидуальных работах может быть любым - это его личное дело. Здесь работает понятие "дизайн ради дизайна", часто превращаясь в стремление поразить зрителя чем-то удивительным. Но в оформлении конкретного заказа, рассчитанного на большую и различную аудиторию, важно не перестараться. Пользователь, просматривая оформление, всегда стремится сделать вывод, ищет законченность в понимании представленной информации. И сделав его, испытывает эстетическое удовлетворение. Задача дизайнера помочь ему в этом. Построить твёрдый, конкретный ассоциативный ряд, раскрывая тему.

Простая преграда

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

Слево-напаво, сверху-вниз, от А до Я

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

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

тематический центр

Любой "выделенный" объект в композиции становится тематическим или смысловым центром. Специалисты советуют использовать не более 3 тематических центров при 5-7 управляющих элементах (в рекламных материалах ещё меньше). Я оставлю это без комментариев, но в некоторых ситуациях позволю себе не согласиться. Ещё один способ заострить внимание на конкретной детали - это освещение. Любой источник света гарантированно заставляет обращать на себя внимание. Даже тень и затемнение некоторых деталей подразумевает существование источника света. И затемнённые детали оттесняются более освещёнными. Но, используя эффект освещения (внося источник света), можно совершить грубую ошибку. Человеческий глаз легко различает неправильное (неестественное) наложение теней. Поэтому, понятиям света и тени уделяется очень большое внимание в программе обучения художников.

Приведем пример. Долгие обсуждения световой схемы в дизайн-макете вызвали естественное стремление к творчеству у клиента (достаточно частая ситуация). Но его предложение повергло меня в шок. Он предложил сделать графический элемент тёмно синего цвета, а тень от него жёлтой! Убеждения, что это не правильно, породили вопрос: "Но это же можно нарисовать?". Можно, конечно, но нецелесообразно.

О цвете

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

тематическая направленность цвета

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


реальное многоплановое изображение

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

Шрифт также может вызывать различные ассоциации. Например, готический шрифт вызывает ассоциации с культурой Европы и он не может применяться в теме других культур или исторического периода. Но это уже типографика и для изучения её существует специальная литература (например, книга Эмиля Рудера "Типографика"). И в заключении, если вы стремитесь к профессионализму, то постарайтесь прочесть соответствующую литературу. Учитывайте различные статистические данные и публикации о результатах исследований. Не стесняйтесь спрашивать совета и чаще обсуждайте свои работы с другими.

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

Статья с сайта:http://www.splashweb.ru/

Главная
Сайт создан в системе uCoz