§ 9. Покадровая анимация

Определения и обозначения

Анимация — последовательная смена изображений, создающая впечатление движения. Одно неподвижное изображение показывает объект только в одном состоянии, а анимация передаёт изменение этого состояния во времени. Поэтому она нужна, когда требуется показать действие, перемещение или превращение.

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

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

Частота кадров — число кадров, показываемых за одну секунду. Её измеряют в кадрах в секунду: например, 12 кадров/с означает показ двенадцати изображений за секунду. При большем значении движение обычно выглядит плавнее и та же последовательность заканчивается быстрее.

Как это устроено

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

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

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

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

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

Параметры покадровой анимации

При анализе анимации сначала определите, какой параметр изменён, а затем посмотрите на результат. Например, рывки чаще связаны с большими различиями между кадрами, а слишком быстрое действие — с высокой частотой. Для расчёта длительности разделите число кадров на частоту кадров.

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

Разбор задач

Задача 1. Прыгающий мяч

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

1. Первым помещаем мяч в нижнее положение, с которого начинается действие.
2. Вторым показываем мяч выше, чтобы обозначить подъём, а третьим — в верхней точке.
3. Четвёртым размещаем мяч ниже верхней точки, показывая начало опускания, и воспроизводим кадры в порядке 1–2–3–4.

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

Задача 2. Рывки мяча

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

1. Сравниваем два соседних кадра и определяем, на какое расстояние мяч перескакивает.
2. Добавляем между ними один или несколько кадров, постепенно размещая мяч по пути.
3. Просматриваем фрагмент снова и при необходимости уменьшаем смещение между дополнительными кадрами.

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

Задача 3. Длительность анимации

Анимация состоит из 24 кадров и воспроизводится с частотой 12 кадров в секунду. Чтобы найти длительность, нужно выяснить, сколько групп по 12 кадров содержится в 24 кадрах. Затем сравним результат с воспроизведением тех же кадров при частоте 6 кадров в секунду.

1. Используем формулу: длительность = число кадров ÷ частота кадров.
2. При частоте 12 кадров/с получаем: 24 ÷ 12 = 2 секунды.
3. При частоте 6 кадров/с получаем: 24 ÷ 6 = 4 секунды, поэтому действие будет идти в два раза дольше.

Ответ: при 12 кадрах в секунду анимация длится 2 секунды, а при 6 кадрах в секунду — 4 секунды. Содержание кадров не меняется, меняется только скорость их показа.

Типичные ошибки

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

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

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

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

Связь с другими темами

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

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

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

Что запомнить

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