Анимация цветка в вазе

В этом уроке мы нарисуем цветок в вазе и заставим его двигаться с помощью synfig studio.

Анимация цветка в вазе с помощью synfig studio

Создайте небольшой документ вертикальной ориентации. Для этого, после запуска редактора, зайдите в настройки Холст- свойства и укажите ширину 200-300 пх и высоту 400- 500 пх.

В закладке Время установите время анимации порядка 8 секунд.

панель настроек

Шаг 1. Рисуем фон и вазу для цветка

Для удобства включите сетку и привязывание к сетке. Где включить эти инструменты показано ниже. В этом случае нам будет проще нарисовать симметричную вазу.

включение привязки к тексту

Выбираем инструмент кривые В и создаем несложный контур. Он задаст форму вазы. Форму можно придумать и нарисовать любую. Для заливки я использовал цвет D3FF61. Узлы ставим по сетке. На панели слоев задаем понятное имя слоя — ваза.

контур вазы

Далее создаем копию этого контура. Для этого на панели слоев внизу нажимаем на соответствующий инструмент. Уменьшаем размер копии контура. Для этого выделяем верхние узлы и сдвигаем их ниже. Цвет заливки контура изменяем на 567503.

Для контура в панели параметров установите непрозрачность 0.7, сам слой с контуром опустите ниже слоя с вазой. Слой переименуйте в вода в вазе. Вот такая простая имитация воды в вазе.

контур воды

С помощью кривых добавьте на боковые части вазы пару линий. Одна (слева) будет бликом на вазе, а вторая тенью (справа). Цвет для линий 000000 и AEE41D соответственно.

ваза вектор

В нижней части (под вазой) нарисуйте еще одну линию темного цвета. Выделите все нарисованные объекты и добавьте в одну группу и назовите ее ваза. Ниже можно посмотреть порядок слоев в моей работе.

панель слоев

С вазой мы закончили. Переходим к цветку.

Шаг 2. Цветок в вазе

С помощью кривых рисуем изогнутый контур. Устанавливаем цвет контура 6B9200. Это будет стебель нашего цветка в вазе.

контур стебля в вазе

Далее, справа и слева, добавляем контуры листьев. Опять используем кривые. Достаточно нарисовать пару листиков.

контур листьев

Цвет для контура задаем 6B9200. Если есть желание, то нарисуйте большее количество листьев или измените их форму.

контур листьев

В верхней части рисуем бутон цветка. Я не стал рисовать точную копию, а просто изобразил некое подобие. Для изображения используйте минимум узлов кривой, так проще контролировать форму. Для цветка я использовал цвет FABFBF

цветок вектор

Создайте копию цветка и уменьшите ее. Измените цвет заливки на 6B9200

цветок вектор

На лепестки можно добавить несколько контуров в форме капелек. Для них я задал цвет FEE7E7. Впрочем, это не обязательно.

цветок вектор

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

панель слоев

Давайте посмотрим на получившийся результат. Скромно и симпатично. Желаете букет цветов? Создайте пару копий и все. У каждого цветка можно изменить размер, наклон или количество листьев.

цветы в вазе, вектор

Шаг 3. Анимация цветка в вазе

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

Итак, выделяем группу с именем стебель, выбираем управляющую точку синего цвета и в панели параметров изменяем параметр угол (он уже выделен)

  • 0 секунда- угол поворота 0 градусов
  • 2 секунда- угол поворота +7 градусов
  • 4 секунда- угол поворота -7 градусов
  • 6 секунда- угол поворота +3 градуса
  • 0 секунда- угол поворота 0 градусов

Переходим к листьям, они находятся в одной группе, поэтому выделите группу листья и установите значения поворота в следующие моменты времени

  • 0 секунда- угол поворота 0 градусов
  • 4 секунда- угол поворота 3 градусов
  • 8 секунда- угол поворота 0 градусов

И последнее это бутон цветка. выделите слой цветок и установите значения

  • 0 секунда- угол поворота -9 градусов
  • 2 секунда- угол поворота 14 градусов
  • 4 секунда- угол поворота -12 градусов
  • 6 секунда- угол поворота 14 градусов
  • 8 секунда- угол поворота -9 градусов

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

play-sharp-fill

До встречи на следующем уроке анимация лодки, больше уроков synfig studio вы найдете здесь

Добавить комментарий

Ваш адрес email не будет опубликован.

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.