Кинетическая типографика — это анимационная техника создания движущегося текста. Именно так называются ожившие буквы на экране телевизора или компьютера. У этого направления дизайна есть своя история, особенности и правила создания. Расскажем самое интересное о кинетической типографике и как ее использовать.
Что такое кинетическая типографика
Кинетическая типографика (motion typography, kinetic typography) —это оформление текста в движении, анимированные буквы, слова и текст. Текстовые элементы могут двигаться по-разному — появляться, исчезать, расти в высоту или в ширину, рассеиваться, прыгать, течь, летать
Анимированные надписи используются как самостоятельные элементы дизайна — в баннерах или на веб-страницах, а также как часть сложной анимации. Кинетическая типографика нужна, чтобы привлечь внимание к словам, поставить на них акцент, усилить воздействие текста.
История
Первые анимированные буквы появились в кинематографе еще во время его зарождения. В 1899 году режиссер Жорж Мельес создал движущиеся эффекты в титрах. С тех пор традиционно кинетическая типографика получала творческое развитие именно в искусстве создания кинотитров.
Одна из известных исторических вех — титры для фильмов Альфреда Хичкока. Режиссер использовал титры с анимацией в своих картинах «На север через северо-запад» (1959) и «Психо» (1960). Так надписи на экране стали передавать не только техническую информацию, как это было раньше, но и атмосферу фильма, погружая зрителя в предстоящий просмотр.
Один из выдающихся дизайнеров кинетической типографики — Кайл Купер — в 1995 году создал титры к фильму Дэвида Финчера «Семь». Они отличались необычным видеорядом, анимированными надписями и музыкальным сопровождением, создающими чувство тревоги.
Также движущиеся буквы получили развитие на телевидении для заставок и рекламных роликов. А в эру интернета и с появлением жанра коротких видео кинетический дизайн надписей стал популярным и массово распространенным. Он делает информацию более интересной, облегчает ее восприятие.
Источник: ru.freepik.com
Сферы использования кинетической типографики
- Кинематограф — чаще всего в выходных данных, титрах или для информации.
- Мультипликация — в мультфильмах широко используются нарисованные буквы.
- Гейм-дизайн — одна из самых распространенных сфер применения кинетической типографики.
- Рекламные баннеры — в интернете или на видеоэкранах для донесения информации до зрителя.
- Брендинг — логотипы и слоганы анимируют и оживляют для рекламных роликов.
- Социальные сети — анимированный текст применяется для креативных решений, чтобы передать идею видеоролика, поста, сторис, заставки.
- Интерфейсы сайтов и приложений — для более понятного и интересного юзабилити.
Основные правила кинетической типографики
Буквы должны быть узнаваемыми и читабельными, хотя могут вращаться, перемещаться, изменять форму. Но хотя бы несколько секунд они должны быть читабельными, чтобы зритель мог понять их. Текст в первую очередь несет информацию, каким бы красивым или креативным он ни был.
Буквы и слова должны быть в правильном порядке. Они могут меняться, путаться, выстраиваться в квадрат или круг. При этом можно подсвечивать определенные буквы для прочтения или наоборот скрывать. Но в какой-то момент текст должен быть выстроен так, чтобы его можно было прочитать.
Текст и фон должны быть контрастными. В кинетической типографике не рекомендуется использовать неконтрастные цвета, цвет текста и фона должен отличаться. Нужно делать акцент на тексте и не создавать витиеватые фоны или мелкие узоры. Анимировать тоже лучше только текст, а не фон. Типографика при всей креативности остается способом донесения информации.
Творческая работа может быть какой угодно, и возможно, что нечитаемый текст — это задумка дизайнера. Но что касается рекламы, титров и другой информации — они должны быть понятными.
- В рекламной кинетической типографике используют много креатива. То же самое в брендинге или в продвижении в соцсетях. Там применяются превращения, трехмерная графика и другие сложные эффекты.
- В интерфейсах не столь важен креатив, сколько юзабилити. Надписи должны нести информацию, привлекать и акцентировать внимание, делать видимой кнопку. Поэтому чаще используются более простые приемы — изменение цвета, движение текста.
Программы, которые используются для кинетической типографики
- Adobe After Effects. Платная программа с широкими возможностями для создания титров, надписей и других анимированных текстов. Подходит профессионалам, которые работают с типографикой на заказ, но в ней достаточно просто разобраться и новичкам.
- Cinema 4D. Работает с трехмерной графикой, удобная в использовании.
- Figma. Есть специальные плагины, в которых можно создавать движущиеся тексты, делать надписи, подсказки.
- Adobe Photoshop. В фотошопе тоже можно анимировать тексты, но в основном в нем делают простые эффекты.
Как установить и настроить After Effects
Одну из самых популярных программ After Effects можно скачать с официального сайта Adobe. Важно правильно настроить ее для работы с кинетической типографикой.
Как загрузить Adobe After Effects:
- Зайти на веб-сайт Creative Cloud от Adobe.
- Войти в учетную запись Adobe.
- Следуя инструкциям на экране, выполнить установку After Effects.
- Нажать «Загрузить» или «Установить».
- Можно загрузить бесплатную пробную версию или сразу воспользоваться платной.
Как правильно настроить
Чтобы профессионально создавать анимацию текста и различные спецэффекты, важно правильно настроить программу.
Настройки, включая сочетания клавиш и рабочие среды, хранятся в файлах, находящихся в папках:
- Windows: Users\[имя_пользователя]\AppData\Roaming\Adobe\After Effects\[версия]
- macOS: /Users/[имя_пользователя]/Library/Preferences/Adobe/After Effects/[версия]
Чтобы изменить настройки, используйте диалоговое окно «Настройки».
Настройки проекта
В настройках проекта определяется размер композиции, частота кадров и продолжительность проекта, цветовое пространство. Все это нужно предварительно настроить.
Настройки слоя
After Effects работает со слоями. Настройки позволят настроить свойства каждого слоя — масштаб, позицию, прозрачность, вращение
Настройки эффектов
Встроенные эффекты в After Effects дадут возможность создать яркий визуал. Настройки эффектов определяют их длительность и параметры. Можно настраивать эффекты относительно слоя или всей композиции.
Настройки анимации
Реалистичные и сложные анимации создаются настройкой ключевых кадров, в которых меняются положение, масштаб и прозрачность кадров. Можно задать начальные и конечные значения и с помощью эффекта сделать плавный и реалистичный эффект перехода.
Настройки композиции
Для создания проекта нужно выбрать оптимальное разрешение. В меню «Композиция», в подпункте «Настройки композиции» выставьте параметры разрешения и частоты кадров, а также размер и глубину цвета.
Настройки рендеринга
Настройки рендеринга нужны, чтобы установить качество и скорость рендеринга. В меню настройки можно найти пункт «Настройки рендеринга», где выставляются параметры кодека, размера файла, частоты кадров и другие.
Настройки производительности
Также можно настроить производительность. Чтобы After Effects работал быстрее, в меню настройки нужно выбрать «Настройки производительности». Параметры, которые влияют на производительность и которые можно изменить, — количество потоков обработки, параметры для OpenGL и другие.
Источник: ru.freepik.com
Главное, что нужно знать
- Кинетическая типографика — это движущийся текст. Текстовые элементы могут двигаться различными способами. Эти эффекты часто используются в титрах фильмов, видеороликах, рекламе и презентациях.
- К элементам текста применяют анимационные эффекты — появление и исчезновение, приближение и отдаление, изменение цвета и размера, вращение, перемещение.
- Анимированная типографика используется в различных сферах, в каких-то она может быть сдержанной, а в других более креативной.
- Буквы и слова должны быть читабельными, даже не смотря на креативные эффекты.
- Знание программы и правильная настройка After Effects позволит создавать кинетическую типографику быстро и качественно.
