Исходный размер 2528x4096

Истоки возникновения кинетической типографики [motion design]

Данный проект является учебной работой студента Школы дизайна или исследовательской работой преподавателя Школы дизайна. Данный проект не является коммерческим и служит образовательным целям
Проект принимает участие в конкурсе
Исходный размер 1400x1000

Behance project. «Kinetic Typography Experiments», Vincenzo Marchese Ragona

концепция

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

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

«Художники взяли в руки новое оружие — слово. Буквы вырвались со страниц газет и книг, чтобы стать полноценными участниками художественного действа» [1]

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

Сейчас дизайнеры ушли дальше. В кино, музыкальных клипах, рекламе или интерфейсах текст почти всегда существует не как статичный объект. Он трансформируется (сжимается, растягивается, разрушается и исчезает), тем самым взаимодействуя с изображением, становясь частью визуального повествования. Даже не так, текст взаимодействует с пользователем, являясь важным звеном в формирование итогового впечатления. Подобное направление в дизайне получило название кинетическая типографика (kinetic typography), что представляет собой «текст, который перемещается или иным образом изменяется с течением времени» [2]

Так как кинетическая типографика является ответвлением моушн-дизайна (motion design), в данном визуальном исследовании я хотела бы проследить историю зарождения этих двух понятий , а также выявить, каким образом идеи движения, времени и ритма постепенно изменили восприятие текста в визуальной культуре XX века.

Исходный размер 0x0

Behance project. TedxModojiRoad, Adetomiwa I.O

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

На основе проведённого анализа была сформирована следующая структура исследования:

(01) Типографические эксперименты авангарда Несмотря на то, что кинетическая типографика особенно активно развивается в цифровую эпоху, ее истоки можно обнаружить значительно раньше появления компьютерной анимации. Уже в начале XX века художники авангарда стремились передать ощущение скорости, ритма и движения через композицию текста на листе.

(02) Кино и рождение кинетической типографики Вступительные титры, из элемента второстепенной важности, в середине XX века начинает превращаться в самостоятельный художественный элемент фильма. Особую роль в этом процессе сыграли работы Сола Басса и других дизайнеров титров, которые начали использовать движение, ритм, монтаж и взаимодействие текста с изображением, поставив полноценную точку отсчета в создании моушн-дизайна и кинетической типографики.

(03) Развитие кинетической типографики на телевидении В конце XX века телевидение стало одной из главных площадок для развития motion design. Несмотря на технические ограничения раннего телевещания, постепенное развитие эфирной графики, появление кабельного телевидения и цифровых технологий значительно расширили возможности дизайнеров.

(01) Типографические эксперименты авангарда

Исходный размер 1726x1440

Эль Лисицкий, «Клином красным бей белых» (1919–1920)

«Я думаю, революция в типографии произошла c художественного изображения. Картина и слово стали одним целым. Единственный реальный прогресс <…> заключается в использовании шрифта не как дополнения к иллюстрации или изображению, а как самого изображения»

© Роберт Браунджон

Исходный размер 1680x609

Александр Родченко, Владимир Маяковский, Эскиз рекламной вывески «Нами оставляются от старого мира только папиросы „Ира“» (1923)

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

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

«Более того, мой переворот направлен против того, что называется гармонией шрифта в странице, которая противоречит приливам и отливам стиля, проявляющимся на пространстве страницы»

© Филиппо Томмазо Маринетти

Одними из первых к экспериментам с текстом обратились футуристы. В своих манифестах и печатных работах они отказывались от привычной структуры страницы и классических правил набора. Слова располагались по диагонали, меняли размер, наклонялись и сталкивались друг с другом, создавая ощущение хаоса и движения. Чтение превращалось не только в процесс восприятия смысла, но и в визуальный опыт. Особо важную роль в развитии подобного подхода сыграл Филиппо Томмазо Маринетти и его концепция «слов на свободе» (Parole in libertà), в которой текст переставал подчиняться строгим правилам композиции. В этой работе даже сами буквы, даже в отсутствии каких-то графических элементов, формируют гармоничную композицию.

Исходный размер 1410x1796

Филиппо Томмазо Маринетти, «Parole (…) in libertà» (1915)

Исходный размер 2172x1214

Казимир Малевич, «Трое» (1913)

