Виразні засоби графічної композиції

Попри те, що композиція перед нами є статичною по суті, образи на ній можуть передавати відчуття руху, а маленька світлина — величний масштаб Ейфелевої вежі. Як це відбувається?

Завдяки тому, що графічна композиція взаємодіє з нашим сприйняттям.

Графічна композиція утворюється на площині з написів, графічних образів, декоративних елементів та кольорів. Разом ці елементи можуть втілювати як прості ідеї, так і комплексні сюжети. Наприклад, в картині «Сон, викликаний польотом бджоли навколо граната, за секунду до пробудження» Сальвадор Далі за їх допомогою створює цілу фантасмагоричну реальність сновидіння, в якій жало бджоли, наближаючись до сплячої музи художника, перетворюється на багнет гвинтівки, що вилетіла разом з тиграми та хижою рибою з тріснутого граната.

Зверніть увагу: щоб втілити цю дивну і дещо бентежну ідею, митець старанно розміщує елементи в просторі картини. Їх розмір, положення та напрям невипадкові. Тобто, щоб сукупність елементів графічної композиції перетворилась на сюжет, мало їх просто додати до простору композиції. Треба змусити їх певним чином проявлятись — виражати себе.

Для цього існує низка прийомів, відомих як виразні засоби графічної композиції. Інша їх назва — засоби гармонізації (трохи згодом пояснимо, що це означає).

Їх сім, і зазвичай їх перераховують парами:

• Метр — Ритм
• Симетрія — Асиметрія
• Пропорції — Співвідношення величин
• Величина — Масштабність
• Подоба — Відмінність
• Нюанс — Контраст
• Консонанс — Дисонанс

Насправді кожна з цих пар відповідає за одну з характеристик твору. Щоб зрозуміти, чому виразні засоби є парними і як вони взагалі працюють, уявіть собі, що ці пари формують своєрідний візуальний еквалайзер, який допомагає передавати окремі відчуття відносно усієї композиції або окремих її елементів.

• Так, пара «Метр — Ритм» відповідає за передачу відчуття динаміки.
• «Симетрія — Асиметрія» — за відчуття симетричності композиції.
• «Пропорції — Співвідношення величин» — за досягнення пропорційності композиції.
• «Величина — Масштабність» — передає відчуття масштабу.
• «Подоба — Відмінність» — об’єднує елементи у візуальні групи.
• «Нюанс — Контраст» — дозволяє передати силу відмінності елементів.
• «Консонанс — Дисонанс» — визначає, до стану спокою чи до стану бентежності тяжіє ваш сюжет.

Тепер познайомимось з цими парами ближче! Почнемо з «Метру — Ритму».

Метр — Ритм

Пара виразних засобів «Метр — Ритм» пов’язана з динамікою. За її допомогою ви можете передавати відчуття напрямку руху, його інтенсивності та навіть сили. Ці виразні засоби працюють в парі тому, що динаміка завжди прив’язана до певного розміру.

В цьому випадку під словом «Метр» слід розуміти не канонічний метр з метричної системи, а вихідне значення цього слова — «вимір» (від давньогрецького μέτρον, «міра»).

Для того, щоб оцінити ритм, нам обов’язково потрібно визначити розмірність. Наприклад, щоб оцінити швидкість руху нам потрібно знати два параметри — розмір (скажімо, метр) та час (скажімо, секунди). Ця пара створює розмірність часу (метр на секунду) і дозволяє оцінити швидкість руху.

Маючи розмірність, можна передавати відчуття ритму, тобто того, як елемент взаємодіє з цією розмірністю. Ритм може бути рівномірний, зростаючий або спадаючий. По суті, ключове завдання пари «Метр — Ритм» — візуалізація динаміки.

І хоч вам може здатись, що на цьому курсі ви з ними зіткнулись уперше, запевняємо, цей виразний засіб вам дуже добре знайомий. Фактично кожен графік, що показує ту чи іншу динаміку, — це наочний приклад використання цієї пари виразних засобів.

