Создание фона в графическом редакторе Corel Draw 06.04, 07.04, 08.04.2020

Тема: Создание фона для видеоигры в Corel Draw

Результат урока:




1. Рисуем небо и землю

Шаг 1

Создайте новый документ (Ctrl+N) размерами 1280x768 пикселей.



Шаг 2

Дважды кликните по инструменту Rectangle Tool (F6), чтобы автоматически создать прямоугольник по размерам страницы. Затем активируйте инструмент Interactive Fill (G) и с его помощью залейте прямоугольник линейным градиентом.

Если вы только начинаете изучать программу и не знаете как пользоваться тем или иным инструментом Corel Draw, вы можете открыть докер с подсказками (Window Dockers Hints), где найдете описание и иллюстрации по интересующему вопросу.



Шаг 3

Давайте придадим нашему градиенту вид летнего неба. Выберите верхний маркер градиента и измените его цвет на небесно-голубой (R=0 G=204 B=255), который есть среди стандартных образцов палитры в правой части программы. Если некоторое время удерживать левую кнопку мыши нажатой на образце, то вы увидите вариации выбранного оттенка.

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

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

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



Шаг 4

Вновь дважды кликните по инструменту Rectangle Tool (F6). Появившийся прямоугольник отправьте на самый передний план, нажав сочетание Shift+Page Up (Object Order To Front Of Layer). Теперь сожмите фигуру по вертикали, чтобы получилась узкая полоса в нижней части изображения, и залейте ее зеленым цветом. Преобразуйте прямоугольник в кривые (Object Convert to Curves; Ctrl+Q). Инструментом Shape Tool (F10) добавьте несколько опорных точек на верхней грани. Для этого просто дважды щелкайте им по нужной части контура. Добавленные точки хаотично перемещайте на небольшие расстояния вверх и вниз.



Шаг 5

Сделайте копию фигуры из предыдущего шага (Ctrl+C, Ctrl+V) и отразите ее по горизонтали, нажав соответствующую кнопку на панели свойств. Измените цвет этой фигуры на более темным оттенком зеленого и отредактируйте положение верхних опорных точек примерно как показано ниже.



2. Добавляем облака

Шаг 1

Вооружитесь инструментом Freehand Tool (F5) и нарисуйте в небе «облачную» фигуру. Залейте ее белым цветом. Затем активируйте инструмент Mesh Fill Tool (M) и кликните по фигуре облака. Появившуюся после этого центральную точку градиентной сетки удалите, дважды кликнув по ней тем же инструментом.



Шаг 2

Давайте построим нужную нам градиентную сетку. Это можно сделать несколькими способами.

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







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

Для этого активируйте инструмент Mesh Fill Tool (M) и дважды щелкните им в том месте, где хотите добавить узловую точку сетки. Там появится сразу и строка и столбец. Следующие точки добавляются аналогично.



Еще один вариант – единожды кликнуть тем же инструментом в желаемом месте и нажать кнопку «Add intersection» на панели свойств.



Шаг 3

Итак, тем или иным способом мы получили градиентную сетку. Пора приступать к ее раскрашиванию. Но сначала укажите режим выделения «Freehand». Он выбирается в небольшим выпадающем списке справа от полей с количеством строк и столбцов. Обведите все внутренние точки облака.



Откройте Color Docker (Window Dockers Color) и залейте выделенные узлы градиентной сетки светло-голубым цветом, указав нужный цвет в палитре и нажав кнопку «Fill».



Выделите группу точек в центре облака и залейте их более темным цветом.



Теперь наше облако выглядит объемно и принимает обертон от неба, более реалистично вписываясь в композицию.



Шаг 4

По той же технике нарисуйте облако меньшего размера.



Шаг 5

Расположите облака в «небесной части» нашего изображения. Затем выделите основной фоновый прямоугольник. Мы немного детализируем его и сделаем более интересным. Для этого добавьте несколько строк градиентной сетки, изогнув верхнюю линию.



Шаг 6

Измените цвет центрального узла искривленной линии на белый и отредактируйте остальные линии и узлы градиентной сетки примерно как показано ниже.



Теперь наше небо выглядит вот так:



Продублируйте (Ctrl+D) облака и расположите копии как показано на изображении ниже. Чтобы иллюстрация была разнообразнее, можно отразить их. По окончании сей операции выделите все облака и сгруппируйте (Ctrl+G).



В менеджере объектов (Window Dockers Object Manager) дайте группе с облаками имя «Clouds», кликнув по ней правой кнопкой мыши и выбрав пункт «Rename» в появившемся контекстном меню.



3. Рисуем яблоню

Шаг 1

При помощи инструмента Ellipse Tool (F7) нарисуйте несколько перекрывающих друг друга кругов разного размера (удерживайте при этом клавишу Ctrl для соблюдения пропорций). Залейте их зеленым цветом и объедините в одну фигуру командой Object Shaping Weld.



Шаг 2

Одним из способов, описанных выше, постройте на полученном в предыдущем шаге объекте градиентную сетку. Выделите внутренние узлы и залейте их более светлым оттенком зеленого.



Шаг 3