Позднее идеи футуристов получили развитие в дадаизме и конструктивизме. Художники активно экспериментировали с коллажем, асимметричной версткой, контрастом шрифтов и взаимодействием текста с изображением. Особенно ярко это проявилось в работах представителей русского авангарда, например у Эля Лисицкого, Александра Родченко и Владимира Маяковского. Их плакаты (в том числе и рекламные) и типографические композиции строятся на диагональных линиях или сетке, крупных брусковых шрифтах и четком ритме элементов, что создает ощущение динамики даже внутри «плоского» изображения.

Исходный размер 1884x1440

Александр Родченко, «Добролет» (1923)

Исходный размер 821x586

Эль Лисицкий, сборник стихов Владимира Маяковского «Для голоса» (1923)

Идеи авангардной типографики не исчезли вместе с завершением эпохи конструктивизма, а продолжили развиваться. Одним из важных связующих звеньев между авангардом и будущим motion design стал Ласло Мохой-Надь (László Moholy-Nagy) — художник и преподаватель Баухауза, который активно следил за на открытиями Казимира Малевича, Эля Лисицкого и Александра Родченко. Через Баухауз идеи конструктивизма, геометрической композиции и динамичного взаимодействия текста и изображения начали распространяться за пределами Европы и постепенно повлияли на развитие графического дизайна и кинематографа.