Звісно, в графічному дизайні ви не зображаєте вертикальні та горизонтальні шкали виміру. Але і без них можна легко візуалізувати динаміку. Наприклад, показати сили сигналу сотової мережі, налаштувань яскравості або гучності звуку. Для цього достатньо просто показати поступове збільшення елементів один відносно одного.

Ще за допомогою пари «Метр — Ритм» можна впливати на те, з якою швидкістю людина буде сприймати інформацію. Подивіться, як відстань між окремими літерами та словами впливатиме на швидкість зчитування фраз:

До речі, ще один приклад застосування цієї пари виразних засобів добре відомий багатьом прихильникам фільму «Назад у майбутнє». В його логотипі cаме завдяки Метру й Ритму вдається за допомогою двох написів передати метафору руху вперед і назад в часі.

Симетрія — Асиметрія

Назва цієї пари виразних засобів є досить красномовною — вона визначає, наскільки наближеною чи віддаленою від симетричності є композиція в цілому або окремі її елементи.

В стародавні часи симетричність вважалась ознакою краси, до неї часто прагли архітектори стародавнього світу. І це не дивно: симетрія від природи є врівноваженою, і відтак, чим ближче композиція до стану симетричності, тим оптично збалансованішою вона є.

Втім, далеко не завжди дизайнер прагне передати відчуття врівноваженості елементів. Іноді творчий задум полягає як раз в тому, щоби продемонструвати нерівність, незбалансованість одного елемента відносно іншого, і тоді асиметрія стає чудовим виразним засобом для цього.

Наприклад, щоб продемонструвати чисельну перевагу однієї армії над іншою; розмір Давіда у порівнянні з Голіафом; або невідповідність зусиль отриманому результату.

А ще симетрія є чудовою візуалізацією організованості та впорядкованості, а асиметрія — творчого безладу.

Пропорція — Співвідношення величин

Для людини пропорційність є фізіологічно важливою. Ми сприймаємо її інтуїтивно, адже самі є носіями пропорції. Це відзначив ще римський архітектор Вітрувій у своєму трактаті «Про архітектуру».

