Урок №9. Анимация моргания.

Урок №9. Анимация моргания.
Открываем файл Моя_первая_анимация.sifz. Моргание персонажа «оживляет» его. Разделим это действие на 5 составляющих: 1 — веки открыты, 2 — веки полуоткрыты, 3 — веки опущены, 4 — веки полуоткрыты, 5 — веки открыты. Итак, добавим новый ключевой кадр (см. урок №8) в момент времени 5s и опишем его как Начало моргания. Добавим ещё один ключевой кадр в момент времени 5s 8f и добавим в его Описание Конец моргания. Увеличим масштаб холста, чтобы было удобно работать с глазами гриба, и выделим левое веко (нажав на него левой клавишей мыши или выделив на панели Слои слой Левое веко Контур). Таким образом, процесс моргания будет длиться 8 кадров, то есть 1/3 секунды. Не забываем сохраняться. Создадим новый ключевой кадр с временем 5s 4s, это будет середина моргания, то есть момент полного опускания век (добавим Описание кадра — Середина моргания). Убеждаемся, что находимся в кадре 5s 4f (Середина моргания) . Переходим в режим редактирования анимации (см. урок №8). Перетащим нижние уТочки левого века в нижнюю часть глаза. Также переносим пониже правую и левую верхнюю уТочки. Подредактируем плавность кривой с помощью Касательных так, чтобы вся линия контура века была плавной и закрывала всю область глаза. Сохраняемся. Делаем то же с правым веком. Ещё раз сохраняемся. Теперь посмотрим кадры 5s 3f, 5s 2f, 5s 1f (можно сделать с помощью кнопки Перейти к предыдущему кадру ниже шкалы времени в левом нижнем углу рабочей области) и видим, что программа сама создала промежуточные кадры. Однако их нужно чуть-чуть подправить. Редактируем, сохраняемся, закрываем Synfig Studio.

Урок №8. Приближение сцены, предпросмотр, визуализация.

Урок №8. Приближение сцены, предпросмотр, визуализация.
Открываем файл Моя_первая_анимация.sifz. Пришла пора заняться анимацией! Создадим эффект приближения камеры к грибу. Для этого объединим слои Белый гриб и фон.jpg в один слой (см урок №7) и назовём его Масштабирование. Переходим в Режим анимации, нажав кнопку с зелёным человечком в правом нижнем углу экрана Включить режим редактирования анимации. Зелёный человечек на кнопке сменится на красного, и вокруг рабочей области появиться красная рамка. В панели Слои, потомки, Ключевые кадры , Параметры переходим на вкладку Ключевые кадры. Нажимаем кнопку Добавить новый ключевой кадр внизу панели. В окне отобразиться наш первый ключевой кадр, который будет находиться в нулевом кадре (Время 0f). Напишем Описание кадра — Дальняя позиция камеры. Внизу рабочей области находится Дорожка времени. Поставим курсор мыши на вторую шкалу справа после значения 4s и щёлкнем левой клавишей. В поле Текущее время слева от дорожки появится значение 4s 12f, то есть мы в данный момент находимся в 12-ом кадре 5-ой секунды анимации (в дальнейшем можно просто вводить нужное значение в поле с клавиатуры). Далее нажимаем на панели Ключевые кадры кнопку Добавить новый ключевой кадр и напишем в его описании Камера приблизилась. Таким образом мы создали второй ключевой кадр. Сохраняемся. Итак, нам нужно сделать изменения во втором ключевом кадре. Убеждаемся, что мы сейчас находимся в нём (смотрим значение в поле Текущее время), в противном случае нажимаем Перейти в окне Ключевые кадры. Далее переходим на вкладку Слои и выделяем слой Масштабирование. Справа в окне Параметры находим строку Масштабирование и меняем её значение на 1.000000. Наша сцена увеличилась прямо по центру и гриба на ней не видно. Уменьшим масштаб холста, найдём зелёную точку (центр слоя) и передвинем её так, чтобы гриб стал видим. При передвижении точки можно наблюдать, как меняются значения в параметре Исходная точка. Разумеется, при желании можно ввести туда значения вручную. Сохраняемся. Настало время посмотреть результат нашей первой анимации. Заходим в меню Файл → Предпросмотр или нажимаем кнопку с видеокамерой Открыть диалог параметров предпросмотра в верхней панели рабочей области. В появившемся окне ставим Качество 0.5, частоту кадров FPS 24, Begin time (начальное время) ставим галочку и оставляем 0f, End time (конечное время) ставим галочку и меняем на 5s. Нажимаем кнопку Предпросмотр и ждём, пока программа отрисует все кадры (внизу будет меняться значение времени). Далее выбираем из раскрывающегося списка в правом нижнем углу значение Уместить, что сделает Окно предпросмотра оптимального размера. нажимаем кнопку Воспроизведение и радуемся! Закроем Окно предпросмотра. Теперь сохраним анимацию во внешний файл, для этого выберем в меню рабочей области Файл → Визуализация и в появившемся окне в поле Имя файла напишем (вернее, немного изменим) /home/vanya/Моя_первая _анимация.avi. Цель ставим ffmpeg и нажимаем рядом кнопку Параметры. В появившемся окне Целевые параметры кодек можно оставить по умолчанию MPEG -4 part 2. (XviD/DivX), а вот Битрейт видео необходимо существенно увеличить (поставим 12000, например), иначе качество видео будет очень плохим. Параметры Качество и Сглаживание ставим по максимуму 9 и 31 соответственно и нажимаем кнопку Визуализация. Ждём, пока в строке состояния внизу рабочей области не появиться надпись Файл успешно визуализирован. Закрываем Synfig Studio и идём в домашнюю папку смотреть нашу анимацию каким-нибудь видеопроигрывателем, например, Медиапроигрывателем VLC.

