Как сделать 2D-анимацию в Unity с минимумом кода: использование кадров и скриптов

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

Что можно анимировать в Unity

Мини-игра к этой статье и все ассеты выложены в репозитории на GitHub.

Анимация позволяет оживить игру даже с самой примитивной графикой. Например, персонаж для игры из этой статьи выглядит вот так:

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

Теперь персонаж стал чуть более живым и даже забавным — на него гораздо приятнее смотреть, хотя внешне он не изменился.

С помощью анимации можно оживить и фоны. Например, сделать:

  • качающиеся волны;
  • блики небоскребов;
  • загорающиеся и гаснущие окна домов;
  • мерцающие звезды и так далее.

Анимацию можно добавить и в интерфейсы: переливающиеся шкалы здоровья, поблескивающие кнопки. Даже вращающаяся шестеренка вместо простой надписи «Загрузка…» украсит проект:

Евгений Кучерявый

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


Анимация «из коробки» в Unity

В Unity создавать анимацию можно с помощью:

  • скриптов;
  • кадров;
  • скелетов.

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

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

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

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

Анимация вращения с помощью скрипта в Unity

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

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

Делается это так. Сначала в Character.cs добавляется следующее поле:

public bool isRightSide = true; //Если true, персонаж смотрит направо, а иначе — налево

Затем создаем метод, который будет вращать спрайт:

void Spin()

{
    isRightSide = !isRightSide;
    transform.localScale = new Vector3(transform.localScale.x * -1, 1f, 1f);
}

Он принимает направление движения и меняет масштаб по оси X. Умножив его на –1, можно «перевернуть» объект.

Затем в Update() прописывается вызов метода Spin():

float moveX = Input.GetAxis("Horizontal"); //Получение направления движения

Rigidbody2D rb = GetComponent<Rigidbody2D>(); //Получение компонента, ответственного за физику объекта. Чтобы снизить нагрузку на игру, получение Rigidbody2D лучше вынести в метод Start().
rb.MovePosition(rb.position + Vector2.right * moveX * speed * Time.deltaTime); //Движение

if((moveX > 0f && !isRightSide) || (moveX < 0f && isRightSide)) { //Если игрок начал двигаться в противоположную сторону
     if (moveX != 0f) //Если он не стоит
     {
          Spin (); //Вызов метода Spin()
     }
}

Теперь персонаж будет менять направление:

Подготовка спрайтов для анимации в Unity

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

  • Idle — стоит;
  • Run — идет или бежит;
  • Jump — в прыжке;
  • Attack — атакует.

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

Например, вот как можно создать набор спрайтов для состояния Idle:

Создание кадров анимации в Photoshop

Подвигайте персонажа в Photoshop и сохраните каждый кадр как отдельный файл. Старайтесь давать имена, по которым можно понять, что это за анимация: Robot_Idle1.png, Robot_Attack2.png и так далее.

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

Добавление анимации

Готовые спрайты добавьте в папку с ассетами. Затем выберите в списке с объектами персонажа и зайдите в меню Window — Animation.

Откроется окно, которое можно перетащить в удобное место, зажав вкладку Animation. Дальше нажмите Create и выберите путь сохранения анимации.

Желательно сохранять все анимации в отдельную папку, например в Animations. Сам файл можно назвать Character_Idle.anim или Character_Jump.anim. Первая часть должна соответствовать названию объекта, а вторая — состоянию.

Далее перетащите необходимые спрайты на временную шкалу.

Добавление кадров анимации в Unity

Теперь анимацию можно запустить с помощью кнопки Play. Так как кадров мало, они будут меняться слишком быстро. Чтобы это исправить, измените значение Samples. По умолчанию установлено 60, но попробуйте поставить 12, 6, 3 или любое другое значение.

Вот как выглядит такая анимация в игре:

Анимация состояния Idle (покой)

Таким же способом создайте анимацию и для других состояний: Run, Jump, Attack.

Управление переходами

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

Расположение файла Character.animator

Чтобы запустить его, зайдите в меню Window — Animator. Вот как выглядит этот файл:

Вид инструмента Animator

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

Первый переход находится между состояниями Entry и Character_Idle — это анимация, воспроизводимая по умолчанию.

Exit позволяет задать анимацию, которая появится перед смертью героя. А Any State — переход из любого состояния. С его помощью можно значительно сократить количество компонентов Transition.

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

Анимация со всеми состояниями и переходами

Теперь можно добавить сами переходы. Нажмите на какое-нибудь состояние правой кнопкой мыши и нажмите Make Transition. Затем проведите стрелку на любую другую анимацию.

Потом нажмите на стрелку, чтобы указать условия в поле Conditions.

Условия для смены состояния

Тут указано, что переход будет совершен, если персонаж на земле и если его скорость больше 0,1. Такое маленькое значение установлено для того, чтобы анимация менялась даже при незначительных изменениях.

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

По умолчанию параметры никак не будут меняться — их обновление нужно прописать с помощью скриптов. Для этого зайдите в Character.cs и добавьте поле animator:

public Animator animator;

После этого в редакторе Unity перетащите компонент Animator в поле animator компонента Character.cs.

Теперь можно работать с аниматором с помощью скрипта. Например, в методе Update() в качестве скорости передается направление движения:

float moveX = Input.GetAxis("Horizontal");

rb.MovePosition(rb.position + Vector2.right * moveX * speed * Time.deltaTime);

animator.SetFloat("Speed", Math.Abs(moveX)); //Будет передано только положительное значение

Так же меняются и другие параметры — isLanded меняется в методе Jump():

void Jump() //Метод прыжка

{
     if(isLanded) //Можно прыгнуть, только если персонаж на земле
     {
         rb.AddForce(Vector2.up * jumpForce); //Добавление силы прыжка
         isLanded = false;

         animator.SetBool("IsLanded", isLanded); //Изменение параметра
     }
}

Сделав всё то же самое, со всеми параметрами, можно запустить игру и проверить, как всё работает. Вот так наш персонаж будет ходить:

А вот он стреляет:

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

Заключение

Это небольшая часть встроенных возможностей Unity для работы с анимацией. Более подробно вы можете изучить их на курсе «Разработчик игр с 0 до PRO», на котором вы будете изучать создание игр на реальных проектах.

Курс

Разработчик игр с 0 до PRO


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

Хочешь получать крутые статьи по программированию?
Подпишись на рассылку Skillbox