Типы анимации в компьютерной графике. Компьютеры превосходят человека. Проигрывание анимации: свойство animation-play-state

• Tutorial

В этой статье поговорим о 2D анимациях в Unity. Я расскажу о своем опыте работы с родными анимациями в юнити, о том, насколько тайм-лайны похожи на флэшевские, об управлении анимациями, event"ах, вложенности, и о том, как художник справляется с анимированием.

Для начала, немного теории.

В Unity есть две сущности:

1. Анимация (то, что отображается в окно «Animation»)
2. Mechanim дерево анимаций (то, что отображается в окне «Animator»).

Ниже я немного расскажу, что это такое и как нам может приходиться (или не пригодиться).

Animation

Кстати, несмотря на то, что у каждой анимации есть FPS (поле «sample»), сами анимации к FPS не привязаны. Они привязаны ко времени. Т.е. если вы делаете анимацию с 5 FPS, где у вас объект двигается из точки А в точку Б с помощью задания двух ключевых кадров в начале и в конце, то в игре этот объект не будет двигаться ступеньками с 5 FPS. Анимация рассчитывается каждый кадр игры, а FPS внутри анимации сделан лишь для вашего удобства, чтобы вам не частить кадры.

Animator

Кроме того, вы можете создавать дерево этих анимаций с морфингом между ними. Т.е. если у вас есть персонаж, анимированный перекладками (когда каждая часть тела - отдельный спрайтик, который вы вращаете/двигаете), то вполне можно сделать анимацию ног отдельно, анимацию рук - отдельно. А потом (с помощью мышки) настроить условие, что от скорости движения вашего объекта, mechanim аниматор будет включать либо анимацю ног «ходьба», либо «бег». А стрелять ваш персонаж будет отдельной анимацией, которая никак не связана со скоростью переставления ног.

В самом же просто случае, ваш аниматор будет выглядеть так:

Начинаем шаманить.

Мой конкретный случай - у нас есть сугроб снега, в котором сидит заяц. Сугроб сам по себе шевелится:

1. сугроб, шевелясь, двигается влево
2. из сугроба выглядывает заяц (анимация пульсации останавливается):

3. сугроб двигается вправо

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

Но такой вариант мне не нравится его жесткостью. В первую очередь я считаю неправильным, что в таком варианте покадровая анимация вылезающего кролика оказывается на том же таймлайне, что и движение сугроба. Это значит, что если мы захотим сделать вариацию этой анимации, где сугроб будет двигаться по другой траектории, мы должны будем заново анимировать вылезание зайца. А если мы потом это самое вылезание захотим поправить, то нам придется делать это во всех анимациях, где оно используется.

Хотелось бы большей гибкости.

Есть другой вариант. Мы анимируем выглядывание зайца в отдельном объекте (так же, как мы сделали это с шевелением сугроба), а в основном тайм-лайне просто включаем этот объект (active) в нужный момент и анимация начинается.

Это уже гораздо лучше, но все равно не идеально. Ведь в таком случае мы должны в нашем основном таймлайне знать, какой длины анимация этого вылезания. Чтобы включить и отключить ее в нужный момент. А что если мы опять-таки поменяем эту анимацию и заяц будет дольше смотреть по сторонам? Да и вообще, в каких-то более сложных случаях нам будет еще сложнее уместить все в один таймлайн.

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

То есть сделать так:

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

Что нам для этого понадобится? Unity позволяет добавлять на анимацию вызов кастомных юзер event"ов. Это именно то, что нам нужно! Осталось только правильно все написать.

Первое, что нам понадобится, это написать простой компонент (в нашем случае он называется GJAnim) и повесить его на тот же объект, на котором висит наш аниматор. Именно методы этого компонента мы сможем вызывать событиями с таймлайна.

Напишем метод для постановки на паузу. Кстати, в юнити нет такой прямой возможности. Для того, чтобы поставить на паузу анимацию, обычно применяется немного грязный хак с выставлением ее скорости в 0. Он в целом работает, правда, странности есть (об этом - в последней части статьи).

Public void Pause() { _animator.speed = 0; } protected void Resume() { _animator.speed = 1; }
Где _animator - это переменная, в которой мы закешировали компонент " Animator ":

