Основы композиции

Композиция - это искусство составления (компоновки).

Композиция состоит из ограниченной плоскости и пятен (элементов) на плоскости.

Плоскость

Элементы

У сайта за плоскость возьмем страницу, а за элементы - блоки.

У страницы за плоскость возьмем наш рабочий контейнер (контейнеры), а за элементы - картинки, текст, кнопки, формы обратной связи и т.д.

Задача композиции: создать комфортное пространство для восприятия информации человеком.

1) Неравное кол-во черного и белого. Необходимо для определения фона и элементов на нем - что есть что? Фон - это то, чего больше. Если фон занимает столько же, сколько и пятна на нем, то это вызывает дискомфорт восприятия.

2) Наличие пятен трех размеров: большие, средние и маленькие.

3) Наличие композиционного центра. Комп. центр - специально выделенное место на плоскости, имеющее свои уникальные качества. (не является геом. центром!).

4) Наличие ритма. Пятна и промежутки между ними должны иметь разные расстояния (размеры).

5) Сбалансированность выходов пятен в края композиции. (не обрезать общую картину)

* страницу целиком можно рассматривать как композицию.
* блок можно рассматривать как композицию

Пятна

Фон

рис 1

рис 2

среднее по размеру пятно

большое пятно

маленькое пятно

Композиционный центр

рис 3

Композиционный центр

Композиционный центр

рис 4

рис 5

Создается ощущение незавершенности, "обрезанности", будто это кусочек от общей картины

Если в композиции отсутствуют малые пятна, она имеет свойство фрагментарности.

Если в композиции отсутствуют большие пятна, она имеет свойство монотонности.

В большинстве случаев следует избегать фрагментарности и монотонности

Композиция целиком (картина "Рождение Венеры" Боттичелли)

фрагмент

НЕ монотонная композиция

монотонная композиция

Статичная: создает впечатление спокойного состояния фигур. Статику хорошо передают прямоугольник и квадрат.

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

Части композиции могут уравновешиваться: по массе, тону и цвету.

Композиции могут быть уравновешенными и неуравновешенными.

Равновесие может касаться: самих фигур и пространства между ними.

Композиция натюрморта:

а – уравновешенная по цвету,
б – неуравновешенная по цвету

СИММЕТРИЯ

АССИМЕТРИЯ

СТАТИКА

ДИНАМИКА

Пропорция - равенство двух или нескольких отношений.

Пропорции связаны с понятиями соразмерности и меры. Одним из способов соизмерения целого и его частей является модуль.

Модули составляют модульные сетки, основа которых: квадраты, прямоугольники.

Модульную сетку можно придумать самому или воспользоваться существующими.

Модульные сетки используются, например, в полиграфии и архитектуре.

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

модуль

модульная сетка

* размер и цвет прямоугольников можно взять на свое усмотрение.

2. придумать и оформить ниже свою статическую и динамическую композицию на плоскости, используя подготовленные фигуры:

* Размер, цвет и количество фигур можно изменять на своё усмотрение.

Копировать фигуру можно:

1) навести курсор на нужную фигуру и кликнуть по ней левой кнопкой мыши.
2) нажать на клавиатуре комбинацию клавиш ctrl и C (одновременно контрл цэ), чтобы скопировать фигуру
3) нажать на клавиатуре комбинацию клавиш ctrl и V (контрл вэ), чтобы вставить новую фигуру
4) передвинуть новую фигуру на новое место, кликнув на нее мышкой (лкм), удерживая клавишу мыши, или при помощи стрелок на клавиатуре вверх/вниз, влево/вправо