.
.
.
.
Учебник: Базовые знания / Введение в тему /
Опубликовано 00 месяц 2026
title
.
.
.
.
Теория
Любая визуальная работа строится из простых элементов:
У каждой фигуры есть форма, позиция и размер. Например, круг можно нарисовать в определённой точке, а его диаметр задать числом. Если менять только один параметр, изображение уже начинает перестраиваться. Так код превращается в инструмент управления композицией.
Цвет в коде тоже задаётся как параметр. Он может быть постоянным, а может меняться от элемента к элементу. Когда ты сочетаешь цвет с повторением и изменением размера, появляется визуальный ритм. Именно из таких связей собирается ощущение баланса.
fill('#ff86db');
ellipse(x, y, 80);
rect(x, y, 60, 60);
Функция
Даже простая фигура становится выразительной, когда ты управляешь её цветом, размером и местом в композиции
Ниже ты увидишь, как из простых кругов и прямоугольников можно собрать ритмичную композицию. Сначала форма и цвет будут фиксированными, а потом ты сможешь добавить вариацию. Так будет легче заметить, как меняется визуальный баланс.
Практика
В первом примере используется простая сетка кругов одного цвета. Это базовая композиция, в которой важны повторение и равный шаг между элементами. Попробуй сначала просто посмотреть на неё, а потом менять размер и цвет.
Здесь все элементы одинаковые: у них один цвет, один размер и одинаковый шаг. За счёт этого появляется спокойная и ровная структура. Переменная
Теперь можно усложнить композицию. Если изменить форму и добавить второй цвет, изображение станет более динамичным. Сам принцип останется тем же, но визуальное впечатление изменится.
Здесь композиция строится уже из двух форм: прямоугольника и круга. Розовая форма создаёт основу, а голубой круг добавляет акцент в центр. За счёт наложения появляется более сложный визуальный ритм. Так даже простая сетка начинает выглядеть как собранная графическая система.
Вывод
- Композиция может строиться из самых простых фигур
- Цвет, размер и расположение напрямую влияют на визуальный баланс
- Даже повторяющаяся сетка может выглядеть по-разному, если менять параметры
Задание
Теперь попробуй сам изменить композицию. В коде ниже уже подготовлены разные варианты — тебе нужно раскомментировать строки и посмотреть, как меняется результат. Обращай внимание не только на отдельные фигуры, но и на общее ощущение от сетки.
- Раскомментируй
rect() , чтобы заменить круги на квадраты - Раскомментируй строку с
x / width , чтобы размер менялся по горизонтали - Раскомментируй строку с
y / height , чтобы получить изменение по вертикали - Раскомментируй новый
fill() , чтобы сменить цвет всей композиции
.
.
.
.
Следующий материал
Алгоритмы и данные
.
.
.
.