Как сделать текстовую анимацию

Полное руководство по созданию анимированного текстового видео

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

Отведи меня к создателю анимации

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

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

• Создание векторной графики в Adobe Illustrator с последующей анимацией в After Effects,
• И использование создателя текстовой анимации, который позволяет вам проявлять творческий подход, экономя при этом много времени.

Давайте попробуем оба варианта! Но сначала нам нужно понять основы.

Что вы найдете здесь?

• • Полезные принципы анимации
  • Создание текстовой анимации с помощью After Effects
  • Использование Text Animation Maker — никаких After Effects не требуется!
  • Почему важен видеоконтент?

Полезные принципы анимации

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

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

1. Сквош и растяжка. Это действие придает вашей графике иллюзию веса и объема. Насколько экстремальным будет действие, зависит от тонкости или преувеличения, которые вы хотите придать движению.
2. Ожидание. Почти у каждого реального действия есть краткое или долгое ожидание, которое мы можем представить как движение назад. Представьте, что кто-то собирается прыгнуть: он не просто парит в воздухе, но готовит свои ноги к прыжку, часто двигаясь немного вниз, что является способом предвидения, и вы должны учитывать это, думая о движении.
3. Медленно выдохните и медленно вдохните , чтобы движения были мягкими. Постоянная скорость обычно достигается в середине движения и не совсем одинакова в начале и в конце.
4. Сроки. Чем больше кадров вы используете в анимации, тем медленнее она будет воспроизводиться. Найдите баланс между слишком медленным и слишком быстрым движением, учитывая расстояние.
5. Преувеличение. Подумайте, как карикатурно изобразить действия. Сделав это, ваша анимация будет более привлекательной и не будет выглядеть механической.

Разработано Freepik

Если вы хотите узнать больше о принципах анимации, поищите 12 из них, разработанные двумя самыми легендарными аниматорами Уолта Диснея: Олли Джонстоном и Фрэнком Томасом. Тем не менее, эти 5 отлично подходят для начала работы с моушн-графикой.

Создание текстовой анимации с помощью After Effects

Adobe After Effects — это приложение для цифровых визуальных эффектов, анимированной графики и композитинга. Чтобы создать текстовую анимацию, вам нужно создать свои активы в Adobe Illustrator, потому что векторы не будут искажаться при импорте их в композицию AE. Кроме того, вы сможете работать со слоями (поэтому разделите свой дизайн на части, которые вы хотите анимировать отдельно) и использовать специальные инструменты для дизайна.

Использование двух программ и, возможно, не освоение ни одной из них добавляет сложности к выбору этого пути. Тем не менее, это также дает вам свободу контролировать каждый аспект вашего конечного продукта, а это означает, что вы можете погрузиться в Illustrator как поверхностно, так и глубоко, как хотите. Хорошая часть заключается в том, что есть несколько онлайн-учебников и курсов, чтобы узнать, как использовать эту программу; вот один, охватывающий все основы от Adobe , и вот список практических руководств , которым вы можете следовать, чтобы освоить различные навыки.

Примечание. Если вы еще не тестировали Illustrator и After Effects, загрузите 7-дневную бесплатную пробную версию. Когда бесплатная пробная версия закончится, у вас будет возможность приобрести лицензию Adobe Cloud для использования этих программ. Лицензия будет стоить вам 20,99 долларов США в месяц для одного приложения в годовом плане с ежемесячной оплатой, поэтому в сумме вам придется тратить 41,98 долларов США в месяц на оба приложения. Вот список различных вариантов ценообразования .

Хорошо, теперь, когда мы поговорили о программном обеспечении, давайте продолжим с векторами.

Есть несколько бесплатных ресурсов для загрузки векторов, с которыми вы можете работать, если хотите сэкономить время, например Freepik. Используйте поле поиска, чтобы найти вектор, который вы хотели бы использовать. Так, например, если я пытаюсь сделать заставку для канала о путешествиях на YouTube, я буду искать вектор земного шара.

Примечание: будьте внимательны и читайте мелкий шрифт! Большинство векторов бесплатны с указанием авторства, но некоторые могут быть недоступны. Обязательно внимательно прочитайте условия использования, чтобы избежать неприятностей позже.

• Когда у вас есть весь материал, откройте новый документ Illustrator. Убедитесь, что ваш документ имеет тот же размер, что и композиция After Effects, которую вы планируете создать, чтобы вам не пришлось беспокоиться об изменении размера.
• Затем поместите свои активы в разные слои в Illustrator. Назовите каждый слой, чтобы вы знали, какую фигуру содержит каждый слой. Этот шаг упростит ваш рабочий процесс.
• Вот скриншот моего холста Illustrator.

Теперь, когда я доволен своим документом, следующим шагом будет его импорт в After Effects.

Откройте After Effects и выберите « Файл» > «Импорт » > « Файл» . Выберите файл Illustrator и внизу, где написано « Импортировать как », обязательно выберите «Композиция» — «Сохранить размеры слоя». Как только вы это сделаете, вы будете готовы к анимации. 😉

Использование Text Animation Maker — никаких After Effects не требуется!

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

Выполните следующие простые шаги, чтобы создать анимацию с помощью Placeit:

1. Выберите шаблон, который вам больше всего нравится.
2. Введите сообщение в текстовые поля. Используйте один или все из них (некоторые шаблоны имеют более одного текстового поля); отметьте те, которые вы хотите использовать.
3. Выберите цвет фона. Некоторые шаблоны позволяют загружать фоновое изображение.
4. Выберите цвет текста. В некоторых шаблонах есть дополнительные элементы, которые можно настроить с помощью цвета, например фигуры.
5. Нажмите «Воспроизвести все слайды», чтобы просмотреть предварительный просмотр анимации. Вы можете вернуться и внести столько изменений, сколько захотите.
6. Давай, скачай свое видео!

Вот красивый и легкий результат использования этого шаблона анимации:

Он выглядит намного более профессионально, чем тот, который я сделал в After Effects с моими базовыми знаниями, и он был готов за долю времени и денег.

Сделать текстовую анимацию

Почему важен видеоконтент?

С тех пор, как люди загружали видео в Интернет, они экспериментировали и изобретали формат несколько раз. Вспомните бум YouTube и Vine некоторое время назад; эти ориентированные на видео платформы изменили правила игры. Несмотря на то, что последний больше не активен, он стал основным продуктом быстрого видеоконтента. Теперь мы можем наслаждаться чем-то похожим на Snapchat и Instagram Stories.

Совет профессионала: интересно узнать о YouTube? Узнайте больше о том, как создать успешный канал на YouTube.

Видео на Facebook втрое увеличивает вовлеченность и на 1200% больше репостов, чем текстовые и графические посты вместе взятые. Не секрет, что люди очень визуальны и смотрят видео, чтобы развлечься, вдохновиться, узнать и открыть для себя что-то новое.

Анимационная графика использовалась в видео по многим причинам, в том числе:

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

Теперь, когда вы знаете основы моушн-графики и пару инструментов для создания собственной графики, приступайте к созданию своего первого анимационного видео!

Настройка шаблона текстовой анимации