Урок №7. Группировка, перемещение и масштабирование слоёв

Урок №7. Группировка, перемещение и масштабирование слоёв
Открываем файл Моя_первая_анимация.sifz. На прошлых уроках мы нарисовали гриб. Теперь нам уже не понадобиться загруженный рисунок белый.jpg, так что можно его удалить, выделив его и нажав кнопку Удалить слой. Сгруппируем слои, то есть из отдельных частей сделаем одно целое. Выделим все слои и нажмём кнопку Изолировать. Получившийся слой Встроенный холст переименуем в Белый гриб. Теперь нам нужен фон для нашей сцены. Самый простой способ его создать — это загрузить уже готовый рисунок. Так мы и поступим. Загрузим файл фон.jpg, подгоним его под размеры холста (см. урок №2) и подложим его под наш гриб. Теперь нам нужно передвинуть гриб чуть ниже. Для этого выделяем слой Белый гриб и перетаскиваем его за зелёную (не за красную) точку в нужное место. Сохраняемся. Зелёная точка (Исходная точка) является центром всех слоёв, входящих в изолированный слой, и не обязательно будет находиться в видимой части рабочей области. Если перемещать слой за Исходную точку неудобно (например, она находится далеко от самого слоя, такое вполне может быть), то есть другой способ переместить объект — нужно выделить все точки, из которых он состоит и перетащить его за любую из них, зажав левую клавишу мыши. Теперь немного уменьшим гриб. Это можно сделать двумя способами. Первый способ — изменить параметр слоя Масштабирование. Поставим значение -1.0 и посмотрим результат. Отменим последнее действие командой Правка → Отменить в меню рабочей области и попробуем второй способ изменения размера слоя. На панели слоёв нажмём правой клавишей мыши на изолированный слой Белый гриб и выберем в появившемся контекстном меню команду Выбрать все вложенные слои. Выберем инструмент Масштабирование. В Параметрах инструмента оставляем галочку напротив Запереть соотношение сторон, чтобы размер менялся пропорционально. На холсте выделяем все точки гриба и, зажимая левую клавишу мыши, перетаскиваем любую точку, меняя размер, при этом, пока не отпускается левая клавиша мыши, мы можем наглядно видеть отличие нового размера от исходного. Перетащим уменьшенный гриб чуть пониже. Смотрим результат, сохраняемся, закрываем программу.

Урок №6. Копирование слоёв.

