Про композиції в дизайні, Web Design, Інтернет-технології, статті

Станіслав Петровський, design.lnet.ru

Як сказав хтось із великих, створити геніальну картину – це покласти в потрібні місця потрібні фарби. Теж саме і з вебдизайн 🙂

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

Правила композиції

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

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

Виразність проявляється у вмілому використанні контрастів за кольорами, светлоте, розмірам. Наприклад, ефектно виглядають об’ємні фігури (контраст відблисків і тіні предмета). Контраст тим виразніше, чим більше він відповідає ідеї зображення (напр. контраст заголовка і тексту по розміром соотв. ідеї більшої важливості заголовка).

Виявлення центру – підкреслення тій частині, яка висловлює головну ідею. Як правило, центр знаходиться десь трохи вище середини екрану, але він може бути зміщений небудь “активним” елементом композиції – яскравим, великим предметом, іншим контрастним об’єктом. Прикладом зсуву композиції є картина Рєпіна “Не чекали “, де глядач спочатку губиться в здогадах дивлячись на порожній центр і потім бачачи напрямки вдивися всіх учасників композиції дивиться на двієчника – центр композиції 🙂

На практиці часто використовують метод виділення центру шляхом вписування композиції в просту геометричну фігуру – квадрат, ромб, трикутник (4,5,6>), круг, овал. Типовий приклад – використання ліній, з’єднують логотип і кнопки або окреслюють весь екран і захоплюючих кнопки.

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

Неоднорідність площині зображення – Відмінність у сприйнятті об’єктів в залежності від їх положення в поле зображення вивчалася вченими експериментально. В результаті доведено:

1. Похилі відрізки сприймаються йдуть в глибину в сторону кінця відрізка, далекого від краю екрана.

2. Якщо один кінець похилого відрізка примикає до краю екрану, то “Ефект об’єму” пропадає і відрізок сприймається лежачим на тій же площині, що і площину краю екрана.

3. Предмет далі від краю екрана сприймається лежачим в глибині, ближче – на поверхні.

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

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

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

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*