Заполните форму и наш менеджер свяжется с вами
Кинетическая типографика: что это и как ее использовать
17 июня 2024

Кинетическая типографика: что это и как ее использовать

Кинетическая типографика: что это и как ее использовать

Содержание статьи

    Начать бесплатно

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

    Подберите программу обучения, узнайте проходной балл и начните учиться бесплатно

    Что такое кинетическая типографика

    Кинетическая типографика (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

    Главное, что нужно знать

    1. Кинетическая типографика — это движущийся текст. Текстовые элементы могут двигаться различными способами. Эти эффекты часто используются в титрах фильмов, видеороликах, рекламе и презентациях.
    2. К элементам текста применяют анимационные эффекты – появление и исчезновение, приближение и отдаление, изменение цвета и размера, вращение, перемещение.
    3. Анимированная типографика используется в различных сферах, в каких-то она может быть сдержанной, а в других более креативной.
    4. Буквы и слова должны быть читабельными, даже не смотря на креативные эффекты.
    5. Знание программы и правильная настройка After Effects позволит создавать кинетическую типографику быстро и качественно.

    Адреса поступления

    ЦФО
    г. Москва, Ленинградский пр-кт, д. 80, корпус Г
    Сокол
    +7 495 800–10–01 8 800 100–00–11
    Подберите программу обучения, узнайте проходной балл и начните учиться бесплатно
    Оставьте заявку, и мы откроем бесплатный доступ к вводной части обучения
    1 минута и 6 вопросов,
    чтобы узнать подходящую
    профессию
    Пройдите тест, чтобы узнать, на кого вам лучше учиться
    Начать бесплатно

    Подобрать программу и поступить

    Заполните форму и наш менеджер свяжется с вами
    Подберите программу обучения и начните учиться бесплатно
    Добро пожаловать
    Мы готовы ответить на Ваши вопросы
    Позвонить
    Уважаемый посетитель
    Если у вас есть вопрос, предложение или жалоба, пожалуйста, заполните короткую форму и изложите суть обращения в текстовом поле ниже. Мы обязательно с ним ознакомимся и в  30 - дневный срок ответим на указанный вами адрес электронной почты.
    30 дней
    * все поля обязательны для заполнения
    Jivo
    DMCA.com Protection Status