Animator = GetComponent();

Если вы обратили внимание на скрин выше, над ключевым кадром, который я пометил цифрой «2» стоит небольшая вертикальная черта. Именно за ней скрывается вызов события (метода) «Pause»:

Стоит отметить, что в такие события можно даже передавать параметр. Поддерживаются string, float и объект из библиотеки (не со сцены).

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

Public void ResumeParent() { Transform pr = transform; while (true) { pr = pr.parent; if (pr == null) { Debug.LogWarning("No GJAnim found in parents!"); return; } GJAnim a = pr.gameObject.GetComponent(); if (a != null) { a.Resume(); return; } } }

Этот метод ищет среди родителей компонент " GJAnim " и снимает его с паузы. Соответственно, ставим это событие на окончание анимации нашего кролика:

Profit!

Кроме того, все делается в пределах юнитевского UI и достаточно прозрачно для любого аниматора. Наш художник через час попадания ему в руки этого инструмента, уже во всю анимировал.

О багах Unity и сумасшествии.

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

Так вот, мы заметили, что кадры иногда проскакивают.

Долго-долго дебажили, много писали в лог… и вот что выяснили:

По видимому, в юнити есть какой-то стэк кадров/событий анимаций. И когда компьютер (редактор unity) подтормаживает, он может положить в этот стек сразу два кадра, чтобы в следующую итерацию выполнить их оба.

Это влечет за собой чуть ли не полностью неисправимый фейл. Мы ловили ситуацию, когда аниматор выполнял все действия с кадром и вставал на паузу (это ок), а потом в этот же кадр выполнял еще и следующий кадр. То есть за один кадр рассчитывал сразу два кадра анимации. И то, что в 1-м кадре было событие, ставящее скорость анимации в 0, не мешало ему рассчитать еще и следующий кадр, который, по видимому, уже лежал в стеке.

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

На данный момент проблема выглядит неисправимой. Как мы справились? Поставили FPS таких анимаций в 20. Видимо, на таком FPS"е случая, когда юнити хочет просчитать два кадра за одну итерацию - не случается.

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

Что с этим делать - не ясно.

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

CSS3-анимация может применяться практически для всех html-элементов, а также для псевдоэлементов:before и:after . Список анимируемых свойств приведен на странице. При создании анимации не стоит забывать о возможных проблемах с производительностью, так как на изменение некоторых свойств требуется много ресурсов.

Введение в CSS-анимацию

Поддержка браузерами

IE: 10.0
Firefox: 16.0, 5.0 -moz-
Chrome: 43.0, 4.0 -webkit-
Safari: 4.0 -webkit-
Opera: 12.1, 12.0 -o-
iOS Safari: 9, 7.1 -webkit-
Opera Mini: —
Android Browser: 44, 4.1 -webkit-
Chrome for Android: 44

1. Ключевые кадры

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

Ключевые кадры указываются с помощью правила @keyframes , определяемого следующим образом:

@keyframes имя анимации { список правил }

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

@keyframes shadow { from {text-shadow: 0 0 3px black;} 50% {text-shadow: 0 0 30px black;} to {text-shadow: 0 0 3px black;} }

Ключевые кадры создаются с помощью ключевых слов from и to (эквивалентны значениям 0% и 100%) или с помощью процентных пунктов, которых можно задавать сколько угодно. Также можно комбинировать ключевые слова и процентные пункты. Если кадры имеют одинаковые свойства и значения, их можно объединить в одно объявление:

@keyframes move { from, to { top: 0; left: 0; } 25%, 75% {top: 100%;} 50% {top: 50%;} }

Если 0% или 100% кадры не указаны, то браузер пользователя создает их, используя вычисляемые (первоначально заданные) значения анимируемого свойства.

Если несколько правил @keyframes определены с одним и тем же именем, сработает последнее в порядке документа, а все предыдущие проигнорируются.

После объявления правила @keyframes , мы можем ссылаться на него в свойстве animation:

H1 { font-size: 3.5em; color: darkmagenta; animation: shadow 2s infinite ease-in-out; }