Урок №6. Копирование слоёв.
Открываем файл Моя_первая_анимация.sifz. Пришло время нарисовать глаза. Глаза будем делать одинаковые, то есть сначала рисуем один глаз, а потом его скопируем. Приступим. Ставим уТочки по контуру левого глаза, при необходимости редактируем параметры слоёв: Цвет заливки на чуть темнее белого и Толщину контура на 0.02u (см. урок №5). Переименуем слои в Левый глаз Контур и Левый глаз Область. Сохраняемся. Нарисуем зрачок. Для этого используем инструмент Окружности. В появившемся окне Параметры инструмента в верхнем поле вместо Circle пишем Зрачок. Перемещаемся на холст, ставим курсор мыши в центре глаза, зажимаем левую клавишу мыши и тянем её в сторону до края глаза. Перемещать зрачок можно, зажав центральную точку левой клавишей мыши и перетаскивая её. Для уменьшения или увеличения окружности используется зелёная точка на контуре справа от центра. В стопке слоёв переместим слой Зрачок ниже слоя Левый глаз Контур, а на холсте переместим его в нижнюю часть глаза и поменяем цвет на чёрный. Сохраняемся. Хотя на импортированном шаблоне на глазах нет век, необходимо их создать, чтобы гриб мог моргать — без этого анимация много потеряет. Выбираем инструмент Кривые, задаём светло-серый цвет заливки и рисуем веко. Созданные слои переименовываем в Левое веко Контур и Левое веко Область и помещаем их сверху других слоёв. Сохраняемся. Один глаз у нас полностью готов. Теперь выбираем одновременно все слои, относящиеся к глазу и нажимаем кнопку Создать копию слоя. Видим, что на панели слоёв появились дубликаты копируемых слоёв. На холсте мы пока не видим второго глаза, потому что он накладывается на первый. Выделяем на холсте все точки видимого глаза, зажав левую клавишу мыши и протаскивая курсор. Перетаскиваем глаз вправо за любую точку, зажав левую клавишу мыши. Переименуем слои передвинутого вправо глаза, заменив в названии слоёв слова Левый (Левое) на Правый (Правое) соответственно. Меняем масштаб холста так, чтобы можно было хорошо видеть весь гриб, и включаем видимость слоя Ножка Область. Смотрим на получившийся результат, сохраняемся, закрываем Synfig Studio.

Урок №5. Параметры слоя.

Урок №5. Параметры слоя.
Открываем файл Моя_первая_анимация.sifz. С помощью инструмента Кривые рисуем ножку гриба, предварительно поменяв Цвет заливки на белый (см урок №3). Переименовываем получившиеся слои соответственно в Ножка Контур и Ножка Область. Передвигаем их в стопке слоёв ниже слоёв Верх шляпки Контур и Верх шляпки Область. (см урок №4). Сохраняемся. Чтобы нарисовать глаза, нос и рот гриба по шаблону белый.jpg сделаем невидимым слой Ножка Область (см урок №4). Нарисуем нос гриба. В данном случае контур носа необязателен, поэтому удаляем его, выделив слой NewBLine005 Контур и нажав кнопку Удалить слой в нижней части панели слоёв. Переименовываем слой NewBLine005 Область в слой Нос и сохраняемся. Приступаем к созданию рта. Контур рта — губы — будет чёрного цвета, а заливку сделаем красной. Переименовываем нарисованные слои соответственно в Губы и Рот. Сохраняемся. Посмотрев на полученный результат, мы можем заметить, что рот выглядит не очень естественно. Что же нужно исправить? Попробуем поменять толщину губ, а заодно посмотрим, как можно изменять различные параметры уже созданных объектов. Закроем панель Слои и откроем панель Горизонтальный док: Слои, Потомки, Параметры. Переходим на вкладку Слои и выбираем слой Губы. В правой части окна, которая называется Параметры, мы можем видеть множество различных параметров настройки и редактирования выбранного слоя. Находим параметр Толщина контура и меняем его на значение 0,030000u. Смотрим на получившийся результат — утолщение линии губ. Сохраняемся. Теперь «закроем» рот гриба. Перемещаем уТочки (они красного цвета) так, чтобы красной области (рта) не было видно (губы сомкнуты). Сохраняемся и закрываем Synfig Studio.

