Основы создания 2д анимации на примере

---

По кадровая, ручная рисовка + возможности "высоких технологий".

Здесь я расскажу именно об принципе создания анимации в 2д, о том как совмещать ручную по кадровую рисовку с программным движением. Я не буду рассказывать об интерфейсе какой-либо программы, куда нужно тыкать/нажимать или т.п.

Погнали:
В основе любой 2д анимации есть 2 типа движения, а из них уже создается все остальное:

1. Программное движение объекта: когда вы задаете начальную и конечную точки, а промежуточные кадры высчитываются автоматически (собсно это и есть High tech)
2. По кадровая рисовка вручную

Программное движение объекта:
Чтобы хорошо понять суть современной 2д анимации, представьте себе слои на которых вы рисуете - как прозрачные листы:


Допустим мы хотим нарисовать машинку едущую по дороге (вид сверху). В таком случае, на первом листе мы рисуем дорогу, на втором машинку:


Наложив их друг на друга, получаем общую картину - машинка на дороге. Далее нужно сымитировать движение. Для этого, мы сделаем так, чтобы лист с дорогой постепенно уходил вниз, имитируя тем самым "езду" машинки. Мы зададим для слоя с дорогой - начальное и конечное положение, а также время за которое он должен переместиться. Все остальное за нас посчитают:


Нечто похожее на езду у нас уже есть. Доработаем анимацию, добавим к дороге ещё один лист, теперь у нас всего будет - 3 листа:


Анимация дороги готова, но не забываем, что мы можем также двигать и слой с машинкой! Давайте сделаем её немного более живой. И ещё один момент: движение для слоев можно задавать не только по горизонтали или вертикали, их можно двигать, крутить, масштабировать, сплющивать, добавлять фильтры, маски и ещё много чего.


Такой способ анимации довольно простой и самое главное - быстрый, в плане создания. Так как от аниматора требуется всего лишь задавать начальные и конечные параметры для слоев. (Ну разве не высокие технологий?)

По кадровая рисовка вручную:
Этот же способ применяется там, где средствами программного движения добиться нужного эффекта - невозможно. Например: взгляд на объект под разным углом.

Итак, допустим мы хотим сделать, чтобы наша машинка "раскачивалась" при езде. Для этого, мы вручную рисуем каждый кадр:


Помещаем раскачивающуюся машинку в двигающийся лист 1:

Мы только-что объединили оба способа анимации!

Но на этом дело не ограничивается, сейчас у нас есть 3 листа, которые двигаются сами по себе. Эти три листа можно поместить "внутрь" другого - четвёртого листа. Он может быть чем угодно, от заднего фона до человеческого зрачка. В нашем случае это - телевизор с захватывающим блок бастером в эфире:


Вот и вся магия 2д. Такой принцип "по кадровой + программной" анимации используется везде, от игр до аниме.