Не рекомендуется анимировать нечисловые значения (за редким исключением), так как результат в браузере может быть непредсказуемым. Также не следует создавать ключевые кадры для значений свойств, не имеющих средней точки, например, для значений свойства color: pink и color: #ffffff , width: auto и width: 100px или border-radius: 0 и border-radius: 50% (в этом случае правильно будет указать border-radius: 0%).

1.1. Временная функция для ключевых кадров

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

Пример

@keyframes bounce { from { top: 100px; animation-timing-function: ease-out; } 25% { top: 50px; animation-timing-function: ease-in; } 50% { top: 100px; animation-timing-function: ease-out; } 75% { top: 75px; animation-timing-function: ease-in; } to { top: 100px; } }

Пять ключевых кадров указаны для анимации с именем «bounce». Между первым и вторым ключевым кадром (то есть между 0% и 25%) используется функция замедления. Между вторым и третьим ключевым кадром (то есть между 25% и 50%) используется функция плавного ускорения. И так далее. Элемент будет перемещаться вверх по страницу на 50px , замедляясь по мере того, как он достигает своей наивысшей точки, а затем ускоряясь, когда он падает до 100px . Вторая половина анимации ведет себя аналогичным образом, но только перемещает элемент на 25px вверх по странице.

Временная функция, указанная в ключевом кадре to или 100% , игнорируется.

2. Название анимации: свойство animation-name

Свойство animation-name определяет список применяемых к элементу анимаций. Каждое имя используется для выбора ключевого кадра в правиле, которое предоставляет значения свойств для анимации. Если имя не соответствует ни одному ключевому кадру в правиле, нет свойств для анимации, отсутствует имя анимации, анимация не будет выполняться.

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

Имя анимации чувствительно к регистру, не допускается использование ключевого слова none . Рекомендуется использовать название, отражающее суть анимации, при этом можно использовать одно или несколько слов, перечисленных через дефис - или символ нижнего подчеркивания _ .

Свойство не наследуется.

Синтаксис

Animation-name: none; animation-name: test-01; animation-name: -sliding; animation-name: moving-vertically; animation-name: test2; animation-name: test3, move4; animation-name: initial; animation-name: inherit;

3. Продолжительность анимации: свойство animation-duration

Свойство animation-duration определяет продолжительность одного цикла анимации. Задаётся в секундах s или миллисекундах ms . Если для элемента задано более одной анимации, то можно установить разное время для каждой, перечислив значения через запятую.

Свойство не наследуется.

Синтаксис

Animation-duration: .5s; animation-duration: 200ms; animation-duration: 2s, 10s; animation-duration: 15s, 30s, 200ms;

4. Временная функция: свойство animation-timing-function

Свойство animation-timing-function описывает, как будет развиваться анимация между каждой парой ключевых кадров. Во время задержки анимации временные функции не применяются.

Свойство не наследуется.

Синтаксис

Animation-timing-function: ease; animation-timing-function: ease-in; animation-timing-function: ease-out; animation-timing-function: ease-in-out; animation-timing-function: linear; animation-timing-function: step-start; animation-timing-function: step-end; animation-timing-function: cubic-bezier(0.1, 0.7, 1.0, 0.1); animation-timing-function: steps(4, end); animation-timing-function: ease, step-start, cubic-bezier(0.1, 0.7, 1.0, 0.1); animation-timing-function: initial; animation-timing-function: inherit;

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

5. Повтор анимации: свойство animation-iteration-count

Свойство animation-iteration-count указывает, сколько раз проигрывается цикл анимации. Начальное значение 1 означает, что анимация будет воспроизводиться от начала до конца один раз. Это свойство часто используется в сочетании со значением alternate свойства animation-direction , которое заставляет анимацию воспроизводиться в обратном порядке в альтернативных циклах.

Свойство не наследуется.

Синтаксис

Animation-iteration-count: infinite; animation-iteration-count: 3; animation-iteration-count: 2.5; animation-iteration-count: 2, 0, infinite;

6. Направление анимации: свойство animation-direction

Свойство animation-direction определяет, должна ли анимация воспроизводиться в обратном порядке в некоторых или во всех циклах. Когда анимация воспроизводится в обратном порядке, временные функции также меняются местами. Например, при воспроизведении в обратном порядке функция ease-in будет вести себя как ease-out .