Урок №4. Слои.

Урок №4. Слои.
Загружаем в Synfig Studio наш рабочий файл Моя_первая_анимация.sifz. С помощью инструмента Кривые рисуем (см. урок №3) нижнюю часть шляпки, изменив первоначально Цвет заливки на жёлтый. Не забываем сохраняться. Теперь нужно жёлтый низ шляпки «подложить» под коричневый верх. Подключаем панель инструментов Слои (Файл → Панели → Слои). Переносим его в удобное для нас место экрана и растягиваем до нужных размеров. Чтобы было удобнее работать со слоями, необходимо их переименовать. Выделяем слой, стоящий в панели слоёв в самом верху. В нашем случае он называется NewBLine002 Контур. На холсте он тоже выделится. Кликаем левой клавишей мыши по названию контура и переименовываем его в Низ шляпки Контур. Таким же образом переименовываем все слои соответственно в Низ шляпки Область, Верх шляпки Контур и Верх шляпки Область. Итак, чем меньше у слоя параметр Глубина, тем выше он оказывается в стопке слоёв. Мы можем менять глубину слоёв кнопками в виде синих стрелочек Поднять слой и Опустить слой, которые располагаются внизу панели Слои. Можно перемещать сразу несколько слоёв, выделяя их, используя клавишу Ctrl. Нам нужно поменять местами верх и низ шляпки. Выделяем слои Верх шляпки Контур и Верх шляпки Область и перемещаем их наверх. Обратим внимание, что наш шаблон в виде рисунка гриба — это слой с именем белый.jpg. Видимость любого слоя в любой момент можно выключить, сняв напротив него галочку. Сделаем невидимым слой белый.jpg и посмотрим на текущие результаты нашей работы. Вернём видимость слоя, сохранимся и закроем программу.

Урок №3.Инструмент Кривые, уТочки, Касательные

Урок №3.Инструмент Кривые, уТочки, Касательные
Запустим Synfig Studio и откроем файл Моя_первая_анимация.sifz (см. урок №2). Выбираем на панели инструментов инструмент Кривые. На экране появится окно Параметры инструмента. Если этого не произошло, выберем в меню программы Файл —> Панели —> Параметры инструмента. Оставляем галочки напротив опций Создать кривую контура, Создать кривую области и Связать начала координат. Наша задача — нарисовать шляпку гриба. В нижней части панели инструментов можно выбрать Цвет контура, Цвет заливки и Диаметр кисти. Щёлкнем один раз левой клавишей мыши по опции Цвет заливки и в появившемся окне Цвета двигаем ползунки трёх основных цветов таким образом, чтобы получился нужный нам цвет шляпки (получившийся цвет — это цвет верхней полоски под заголовком окна). Теперь можно приступать к нанесению опорных (управляющих) точек (уТочек) по контуру шаблона шляпки. Убеждаемся, что на панели инструментов выбран инструмент Кривые и начинаем ставить точки, нажимая левую клавишу мыши. Чтобы замкнуть контур, нажимаем на первую поставленную точку правой клавишей мыши и выбираем в выпавшем контекстном меню опцию Замкнуть контур. После этого выбираем на панели инструментов Инструмент трансформации и видим нарисованную шляпку. Чтобы сгладить угловатость контура, подводим курсор мыши к любой уТочке, и в тот момент, когда эта точка станет увеличенной зелёной, зажимаем левую клавишу мыши и отводим в сторону. К уТочке добавились две дополнительные точки, которые называются Касательными. При отдалении Касательных от родной уТочки линия контура становится плавной. Таким образом разделим все уТочки контура Щёлкнем левой клавишей мыши в любое место холста за выделенной областью (снятие выделения) и посмотрим на получившийся результат. Сохраняем файл, закрываем программу. Примечание. Если какая-то уТочка или Касательная оказалась ненужной и вы хотите её удалить, то нажмите на неё правой клавишей мыши и выберите в контекстном меню строку Удалить узел (Умно). Если же, наоборот, в каком-то месте контура уТочка необходима, щёлкните по нужному месту контура правой клавишей мыши и нажмите Вставить узел (Умно).