Инструментом Rectangle Tool (F6) нарисуйте вертикально вытянутый прямоугольник – это будет ствол дерева. Залейте его соответствующим красно-коричневым цветом.

Теперь мы должны опустить ствол ниже кроны. Можно сделать это следующими способами: изменить порядок фигур в менеджере объектов; воспользоваться сочетанием Ctrl+Page Down (Object Order Back One) или командой Object Order Behind, тогда курсор примет вид толстой стрелки. Ею нужно кликнуть по объекту, за которым должна оказаться целевая фигура (она, само собой, должна быть выделена). Последние две команды также доступны из контекстного меню страницы и менеджера объектов. Можно еще, наоборот, не опускать ствол, а поднимать крону.






Но вернемся к уроку. Преобразуйте ствол в кривые (Ctrl+Q) и сделайте верхнюю часть более узкой. На полученной фигуре постройте простую градиентную сетку. Центральную ее часть залейте более светлым, нежели основной цвет, оттенком, чтобы придать стволу визуальный объем.



Шаг 4

Добавим на яблоню небольшую тень. Дважды продублируйте (Ctrl+C, Ctrl+V, Ctrl+V) фигуру кроны. Верхнюю копию переместите немного вправо и вверх. Затем выделите обе копии и нажмите на панели свойств кнопку с красным перечеркнутым кругом, тем самым мы удалим градиентную сетку. Не снимая выделения, выполните команду Object Shaping Back Minus. Полученную фигуру залейте темно-зеленым цветом и уменьшите ее непрозрачность (при помощи инструмента Transparency Tool).



Шаг 5

Осталось «повесить» на яблоню, собственно, яблоки. Нарисуйте небольшой круг, залейте его красным цветом. Создайте на его основе простую градиентную сетку, при помощи которой сделайте нижнюю правую часть чуть темнее, а в центре поставьте ярко-желтую точку.



Сделаем яблоко чуть более блестящим, добавив небольшой овал с заливкой белого цвета. Затем уменьшите непрозрачность этого эллипса примерно наполовину.



Шаг 6

Теперь сделаем саму яблоню более яркой, освещенной летним солнцем. Создайте копию фигуры кроны и удалите сетку, как уже описывалось выше. Добавьте поверх овал достаточных размеров. Затем выделите его вместе с копией кроны и выполните команду Object Shaping Intersect. Залейте полученную фигуру светло-желтым цветом. Потом проведите инструментом Transparency Tool сверху вниз в пределах этой фигуры, создав тем самым градиентную непрозрачность.



Шаг 7

Добавьте по деревом тень в виде овала. Не забудьте опустить его ниже ствола. Также добавьте несколько упавших яблок. Затем сделайте копию яблони вместе с тенью и яблоками на земле. Разместите ее в другом месте фона, измените размеры и положение яблок на дереве. Потом тем же образом добавьте еще пару яблонь.



4. Еще немного детализируем фон

Шаг 1

Дважды щелкните по иконке инструмента Rectangle Tool (F6). Вновь созданный прямоугольник уменьшите по высоте и расположите между небом и землей в менеджере объектов. Преобразуйте фигуру в кривые (Ctrl+Q), залейте ее серо-голубым цветом. Затем инструментом Shape Tool (F10) отредактируйте длину направляющих верхних опорных точек так, чтобы верхняя граница стала плавной кривой (смотрите пример ниже). Это будет далекая горная гряда.



Тем же образом добавьте еще пару «горных гряд», заливая более «дальние» оттенками светлее ближней, дабы придать изображению глубину.



Шаг 2

При помощи инструмента Ellipse Tool (F7) нарисуйте некоторое количество темно-зеленых овалов.



Шаг 3

Можно заметить, что у наших яблонь есть только основной ствол, но нет ветвей. Исправим сие недоразумение. Нарисуйте на одном из деревьев прямоугольник и поверните примерно на 45° против часовой стрелки. Преобразуйте его в кривые и инструментом Shape Tool измените его форму, сделав похожим на ветку. Подобным образом нарисуйте ветки у других деревьев.



Шаг 4

Теперь нарисуем отдельные листья. Основой послужит овал. Выделите его правую и левую опорные точки инструментом Shape Tool и преобразуйте их в «угловые» нажав кнопку «Cusp node» на панели свойств. Размножьте листья по кронам деревьев, расположив их рядом с яблоками.



Вот наш фон и готов. Осталась пара манипуляций.



Шаг 5

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

Выделите верхнюю левую и правую опорные точки «горного хребта», нарисованного первым, и нажмите кнопку «Align nodes» на панели свойств. В появившемся диалоговом окне оставьте галочку только напротив пункта «Align Horizontal» и нажмите OK. Теперь эти точки точно будут находится на одной высоте. Повторите операцию для других «гор» и элементов травяного покрова.



Шаг 6

Снимите выделение, если таковое имеется, и найдите на панели свойств окно «Duplicate Distance», где можно указать, как явно следует из названия, расстояние для дублирования по оси X и Y. Введите туда 1280 и 0 соответственно. После чего выделите всё и нажмите Ctrl+D.