Свойство не наследуется.

Чтобы определить, является ли повтор цикла анимации четной или нечетной — количество повторов начинается с 1 .

Синтаксис

Animation-direction: normal; animation-direction: reverse; animation-direction: alternate; animation-direction: alternate-reverse; animation-direction: normal, reverse; animation-direction: alternate, reverse, normal; animation-direction: initial; animation-direction: inherit;

7. Проигрывание анимации: свойство animation-play-state

Свойство animation-play-state определяет, будет ли анимация запущена или приостановлена. Остановка анимации внутри цикла возможна через использование этого свойства в скрипте JavaScript. Также можно останавливать анимацию при наведении курсора мыши на объект — состояние:hover .

Свойство не наследуется.

Синтаксис

Animation-play-state: running; animation-play-state: paused; animation-play-state: paused, running, running; animation-play-state: initial; animation-play-state: inherit;

8. Задержка анимации: свойство animation-delay

Свойство animation-delay определяет, когда анимация начнется. Задается в секундах s или миллисекундах ms .

Свойство не наследуется.

Синтаксис

Animation-delay: 5s; animation-delay: 3s, 10ms;

9. Состояние элемента до и после воспроизведения анимации: свойство animation-fill-mode

Свойство animation-fill-mode определяет, какие значения применяются анимацией вне времени ее выполнения. Когда анимация завершается, элемент возвращается к своих исходным стилям. По умолчанию анимация не влияет на значения свойств, когда анимация применяется к элементу — animation-name и animation-delay . Кроме того, по умолчанию анимация не влияет на значения свойств после ее завершения — animation-duration и animation-iteration-count . Свойство animation-fill-mode может переопределить это поведение.

Свойство не наследуется.

Синтаксис

Animation-fill-mode: none; animation-fill-mode: forwards; animation-fill-mode: backwards; animation-fill-mode: both; animation-fill-mode: none, backwards; animation-fill-mode: both, forwards, none;

10. Краткая запись анимации: свойство animation

Все параметры воспроизведения анимации можно объединить в одном свойстве — animation , перечислив их через пробел:

Animation: animation-name animation-duration animation-timing-function animation-delay animation-iteration-count animation-direction;

Для воспроизведения анимации достаточно указать только два свойства — animation-name и animation-duration , остальные свойства примут значения по умолчанию. Порядок перечисления свойств не имеет значения, единственное, время выполнения анимации animation-duration обязательно должно стоять перед задержкой animation-delay .

11. Множественные анимации

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

Div {animation: shadow 1s ease-in-out 0.5s alternate, move 5s linear 2s;}

Создание 2D-мультфильма в KINESKO это:

Цена 2D-анимации зависит от таких факторов

1. Хронометраж ролика.
2. Сложность анимации. Чем детальней прорисовка, тем выше цена 2D-анимации.
3. Наличие дополнительных услуг (озвучка, продвижение и т.д.).

Этапы создания 2D-анимации

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

2. Следующий этап изготовления 2d-анимации - разработка дизайна персонажей . Она начинается с нарисованного художником наброска, который позже дорабатывают и упрощают. Художник придумывает внешний вид персонажей, их эмоции и даже произносимые ими звуки.

3. Затем мы приступаем к созданию раскадровки , предварительной визуализации ролика. Она позволяет аниматорам понять, как должен выглядеть итоговый ролик (ракурс, вид и поведение персонажей, и т.д.).

4. Раскадровку используют, чтобы создать ключевые кадры ролика . После их прорисовки начинается работа над созданием промежуточных кадров (фазовка). Параллельно рисуются задние планы .

5. После того, как работа над производством 2D-анимации завершена, остается озвучка и добавление звуковых эффектов .

С услугой 2D-анимации заказывают

Почему вам нужно сделать 2D-анимацию

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

2. В 2D-анимации применяют больше визуальных эффектов, чем в 3D, что сильно ускоряет работу .

3. Анимация персонажа в 2D-роликах стоит дешевле , чем в объемных.

4. В 2D-анимации информацией можно наполнить весь экран. Тогда как в 3D-роликах ориентиры в п ространстве отбирают часть экран и сокращают число рабочих пикселей.