Ласло Мохой-Надь, (01) Обложка для журнала Photo-Quality (1931) ((02) Плакат «Quickly Away, Thanks To Pneumatic Doors» (1937)

Особую роль в этом процессе сыграл и художник и дизайнер Дьёрдь Кепес (György Kepes), являющийся близким соратником Мохой-Надя. Именно у него в Бруклинском колледже обучался Сол Басс, которого позже будут называть одним из основоположников motion design, о чем более подробно можно будет прочесть в следующей главе. Кепес познакомил Басса с модернистским подходом к композиции и идеей «движущегося статичного изображения», что впоследствии оказало достаточно сильное влияние на его стиль.

(02) Кино и рождение кинетической типографики

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

Behance project. «Kinetic Typography Experiments», Vincenzo Marchese Ragona

В киноиндустрии разработка названий анимационных фильмов в 1950-х годах в какой-то степени привела к появлению новой формы графического дизайна, получившей название motion graphics. Хотя все еще ведется множество споров об «истинных» истоках происхождения моушн-дизайна (motion design). Профессор Matt Frantz в своей диссертации «Changing Over Time: The Future of Motion Graphics» связывает это с отсутствием общепринятой трактовки термина motion design: «Даже среди профессионалов в этой области существуют разногласия по поводу терминологии. Брэд Содерлунд, креативный директор One Six Eight Design Group в Сан-Франциско, даже не решается назвать моушн-графику видом искусства.» [4]

Даже в определении кинетической типографики все еще есть сложности. В исследовательской среде наряду с термином «кинетическая типографика» часто используется понятие «темпоральная». Хотя разные теоретики берут эти понятия как синонимы, в них все же есть различия. Так, темпоральная типографика обычно описывает любой текст, изменяющийся во времени, даже несмотря на то, является ли он подвижным. Кинетическая же типографика рассматривается как форма визуальной коммуникации, в которой движение становится не просто техническим эффектом, а важной частью передачи смысла и эмоционального воздействия на зрителя. Подобная неоднозначность терминов показывает, что современная типографика рассматривается не как статичный объект, а как процесс, который существует во времени и взаимодействует с пространством, движением и восприятием зрителя. [6]

post

Первые попытки уйти в анимацию текста были совершены в 1898 году кинорежиссером Жоржом Мельесом в утерянном рекламном ролике, где он оживил буквы алфавита для рекламного фильма.

Тем не менее многие исследователи все же выделяют Сола Басса (Saul Bass) как одного из «самых влиятельных кинодизайнеров XX века» и родоначальников моушн-дизайна [3]. Дизайнер Сол Басс начал свою карьеру прежде всего с создания кинопостеров, в числе которых легендарный постер к фильму «The Man with the Golden Arm» (1955) Отто Премингера, после которого появилась и заставка, постер к фильму «Saint Joan » (1957) и «Vertigo» (1958)

Исходный размер 2480x1350

(01) «Vertigo» (1958), (02) «The Man with the Golden Arm» (1955), (3) «Saint Joan » (1957)

Loading...

Тем не менее именно вступительные титры для фильма Альфреда Хичкока «North by Northwest» (1959) стали первым примером более подробного использования кинетической типографики.

В заставке текст наряду с графическими элементами (синими фоновыми полосками-сеткой и белыми пролетающими прямоугольниками) влетает на экран с разных сторон. Интересно и то, что каждый элемент (в том числе и текст) подчиняется синей сетке, которая позже, когда зеленый фон пропадает, оказывается оконными линиями стеклянной высотки мегаполиса.c

Title Lettering by Saul Bass. «North by Northwest» (1959)

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

Исходный размер 3500x2150

Title Lettering by Saul Bass. «North by Northwest» (1959)

Подобную технику Сол Басс продолжает использовать и в других фильмах Альфреда Хичкока, например в «Vertigo» (1958) и «Psycho» (1960). Во втором, как мне показалось, заставка стала чуть ли не идеальным графическим воплощением фильма. «Используемые вертикальные и горизонтальные серые линии на черном фоне в <…> разрезают типографику, передавая раздвоенное состояние психики главного героя» [3] . Заставка с ее напряженной атмосферой, которую усиливает «режущая музыка» в целом будто подготавливает зрителя к тому, что он увидит дальше.

Loading...
Исходный размер 3500x2150

Title Lettering by Saul Bass. «Psycho» (1960)

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

Title Lettering by Saul Bass. «Vertigo» (1958)

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

© Сол Басс

Title Lettering by DePatie-Freleng Enterprises, Inc. «The Pink Panther» (1963)

Титры к фильму The Pink Panther (1963), созданные американской анимационной студией DePatie-Freleng Enterprises, Inc., основанной Фрицем Фреленгом (Friz Freleng) и Дэвидом Х. ДеПати (David H. DePatie), также являются ярким примером использования кинетической типографики в кинематографе. Тем не менее, в отличие от минималистичных и более абстрактных заставок Сола Басса, в заставке присутствует несколько персонажей. Центральным героем остается пантера, тогда как другими в каком-то смысле являются буквы: «они двигаются, дрожат и сжимаются от страха, выскакивают, крутятся, деформируются» [3]

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

Исходный размер 426x240

Title Lettering by DePatie-Freleng Enterprises, Inc. «The Pink Panther» (1963)

Пабло Ферро (Pablo Ferro), кубинский режиссер и дизайнер, прославился новыми техниками, которые он внедрил в коммерческую киноиндустрию в числе которых быстрый монтаж, экстремально крупные планы, наложенные шрифты и монтаж с разделением экрана. Он возродил рукописные стиль написания названий фильмов.

Исходный размер 3500x1194

Title Lettering by Pablo Ferro. (01) «Beetlejuice» (1988), (02) «Men in Black» (1997)

Также «многие дизайнеры утверждают, что его техника fast cutting (дословно быстрый монтаж), в частности, повлияла на то, что позже стало известно на телевидении как „стиль MTV“» [7]

Исходный размер 426x240

Title Lettering by Pablo Ferro. Theatrical trailer «A Clockwork Orange» (1971)

Исходный размер 426x240

Title Lettering by Kyle Cooper. «True Lies» (1994)

Творчество Кайла Купера (Kyle Cooper) сформировалось под влиянием Пабло Ферро и Сола Басса. После учебы у легендарного дизайнера Пола Рэнда (Paul Rand) в Йельском университете он работал в R/Greenberg Associates в Нью-Йорке и внес свой вклад в создание заглавного текста фильма True Lies (1994).

Титры к фильму Mission: Impossible — Ghost Protocol (2011), созданные Купером, в отличие от классических заставок (и тех, что уже были представлены в визуальном исследовании), используют текст, встроенный прямо в действие фильма. Последовательность начинается со сцены зажжения фитиля, после чего камера следует за движением горящего провода, ведущего к бомбе.

Исходный размер 1080x452

Title Lettering by Kyle Cooper. «Mission: Impossible — Ghost Protocol» (2011)

Исходный размер 1080x452

Title Lettering by Kyle Cooper. «Mission: Impossible — Ghost Protocol» (2011)

Loading...

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

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

(03) Развитие кинетической типографики на телевидении

В середине XX века развитие кинетической типографики во многом было связано с телевидением, тем не менее в 1960–1970-х годах использование анимационной графики оставалось достаточно особенным приемом, в каком-то смысле ограниченным. Создание движущегося изображения, будь то через монтаж, бумажную анимацию или компьютерные технологии, требовало много времени, больших финансовых вложений и дорогостоящего оборудования, поэтому подобные решения чаще всего использовались только во вступительных заставках фильмов и телевизионных программ. Титры имеют короткий короткометраж (от 30 секунд до 4 минут), а основной телевизионной графики того времени являлись простые логотипы каналов, статичные надписи или несложные анимации. [7]

Так, одним из простых, но значимых примеров ранней кинетической эфирной типографики является телевизионный логотип компании National Broadcasting Company (NBC). Линии логотипа змееобразно прорисовывались на экране, формируя буквы

Исходный размер 480x360

Логотип телеканала NBC (1959)

Мне также удалось найти два варианта логотипа американской телекомпании Columbia Broadcasting Inc., (CBS). Оба варианта достаточно минималистичные, хотя логотип 1965 (01) имеет более сложную анимацию букв, которые словно падают, собираясь вместе в единый символ. Можно понять, что в это время телевидение использовало движение скорее как технический эффект, чем как полноценный визуальный язык.

Логотип American Broadcasting Company (ABC) также можно рассматривать как пример ранней телевизионной графики. Его анимация строилась на простых движениях — плавном появлении элементов и вынесении деталей из основной формы.

(01) Логотип телеканала CSB (1965), (02) Логотип телеканала CSB (196&)

Исходный размер 480x360

Логотип телеканала ABC (1962-1969)

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

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

Телевизионная заставка MTV. (01) by Rastko Ćirić (1990), (02) Bumper Street

Исходный размер 480x360

Телевизионная заставка MTV. Top of the Hour

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

Заключение

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

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

Loading...

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

Пример рекламной кинетической типографики. Behance project. PUMA — Forever Faster, Mat Voyce

Современный зритель все чаще сталкивается именно с анимированным текстом: в интерфейсах приложений, рекламных роликах, титрах, субтитрах и коротких видеоформатах (reels, tiktok и др.). В результате motion design (в том числе и кинетическая типографика) постепенно превращается в один из основных визуальных языков современной культуры.

Исходный размер 1920x1080

Behance project. SKAZKA MUSIC FESTIVAL | brand identity, Anastasia Sharapova

Библиография
1.

Текст в искусстве: скрытые послания, философские аллюзии и гимн поп-культуре // cube.market [Электронный ресурс]. URL: https://cube.market/news/articles/tekst-v-iskusstve-skrytye-poslaniia-filosofskie-alliuzii-i-gimn-pop-kulture (дата обращения: 19.05.26)

2.

he Kinetic Typography Engine: An Extensible System for Animating Expressive Text // Johnny C. Lee, Jodi Forlizzi, Scott E. Hudson [Электронный ресурс]. URL: http://johnnylee.net/kt/dist/files/Kinetic_Typography.pdf (дата обращения: 19.05.26)

3.

Эволюция кинетической типографики: от рукописных кинотитров до моушн-дизайна // Э. Г. Гаприндашвили, О. Г. Яцюк [Электронный ресурс]. URL: https://xn----7sbabalfgj4as1arld1aqs8v.xn--p1ai/uploads/catalogfiles/1284_30-eh-g-gaprindashvili-o-g-yacyuk-ehvolyuciya-kineticheskoj-tipografiki-ot-rukopisnyh-kinotitrov-do-moushn-dizajna.pdf (дата обращения: 19.05.26)

4.

Frantz M. Changing Over Time: The Future of Motion Graphic. — 2003. [Электронный ресурс]. URL: https://benjaminhallwriting.wordpress.com/2014/10/28/changing-over-time-the-future-of-motion-graphics/ (дата обращения: 19.05.26)

5.

Brownie, Barbara. «Fluid Characters in Temporal Typography.» — Fusion Journal, — № 1, — 2013. [Электронный ресурс]. URL: https://search.informit.org/doi/epdf/10.3316/informit.222235466823003 (дата обращения: 19.05.26)

6.

Krasner Jon. Motion Graphic Design. — Focal Press, 2008. — 86 c. (дата обращения: 19.05.26)

7.

Vincenzo Maselli. Visual Heritage and Motion Design: The Graphic-Cultural Legacy of Saul Bass’s Title, — 2025. [Электронный ресурс]. URL: [Электронный ресурс]. URL: https://unich.unifind.cineca.it/resource/item/340033?language=en-US

Истоки возникновения кинетической типографики [motion design]
Проект создан 21.05.2026