Лицензия

Лицензия Creative Commons
Материалы блога доступны по лицензии Creative Commons «Attribution-NonCommercial-ShareAlike» («Атрибуция — Некоммерческое использование — На тех же условиях») 4.0 Всемирная.

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

С уважением Бугайчук К.Л.

Подумайте об этом

среда, 13 сентября 2017 г.

12 принципов визуальной иерархии (часть 1)

Начинаю перевод статьи о дизайне и цветах: http://blog.visme.co/visual-hierarchy

Размер влияет на видимость



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

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




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

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





Перспектива создает иллюзию глубины



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


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



Цвет и контраст привлекают внимание



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




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




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

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




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

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


Диаграмма глубины цвета


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

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




Продолжение следует...

3 комментария:

  1. The Trp Coin is a cryptocurrency with a set price of $1.00. It is the only cryptocurrency that offers the most value for the money, with an equal value of 1000 coins per dollar. Find the best place where to buy Trp coin today by reading this article!

    ОтветитьУдалить
  2. The Bfarf stock Overview offers real time stock price updates. All you need to do is open the application and you can view Streaming stock prices of your favorite stocks.

    ОтветитьУдалить
  3. Catch the verb Stocktwits Live Real Time Stock Market Overview, your one stop shop for verb Stocktwits information. Live prices are updated every 5 minutes, so you see all of the latest verb Stocktwits changes as soon as they happen. With a sleek and intuitive user interface, we strive to make your data experience easy.

    ОтветитьУдалить