5. У объемных персонажей волосы могут «утонуть» в текстуре головы, а уши - пройти сквозь шляпу. С 2d-анимированными персонажами таких проблем не возникает.

1. «Резиновый» герой. Тела нарисованных персонажей часто сжимаются и растягиваются. И все же объем тела должен оставаться одинаковым.

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

3. Сценичность. Позы и мимика анимационных персонажей должны быть просты и выразительны.

4. Бесконечное движение. Даже если двухмерный персонаж статичен, второстепенные элементы должны быть в перманентном движении.

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

6. Карикатурность. Анимация и реализм - трудно совместимые вещи. Счастливый персонаж должен сиять, словно солнце, а сердитый - выглядеть, как готовый взорваться котел.

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

Как сделать анимационного персонажа миловидным?

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

Эволюция создания двухмерной анимации

1. «Пароход Вилли» (1928) - это первый звуковой мультфильм. Также это третий мультфильм, в котором появляется Микки Маус.

2. «Белоснежка и семь гномов» (1937) стала первым полнометражным цветным мультфильмом. За передовые достижения она даже получила Оскара.

3. «Мэри Поппинс» (1964) не является первым фильмом, где реальная картинка совмещена с анимацией. Тем не менее, это главный пример использования подобной технологии, без которого не было бы «Кто подставил кролика Роджера» и других известных фильмов.

4. «Приключения кота Фрица» (1962) - это первый мультфильм, получивший возрастной рейтинг X. Из-за сцен эротики и насилия его никогда не показывали по телевизору, однако он стал отправной точкой в истории взрослой анимации.

5. «Акира» (1988) вышла уже после того, как Хаяо Миядзаки основал свою знаменитую студию «Гибли». Но именно она послужила толчком для популяризации аниме в Америке и остальном мире, открыв дорогу фильмам вышеупомянутого Миядзаки, «Евангелиону» и многим другим.

6. «Медвежонок Винни и его друзья» стал последним рисованным мультфильмом студии Disney, ознаменовав собой конец целой эпохи.

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

• Традиционная анимация.
• 2D векторная анимация.
• 3D компьютерная анимация.
• Графика движения.
• Стоп моушен.

Традиционная анимация

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

Этот процесс может быть довольно дорогостоящим и продолжительным, так как аниматорам приходится создавать набор различных кадров, исходя из частоты 24 кадра в секунду. Данный метод используется в основном на ПК, а также планшетах с применением специальных компьютерных программ, позволяющих создавать анимацию в стиле старых диснеевских мультфильмов.

2D векторная анимация

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

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

3D компьютерная анимация

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

Это также называется генерируемые компьютером изображения (CGI ). Они возникают, когда компьютерные аниматоры создают поток изображений, которые сводится воедино, чтобы сформировать анимацию. Объединение динамических и статических изображений выполняется с использованием компьютерной графики. Персонажи, созданные в 3D, в цифровом формате отображаются на экране, а затем объединяются с каркасом, что позволяет анимировать каждую модель по-разному.

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

Кроме этого много времени уходит на работу с кривыми, представляющими различные части объекта в разные периоды времени. В 3D-анимации должны учитываться все персонажи, даже те которые в определенный момент времени чем-то перекрыты и не видны.

Основное различие между этими видами анимации заключается в том, что в традиционной и 2D анимации художник работает с отдельными кадрами, в то время как в 3D-анимации всегда существует непрерывный поток. Если он останавливается, это воспринимается, как ошибка. Даже когда персонаж остается на месте, всегда существует непрерывный поток кадров, который создает иллюзию реальности.

Графика движения

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

Это процесс, в котором используется »размножение » анимируемых кадров для создания плавного движения между кадрами. Программы для «размножения » кадров поддерживают скрипты, которые автоматически изменяют анимацию для создания многочисленных эффектов.

3D-композиции создаются из плоских элементов, перемещающихся друг относительно друга, что создает иллюзию объема. Они также могут сопровождаться звуковыми эффектами или музыкой. Такие объекты часто используются в мультимедийных проектах.

Stop-motion

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

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

