Как сделать плавную анимацию для абстрактного персонажа — краткое описание техники

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

Пользователь Reddit под ником Sid Fish Games опубликовал короткое видео, в котором показал, как сделать плавную анимацию передвижения персонажей. Разработчик применил эту технику в собственном пошаговом проекте, в котором пространство поделено на ячейки.

Полное видео

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

Слева изначальный вариант, справа — финальный

Первый шаг — скопируйте начальный кадр анимации и откройте его в бесплатном графическом редакторе paint.net.

Примените к изображению эффект motion blur — размытие в движении
Поместите размытое изображение между начальным и конечным кадрами
Скопируйте первый кадр анимации и немного «сожмите» персонажа — уменьшите его длину, но увеличьте высоту
Также «сожмите» его лицо: это нужно для того, чтобы движение выглядело правдоподобным

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

Процесс создания частиц пыли
Финальная анимация
142142
16 комментариев

Так а в чем суть? Показать как делать покадровые анимации между ходами? Или как добавить "сочности" этой анимации? Если второе, то на эту тему есть гораздо более детальный и полезный доклад.

32
Ответить

Гораздо полезнее! И что ещё лучше, доклад менее привязан к какой-либо частной ситуации. А пост достаточно странноватый и скупой для "туториала")

5
Ответить

Комментарий недоступен

19
Ответить

Комментарий недоступен

Ответить

Добавил в закладки ( ͡° ͜ʖ ͡°)

8
Ответить

Зачем было открывать aseprite, если тут просто добавили моушн блур и пыль, которые в 90% случаев делают програмно?

Ответить

Комментарий недоступен

Ответить