Title

Учебник: Базовые знания / Введение в тему /

Опубликовано 00 месяц 2026

title

  • Главный тег
  • Второстепенный тег

Содержание

Любая визуальная работа строится из простых элементов:цвета,формыи их расположения. В коде эти элементы задаются через параметры и координаты. Ты не двигаешь объекты вручную, а описываешь, где они должны появиться, какого они размера и какого цвета. Даже из самых простых фигур можно собрать выразительную композицию.

У каждой фигуры есть форма, позиция и размер. Например, круг можно нарисовать в определённой точке, а его диаметр задать числом. Если менять только один параметр, изображение уже начинает перестраиваться. Так код превращается в инструмент управления композицией.

Цвет в коде тоже задаётся как параметр. Он может быть постоянным, а может меняться от элемента к элементу. Когда ты сочетаешь цвет с повторением и изменением размера, появляется визуальный ритм. Именно из таких связей собирается ощущение баланса.

fill('#ff86db');
ellipse(x, y, 80);
rect(x, y, 60, 60);

Функцияfill()задаёт цвет фигуры.ellipse()рисует круг или овал, а rect() — прямоугольник. Первые два значения внутри функции обычно отвечают за позицию, а следующие — за размер. Из этих простых команд и собирается визуальная сцена.

Даже простая фигура становится выразительной, когда ты управляешь её цветом, размером и местом в композиции

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

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

Здесь все элементы одинаковые: у них один цвет, один размер и одинаковый шаг. За счёт этого появляется спокойная и ровная структура. Переменнаяstepзадаёт расстояние между кругами, а size — их размер. Это самый простой способ собрать композицию через повторение.

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

Здесь композиция строится уже из двух форм: прямоугольника и круга. Розовая форма создаёт основу, а голубой круг добавляет акцент в центр. За счёт наложения появляется более сложный визуальный ритм. Так даже простая сетка начинает выглядеть как собранная графическая система.

  1. Композиция может строиться из самых простых фигур
  2. Цвет, размер и расположение напрямую влияют на визуальный баланс
  3. Даже повторяющаяся сетка может выглядеть по-разному, если менять параметры

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

  1. Раскомментируйrect(), чтобы заменить круги на квадраты
  2. Раскомментируй строку с x / width, чтобы размер менялся по горизонтали
  3. Раскомментируй строку с y / height, чтобы получить изменение по вертикали
  4. Раскомментируй новыйfill(), чтобы сменить цвет всей композиции
Вверх

.

.

.

.

Следующий материал

Алгоритмы и данные

Перейти к модулю

.

.

.

.