“2D анимация мертва” . Мы слышим эту фразу везде и повсюду, несмотря на недавние короткометражные проекты, которые были номинированы на Оскар.

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

2Д анимация страсть моей жизни, которая идет со мной бок о бок уже много лет. За время своей карьеры я осознал, что нужно научиться смотреть на любую ситуацию под разными углами. Раз люди говорят “2D анимация мертва” – мы должны знать ПОЧЕМУ они так говорят, а так же понять, чем это хорошо и чем плохо. В этой статье нет гипербол накруток. Только сухие факты. Приступим.

1. 3Д проще.

Да, есть аниматоры которые с пеной у рта будут доказывать вам, что 3Д анимация НЕ проще 2Д, пока вы не выбежите из комнаты и не спрячетесь в безопасном месте. Но прошу вас, рассмотрите и мою точку зрения.

Анимация – это анимация. Это не стиль, и даже не тип (2д, 3д, стоп-моушн и тд). Несмотря на ту среду, в какой вы анимируете, вы будете использовать одни и те же принципы, что в 2д, 3д, 5д, и в любых других Д. Поэтому, БУКВАЛЬНО ни одна из форм анимации не сложнее и не проще. Это субъективный показатель. Потому мы должны обратить внимание на ПРОЦЕСС.

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

Для того, чтобы применить свои знания в 3д, ей понадобится изучить 3Д софт. Изучение нового софта – сложная задача, но выполнимая. Посещая, например, некие курсы и изучая некую литературу, наш гипотетический аниматор сможет применить свои теоретические супер-знания в 3д пространстве.

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

Не верьте моим словам, проверьте их.

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

Нет, я не говорю, что 3д анимация это прямо легко, так как напомню – анимация – есть анимация. Это умение, необходимое для оживления и передачи изображения на экран. Одно требует уверенного пользования ПО, другое мастерского умения рисовать, такого, чтобы Да Винчи отложил перо и выбросил свои работы в урну от зависти.

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

Конечно, мы можем использовать различные технические приемы чтобы облегчить некие моменты, но тогда мы должны спросить себя: СТОИТ ЛИ?

2. Компьютеры превосходят человека.

У нас уже разжегся неплохой костер? Подбросим же еще дровишек.

Простой факт: компьютер способен делать что либо на таком уровне детализации и совершенства, что ни один человек не способен делать так же. Не верите мне? Попробуйте сделать так вручную:

Одни могут спорить: “Ну, в 2д просто не делают кадры такого типа. Там делается по-другому.” Тогда остается вопрос: Почему? Зачем и почему мы должны ограничивать себя в чем-то, когда технологии уже здесь, в ваших руках, и могут позволить вам безграничные возможности. Зачем возвращаться назад и делать то, что делать сложнее, еще и в ограниченном формате? Почему не принять будущее, и не жить в прошлом?

Это вопросы, на которые должен дать ответ любой аниматор, вне зависимости от того как и где он использует свои навыки. Мы ДОЛЖНЫ спросить: “Это лучший способ? Сможем ли мы таким способом лучше рассказать историю (ведь именно она важнее всего)? Будет ли контакт между персонажем и зрителем установлен лучше? Помогут ли кадру эти красивые реалистичные волны, или стоит их приглушить, ведь несмотря на свою красоту и крутизну они отвлекают?”

Использование технологий ради самих технологий – бесплодная затея. То же самое делать вещи “по-старому”, потому что раньше так делали. Если новый способ превосходит старый, если он дает вам новые возможности, то отказ от него глупая затея ради чувства ностальгии. Как художники/техники мы ДОЛЖНЫ ЗНАТЬ, ПОЧЕМУ МЫ ВЫБИРАЕМ ту или иную технику/метод/способ/среду для достижения своих целей, и этот выбор никогда не должен быть ” потому что кто-то когда-то так делал”. быть вдохновленными нашими наставниками, “художественными предками” – это замечательно. Но сравнивание себя с ними, или еще хуже, попытки стать ими – верный способ облажаться. Они – это они, а мы – это мы.

3. Компьютеры превосходят человека. (точность)

Я спросил у одного из крутейших аниматоров современности Тома Банкрофта о том, “Что делает 3Д анимацию лучше” и получил такой ответ:

