Начинающим дизайнерам: 9 программ для создания анимации

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

В работе с анимацией на компьютере дизайнеру нужно учесть следующие факторы:

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

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

Наставники курса «Моушн-дизайнер» учат проектировать сайты в конструкторах Tilda, Readymag и Figma, разрабатывать простые, но креативные решения, узнавать потребности целевой аудитории и бизнеса.

Плагины помогают создавать 3D-анимацию и объёмные иллюстрации. Всё делается в Figma, без обращения к сторонним программам:

● Addjust — набор объёмных иллюстраций и иконок, у которых можно изменить цвет, размер и перспективу.

● Figmotion — сборщик гифок или видео, сохраняет анимацию в расширении CSS или JSON, чтобы встроить потом на сайт.

● Beatflyer Lite — анимация по слоям с комбинированием различных эффектов: масштабирования, вибрации, свечения, размытия.

На данный момент в России заблокирован доступ только для коммерческих аккаунтов Figma. Личные работают без изменений.

Плюсы:
● много инструментов для веб-дизайна;
● большой функционал для командной работы;
● удобная работа с базовыми компонентами;
● есть интерактивные объекты, Smart animate, плагины для анимации;
● созданный в прототипе сайт можно сверстать;
● понятный интерфейс;
● быстрая работа программы;
● бесплатный продукт с минимальными ограничениями.

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

ОС: Windows, macOS.

Цена: бесплатно. Есть платные тарифы для профессионалов: с расширенными возможностями — $15 в месяц (оплата за год по $12 в месяц), для организаций — $45 в месяц.

Программа для работы с растровой графикой, в которой можно создать простую гифку при помощи шкалы времени или инструмента Timeline. С Photoshop стоит познакомиться перед тем, как пробовать более сложные программы для анимации — Adobe Animate и Adobe After Effects.

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

Плюсы:
● понятный интерфейс (относительно After Effects);
● высокое качество гифок;
● синхронизация с экосистемой Adobe;
● много инструкций в интернете.

Минусы:
● ограниченный функционал для анимации;
● высокая цена, если постоянно не заниматься анимацией.

ОС: Windows, macOS.

Цена: в месяц — $20,99. По подписке Creative Cloud — $54,99. Скидки для студентов и бизнес-аккаунтов. Есть бесплатный пробный период.

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

Плюсы:
● простой интерфейс;
● поддерживается наложение звука;
● синхронизация с экосистемой Adobe;
● много инструкций в интернете.

Минусы:
● знакомство с программой требует времени;
● высокая цена, если постоянно не заниматься анимацией.

ОС: Windows, macOS.

Цена: в месяц — $20,99. По подписке Creative Cloud — $54,99. Есть скидки для студентов и бизнес-аккаунтов. Есть бесплатный пробный период.

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

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

Плюсы:
● можно оживить любые объекты;
● библиотека эффектов и готовых шаблонов;
● поддерживаются плагины сторонних производителей;
● синхронизация с экосистемой Adobe;
● много инструкций в интернете.

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

ОС: Windows, macOS.

Цена: в месяц — $20,99. По подписке Creative Cloud — $54,99. Есть скидки для студентов и бизнес-аккаунтов. Есть бесплатный пробный период.

Если не хочется углубляться в моушн-дизайн, то знаний Figma и её плагинов будет достаточно. Дизайнерам, которых привлекают визуальные эффекты и программы для 3D-анимации, стоит пробовать работу в Adobe After Effects и Adobe Animate.

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

У анимации на телефоне есть свои преимущества перед работой на ПК. Главное из них в том, что эти программы проще освоить. Мобильная анимация используется в основном для SMM и маркетплейсов: рекламных баннеров, постов и сторис, гифок. Если нужно сделать ярко и быстро, это отличный вариант.

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

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

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

Плюсы:
● много бесплатных шаблонов;
● легко избавиться от белого фона на картинке и сделать PNG;
● большая база стоковых изображений;
● автоматическое сохранение изменений;
● синхронизация с Adobe;
● сохранение качества при рендере;
● отсутствие водяного знака;
● интуитивно понятный интерфейс.

Минусы:
● шаблонный дизайн и анимация;
● не все шрифты поддерживают кириллицу.

ОС: iOS, iPadOS, Android.
Цена: бесплатно, со встроенными покупками. Месяц — 899 рублей.

Плюсы:
● много функций в бесплатной версии;
● создание анимации на прозрачном фоне;
● векторная графика;
● 3D- и цветовые эффекты;
● монтаж видео с заданием траектории движения;
● инструкции внутри приложения.

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

ОС: iOS, iPadOS, Android.
Цена: бесплатно, со встроенными покупками. Неделя — 199 рублей.

Плюсы:
● большая библиотека бесплатных эффектов;
● можно повлиять на композицию шрифта;
● подключён фотосток Flickr;
● понятный интерфейс;
● нет встроенной рекламы.

Минусы:
● водяной знак;
● нет вертикального формата шаблона, например, для сторис;
● может вылететь и не сохранить файл;
● доступно только для Android.

ОС: Android.
Цена: бесплатно.

Плюсы:
● интересные эффекты и декоративные элементы;
● возможность анимировать воду и небо;
● создание реалистичных снимков за счёт анимации;
● понятный интерфейс;
● экспорт в формате живых обоев.

Минусы:
● приложение полностью платное, даже используя «бесплатные» инструменты, нельзя сохранить файл;
● небольшая библиотека эффектов;
● потеря качества при сохранении.

ОС: iOS, iPadOS, Android.

Цена: платно. Месяц — 749 рублей, год — 4390 рублей, навсегда — 18 990 рублей.

Плюсы:
● интуитивно понятный интерфейс;
● синхронизация с облачным хранилищем Google;
● создание гифки за пару кликов.

Минусы:
● нельзя отследить движение и смещение кадров;
● все материалы для монтажа готовятся заранее;
● нет эффектов, ускорения, наложения музыки.

ОС: iOS, iPadOS, Android.
Цена: бесплатно.