Вітрувій писав, що «...жоден храм без співрозмірності і пропорції не буде мати правильної композиції, адже в ньому не буде того ж точного членування, як і у добре складеної людини» (Вітрувій. Десять книг про архітектуру. Книга третя. Глава перша, https://bit.ly/3bFT0o9). І далі він вказує, що людське тіло є дивовижно пропорційним. Так голова від підборіддя до верхньої лінії лоба і лінії початку волосся становить одну десяту частину тіла, так само як і витягнута кисть від зап'ястя до кінця середнього пальця; голова від підборіддя до тімені — одну восьму тощо.

До речі, саме на основі цього трактату Да Вінчі створив одну зі своїх найвідоміших робіт — Вітрувіанську людину.

Отже, відповідно до трактату Вітрувія, щоб архітектурна будівля була правильно влаштована, вона неодмінно повинна містити базову пропорцію в основі всієї композиції. Один елемент будівлі обов’язково повинен бути пропорційним відносно іншого елемента. І в основі кожного розміру архітектурного елемента має бути пропорція.

Аналогічно це працює і в графічному дизайні. Щоб ваша композиція сприймалась гармонійно, корисно визначати базову пропорцію і будувати композицію відносно неї.

Для забезпечення пропорційності графічної композиції дизайнери часто застосовують модульні сітки.

Величина — Масштабність

Слово «масштаб» походить від німецького іменника Maßstab, тобто «лінійка». На географічних картах масштаб часто зображують саме у формі лінійки, що пояснює, як дана карта співвідноситься з реальним розміром території. В цій лінійці нам показують, що сантиметру в даній карті відповідає, скажімо, кілометр. Оскільки ми знаємо, що таке кілометр в реальному житті, то можемо легко оцінити відстані на карті.

А як передати розмір великого об’єкта на маленькому клаптику паперу (скажімо, на поштовій марці)? Уявіть собі людину, яка й гадки не має, наскільки великою є Ейфелева вежа у Парижі. Якщо їй показати на малюнку саму цю вежу, збагнути її розмір людина не зможе. А от якщо поруч з цією вежею намалювати людей, одразу стане зрозуміло — вона є дуже високою!

Тобто, щоб передати незрозумілу величину одного об’єкта, нам знадобиться інший об’єкт, зрозумілої величини. В графічному дизайні ми регулярно використовуємо цей принцип. Наприклад, засновниця сумно відомого медичного стартапу «Theranos» Елізабет Ґолмс декларувала, що її компанія винайшла спосіб робити комплексні аналізи крові на основі лише кількох крапель, зібраних у невеличку пробірку, нанотейнер. Звісно, можна було б передати дивовижно малі розміри цього нанотейнеру за допомогою лінійки, але ліпшого емоційного ефекту досягала фотографія Ґолмс, на якій вона тримала нанотейнер двома пальцями.

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

Подоба — Відмінність

Пара засобів «Подоба — Відмінність» допомагає передати ідею спільних рис через візуальну подобу. І навпаки — чим менше елементи подібні один до одного візуально, тим сильнішою є їх сутнісна відмінність.

Цей принцип часто застосовується у формах держслужбовців, військових, лікарів, футбольних команд.

В графічному дизайні принцип подоби та відмінності також регулярно застосовується. Наприклад, всі заголовки одного рівня ієрархії змісту мають однаковий розмір. В графічних інтерфейсах однакові за функціями елементи мають спільні візуальні риси.

До речі, з парою виразних засобів «Подоба — Відмінність» пов’язаний важливий дизайнерський прийом — формування візуальної рими.

Так, щоб ваші написи виглядали гармонійно з графічним образами та декоративними елементами, важливо навчитись знаходити в них спільні риси. Дрібні елементи, що будуть виглядати подібно та органічно доповнятимуть один одного.

Нюанс — Контраст

Пара «Нюанс — Контраст» допомагає нам передавати як ступінь відмінності одного елемента стосовно іншого, так і забезпечувати візуальну виразність.

Нюанс — це незначна відмінність елемента від подібних. Контраст — це значна відмінність. Чим більшою є відмінність елементів між собою, тим вони контрастніші.

Візуально контраст можна передавати за допомогою форми елементів:

За допомогою кольорів:

Також контраст може бути емоційним або змістовним. Наприклад, метафора холоду (крижинка) сильно контрастує метафорі тепла (вогню). А метафора радості — обуренню.

Консонанс — Дисонанс

Нарешті остання пара виразних засобів — Консонанс та Дисонанс. Слово консонанс походить від латинського consonatia «співзвуччя», а дисонанс — від disonatia, «немилозвучність», «неструнке звучання».

Ідея цих виразних засобів дуже проста: вони допомагають вам наблизити сприйняття або до гармонійного, або до бентежного. До якого з двох станів ви прагнете наблизити споглядача — це питання вашого творчого задуму. Наприклад, для соціальної реклами досить характерним є намір змусити глядача замислитись над певною проблемою чи навіть почати хвилюватись.

Щоб досягти цієї мети, можна використовувати бентежні образи, похмурі палітри кольорів чи трохи дивні композиційні рішення.

Часто до дисонансу вдаються рок-виконавці, такі як Rammstein, Трент Резнор чи Мерілін Менсон.

Тяга до дисонансу простежується і в логотипах рок-гуртів.

Ну, а щоб досягти консонансу дизайнери, навпаки, використовують образи щасливих людей, приємні палітри та охайну типографію.

На завершення

Отже, виразні засоби композиції — це сукупність візуальних прийомів, що допомагають вам досягти того чи іншого емоційного чи смислового ефекту. Як від композиції в цілому, так і від окремих її елементів.

На самому початку матеріалу ми зазначили, що їх ще називають засобами гармонізації композиції.

Дещо дивне слово гармонізація означає такий процес, в результаті якого кожен елемент композиції набуває форми, розміру, положення та кольору, що, з одного боку, відповідають вашому задуму, а з іншого — дозволяють сприйняти створену вами композицію як завершену та врівноважену. Інакше кажучи, композицію, що задовольняє вимоги трьох законів композиції.

Що це за закони ми з’ясуємо в наступному матеріалі.