“Одна вещь, которую 3Д анимация (и, безусловно, люди стоящие за ней) делает лучше 2Д – это точность (аккуратность). Я бы сказал, экстремальная точность. Я работал над некоторыми такими сценами в одном из самых точных фильмов 20 века Дисней: Покахонтас (например, когда она думает о своей умершей матери). Я могу засвидетельствовать, что даже с самыми лучшими промежуточными кадрами с самым лучшим клин апом, невероятно сложно показать, что персонаж еле двигается в течение длительного периода времени, особенно учитывая последующий показ на действительно больших экранах, где все-все видно. А во времена 2Д анимации в Диснее мы не могли позволить себе использовать один и тот же лист с персонажем, иначе он становился не живым и сливался с фоном. А в компьютерной анимации это сделать не проблема. Еле двигать что-либо стало легко. Никаких дрожащих линий. Многие лучшие CG аниматоры активно используют эту возможность. И в тоже время CG аниматоры часто используют 2Д анимацию для предварительного просмотра. И в этом, определенно есть смысл.

Качнулся ли маятник нашего искусства слишком далеко? Да, думаю, именно это мы сейчас и видим. Ультра реалистичная анимация, которая напоминает своей правдоподобностью игровое кино, и следовательно, в ней теряется та магия, что лежит в центре анимационного искусства.”

Том подметил очень важный момент: “3Д анимация (и, безусловно, люди стоящие за ней)”. Очень многие (не художники) думают, что компьютер делает всю работы за нас. Когда я говорю, что компьютеры превосходят человека, я говорю о том, что компьютер, в качестве инструмента, имеет большую степень точности. Это позволяет аниматорам делать то, что не может карандаш. А как уже было сказано, анимация – это анимация, не смотря ни на что.

4. Изменения опережают нас.

Предположим, у вас есть сцена в 3Д и ваш режиссер вдруг понимает, что ее лучше бы показать с высоты птичьего полета, а не с точки зрения червяка, как это есть сейчас. В 3Д провернуть такую махинацию можно без проблем! Небольшая корректировка уже имеющейся камеры и вуаля. А в 2Д? Вам остается лишь швырнуть стулом в ближайшего сценариста. В 2Д аниматору придется не просто переделать сцену, а начать все с чистого листа. Буквально. Новые скетчи, тонны зарисовок, поиск оптимального угла зрения на сцену…вместо того, чтобы просто незначительно откорректировать виртуальную камеру как делают сейчас в 3Д. Так что вносить правки, которые неминуемо следуют за сценарием, будет не только быстрее, но и дешевле для производства.

5. 3Д реальней.

Выйдем немного за рамки этой статьи. Подготавливая материал, я опросил некоторых своих коллег, почему, гипотетически, 3Д – это единственное развитие будущей анимации. Некоторые из опрашиваемых были аниматорами, и они спросили, не больной ли я на голову. Некоторые были просто энтузиастами, Один, однако, был просто моим другом, который связан с анимацией исключительно креслом и попкорном в кинотеатре, в который я его приглашал. Помимо детства он редко когда-либо проявлял инициативу в сторону просмотра какого-либо мультфильма. Я спросил, смотрел ли он “Холодное сердце”? Нет. А “Город Героев” или “Как приручить дракона 2”? Нет. Я даже не стал спрашивать, видел ли он “Сказание о принцессе Кагуя”. Он смотрел мультсериал Геркулес, так как является поклонником греческой мифологии, но признался, что не получил удовольствия от просмотра самого фильма.

На мой вопрос: “Почему 3Д?” его ответ был очевиден и просто до безобразия – она реалистичней. для него, 3Д анимация “размывает границы между реальностью и фантазией”, и для него это способ теоретически воплотить некоторые свои фантазии.

А если спросить любого 2Д аниматора тот же вопрос, они расскажут, что реальным происходящее делают убедительные персонажи, и в этом они превосходят любые технологии, дизайн и модели (3Д). Но проблема в том, что в кинотеатры ходят не аниматоры. Залы наполнены различными людьми, которые понятия не имеют о том, как сделана и устроена анимация. Для них “3Д анимация реальней”.

Можно сколько угодно оспаривать этот факт с точки зрения творческого человека, который непосредственно знаком с процессом/историей и тд анимации. Но нужно всегда помнить о ЦЕЛЕВОЙ АУДИТОРИИ.

Как я уже упоминал, при написании этой статьи я побеседовал с разными людьми из разных областей. Charles Kenny – автор сайта AnimationAnomaly.com поделился интересной точкой зрения, о которой я никогда раньше не задумывался: Инфраструктура.

“Традиционная анимация, которая находится под постоянным давлением CG, не имеет даже приблизительно таких же внушительных капиталов и технических разработок. Если вы, как инвестор, хотите вложиться в рендер ферму или в разработку ПО, то вы заинтересованы в том, чтобы ваш продукт был многоразовым, что соответствует 3Д анимации.”

Samantha Youssef из Studio Technique в своей предстоящей книге “Движения и Формы” так же сказала:

“В конечном счете, я считаю, что 3Д более эффективна с точки зрения ведения бизнеса, а индустрия – это в первую очередь бизнес, а не искусство. Сколько бы замечательных художников не работали в этой индустрии, какие бы шедевральные проекты не разрабатывались, мотивация всегда будет одна – деньги.”

Вышесказанное является жирной точкой с точки зрения логики. (Да-да, мы художники часто игнорируем логику, но она существует, поверьте). Сегодня студии закладывают гораздо больше сил, инвестиций, надежд в 3Д производство.

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

Ни одно принятое решение не позволит уже созданным дорогостоящим софтам, рендер-фермам и технологиям собирать пыль пока аниматоры будут точить свои карандаши. И хотите вы это признать или нет, наша индустрия – это бизнес, и лишь потом искусство. Если 3Д инструментарий уже здесь, инфраструктура налажена, и рабочий процесс отточен, то почему бы им ГРАМОТНО не воспользоваться?

Подведем итоги.

Когда я начал собирать материал для этой статьи, я делал это лишь потому, что я стопроцентный фанат 2Д и мне было интересно посмотреть на ситуацию под другим углом. К концу своего исследования я почти убедил себя, что стоит почтить память 2Д и не ждать, когда она будет медленно умирать у нас на руках.

Но все же.

Как вы видите, есть одна причина, которая отказывается капитулировать из недр моего разума, относительно того, что 2Д must go on. По сравнению с предоставленными выше фактами она абсолютно нелогична и иррациональна. Тем не менее, это наиболее убедительная причина:

2Д АНИМАЦИЯ = ЛЮДИ.

Я посмотрел и полюбил многие анимационные 3Д фильмы. Они были убедительными, с богатым визуалом и внутренним миром. Однако, я никогда не чувствовал в них столько “человека”, сколько чувствовал в 2Д анимации.

Отдавая машине некий контроль над происходящим, я искренне верю, что мы теряем частичку души в финальном продукте. Безусловно, есть многие, кто не согласится со мной (но в этой статье можно оспаривать любое мое слово=)), сказав, что компьютер лишь инструмент, как до него был карандаш, до которого был уголек от костра и стены пещеры. Это справедливое замечание, и я его принимаю. В тоже время, будут аниматоры, утверждающие, что “101 далматинец” и “Книга джунглей” были вершиной анимации благодаря сырым линиям аниматора, которые не были зачищены до машинной точности.

Люди неидеальны. И на мой взгляд, именно благодаря нашим изъянам мы создаем то великое, что мы создаем. И есть вещи, которые может сделать идеально лишь неидеальный человек. Живые линии рисунка, неровные края, “ошибки” как могут сказать некоторые – это именно то, что привлекает меня в 2Д анимации. Вы смотрите гораздо глубже этих самых линий, форм и пятен.

Звучит сопливо? Потому что такие мы есть. Люди. Мы человечны, и нам свойственны такие чувства как любовь, ненависть и тонна других сложнейших чувств. Убрав этот элемент, даже просто позволив компьютеру сделать работу “чисто” мы теряем 2Д, и то, что таится в нем. Именно этот аргумент всегда будет на чаше моих весов “За 2Д и против 3Д”. Пока живы мы, те кто знают и помнят 2Д анимацию в ее лучшие годы, будет жива и она.