В этом уроке мы хотим рассказать об основных этапах создания анимированных персонажей с помощью программы Flash на примере разработки персонажа игры «Учимся играя» и аватара для Web-сайта.

Персонаж компьютерной игры

Согласно сценарию игры «Учимся играя», все действия в ней выполняет главный персонаж — Колобок (рис. 1), который перемещается по полю (рис. 2) в поисках алмаза.

Смысл данной игры заключается в том, что играющий должен выбирать путь к цели (алмазу), называя по имени предметы, расположенные справа, слева, сверху и снизу от клеточки, где стоит Колобок, осуществляя, таким образом, перемещения персонажа вверх-вниз, вправо-влево. Например, для того, чтобы Колобок переместился на одну клеточку вниз, в меню на рис. 2 нужно выбрать слово «orange». Правильно выбирая названия в меню, играющий может подвести персонажа к заветному алмазу.

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

1 Программа содержит 12 тем для изучения («Форма. Цвет. Число», «Времена года», «Часы», «Птицы», «Животные», «Устный счет», «Геометрические фигуры», «Римские цифры», «Дроби», «Палитра художника», «Английский язык», «Нотная грамота»).

В создании игры принимали участие Александр Прохоров, Михаил Морозов, Дмитрий Быстров, Елена Андрианова, Андрей Вязников. Более подробную информацию об игре можно получить по адресу: http://computergames.com.ru/54/7217.html .

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

В качестве примера показана анимация перемещений Колобка сверху вниз: анимация 1 .

На первом этапе создаются эскизы внешнего вида героя (рис. 4) , а также эскизы его перемещений и основных действий (рис. 5).

Параллельно делаются эскизы, в которых показывается, как персонаж будет выглядеть в разных темах игры. В частности, на рис. 6. показан эскиз к теме «Астрономия», а на рис. 7 — эскиз к теме «Дроби».

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

На рис. 8 видно, что персонаж состоит из отдельных элементов.

2 Данная работа выполнялась Еленой Адриановой.

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

Рассмотрим подробнее, из чего сделан наш герой. Папка «Части», показанная на рис. 9, содержит 12 элементов (в основном это мувиклипы), из которых состоит Колобок. Например, левая нога — Symbol 4d (рис. 9), правая рука — Symbol 7d (рис. 10) и т.п.

При этом отдельные элементы, такие как Symbol 12d (рис. 11), уже заключают в себе анимацию — движения бровей и глаз — и тоже состоят из отдельных элементов.

В частности, мувиклип Symbol 12d состоит из отдельных составляющих: брови (Symbol 34) (рис. 12), левый глаз (рис. 13). В свою очередь, мувиклип, изображающий левый глаз, базируется на мувиклипе «глаз» (рис. 14).

Таким образом, герой как бы собирается из отдельных деталей конструктора.

Для того чтобы показать, как перемещаются отдельные элементы, из которых состоит Колобок, во время ходьбы, обратимся к рисунку, где показан цикл ходьбы в режиме Оnion Skinning (калька). Из рис. 15 видно, что во время ходьбы у него перемещаются не только руки и ноги, но практически все элементы, из которых он состоит. При этом все элементы анимированы в режиме автоматической анимации движения (Motion Tweening) и только руки (вернее линии, которые соединяют кисти рук с телом) анимированы в режиме автоматической анимации формоизменения Shape Tweening (на рис. 8 эта анимация задана в слоях Layer 5 и Layer 7).

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

Аналогично анимируются движения Колобка при движении вправо и вверх.

Для того чтобы разнообразить движения персонажа, добавляются различные периодически повторяющиеся жесты. Например, Колобок прикладывает во время ходьбы руку ко лбу или, глядя на зрителя, грозит пальцем (рис. 17).

Основные варианты движения Колобка можно наблюдать в данном ролике .

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

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

Аватар для сайта

Часто оживить Web-сайт помогает персонаж, который взаимодействует с посетителем. Самый простой пример — это тестирование на сайте, при котором, помимо устных комментариев (или вместо них), результат ответа оценивается путем отображения настроения аватара.

Рассмотрм пример создания подобного персонажа.

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

Далее изображения доводились до чистового вида в программе Photoshop. При этом создавался шаблон с постоянными контурами лица, в который вписывались необходимые для передачи данного настроения черты. Цвет лица при этом также менялся (рис. 19).

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

В первом кадре помещаем изображение лица «грустный» по команде File => Import=> Import to stage , а затем переводим его в векторный вид по команде Modify=> Bitmap=> Trace Bitmap .

Затем применительно к первому кадру записываем строчку кода stop(); — рис. 20.

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

Так, верхняя кнопка будет содержать код, показанный на рис. 21.

Второй и последующие кадры создаются при помощи команды Insert Keyframe. Данная команда создает на каждом вводимом кадре все элементы с предыдущего кадра, так что нам остается только заменить картинку с очередным выражением лица.

Для более подробного знакомства с данным роликом можно обратиться к исходному

От новичка до настоящего аниматора всего за 9 месяцев!

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

Онлайн курс «Анимация персонажей» состоит из следующих разделов:

• Основы анимации
• Движение и механика тела
• Анимация для игр
• Актёрское мастерство - выражение и передача эмоций
• Производство короткометражного фильма

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

В дополнение к основному материалу курса вам будут предоставлены видео примеры с подробными объяснениями, которые помогут усвоить материал. А еженедельные практические задания и встречи с инструктором станут твёрдым “закрепителем” полученных знаний.

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

Вот несколько записей предыдущих встреч:

С чего начинается создание анимации?
Как анимировать персонажей?
Как передать эмоции анимацией?
Как создавать анимацию лица?
Что такое законы анимации и как их применять?
На эти и многие другие вопросы вы получите ответы на данном курсе.

Вы также получите возможность бесплатно скачать и установить лицензионное программное обеспечение компании Autodesk, программы Maya, 3DS Max, Softimage и другие.

Представленные на данном курсе материал и знания применимы вне зависимости от того, в каком программном пакете вы работаете. Но так как множество крупных анимационных студий используют Maya, и так как нам нужно было выбрать какой-то один пакет для демонстрации процессов создания анимации, мы тоже выбрали Maya. На данном курсе вы можете использовать и другие программные пакеты.

Часть 1: Основы анимации

(продолжительность: 2 месяца)

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

Также вы научитесь наблюдать за окружающим вас миром и замечать вещи, на которые до этого не обращали внимания.

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

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

Полученные в данной части курса знания и опыт станут надёжным фундаментом в вашей дальнейшей анимационной карьере.

Часть 2: Движение и механика тела

(продолжительность 3 месяца)

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

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

Часть 3: Актёрское мастерство

Выражение и передача эмоций

(продолжительность 2 месяца)

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

Задания этой части курса проведут вас через создание анимаций с выражением чувств и перемены эмоций персонажей и создание анимаций говорящего персонажа (монолога/диалога).

Часть 4: Производство короткометражного анимационного фильма

(продолжительность 2 месяца)

Эта часть курса будет не менее интересной и захватывающей, чем предыдущие. Вы пройдёте весь путь производства собственного короткометражного фильма!

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

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

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

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

Знания, полученные вами на курсе «Анимация персонажей», применимы и полезны вне зависимости от того, какой программный пакет для создания анимации вы используете - MAYA, 3DS Max, Softimage, Cinema4D, Houdini, Blender, Lightwave или другие.

Мир open source не стоит на месте и постоянно развивается. Про Blender 3D написано уже много статей, но помимо Blender, существует еще много полезных и бесплатных программ. Одна из них, это MakeHuman . На Хабре упоминания о ней имеются, но какой либо информации по ней нет. Предлагаю вам заглянуть под кат и посмотреть, что анимация персонажей в связке MakeHuman+Blender3D, это действительно просто. Осторожно, много картинок.

Подготовка

• Windows 7,8: C:\Users\%username%\AppData\Roaming\Blender Foundation\Blender\2.6x\scripts\addons
• Windows XP: C:\Documents and Settings\%username%\Application Data\Blender Foundation\Blender\2.6x\scripts\addons
• Vista: C:\Program Files\Blender Foundation\Blender\%blenderversion%\scripts\addons (this is valid at least for blender 2.69)
• Linux: /home/$user/.blender/$version/scripts/addons

Запустим Blender и перейдем в настройки (Ctrl+Alt+U).
В дополнениях, у вас должен появиться пункт MakeHuman, при выборе которого вы увидите три дополнения, которые необходимо активировать проставив галочки.

Также необходимо активировать дополнение Import-Export Make Human:

Последнее, что необходимо сделать в настройках, это поставить галочку возле Auto Run Python Scripts (необходимо для работы скрипта импорта).

Сохраняем настройки нажав Save User Settings.

Моделирование персонажа

Сразу скажу, что русский язык включается в настройках.

MakeHuman, это генератор персонажей мужского и женского пола. По пиктограммам и надписям, думаю понятно, какой ползунок за какую часть человеческого тела отвечает.

Во вкладке «Моделирование» персонажа можно состарить, изменить цвет кожи, сделать ему длинные руки, ноги и т.д.
Во вкладке «Геометрии» персонажа можно одеть, добавить ему волосы, зубы, брови, веки, язык и другие необходимые органы (если требуется).

Для примера, я сделал вот такого симпатичного молодого человека.

Теперь, необходимо добавить ему кости для анимации.
Переходим во вкладку Поза-Анимировать и выбираем любые понравившееся кости. Я выбрал кости «Basic».

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

Анимация

Ищем сохраненный ранее файл и выбираем его.

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

Blender поддерживает формат анимации bvh. Данную анимацию, в основном, получают с помощью Motion Capture. В интернете много файлов с готовой анимацией. Мы возьмем анимацию отсюда . Скачиваем архив Zip file for BVH directories 01-09 (45 MB). и распаковываем.
Убеждаемся, что в Blender выбран наш персонаж и в так называемом «T» окне, выбираем вкладку Misc и нажимаем кнопку Load And Retarget.

В открывшемся окне выбора файла, выбираем любой понравившийся нам файл с анимацией bvh, который мы скачали ранее.

И теперь можно насладиться нашей анимацией, нажав кнопку Play.

Немного полезностей

2. После того как вы накопите у себя много файлов с анимациями bhv, становится трудно ориентироваться в них всех. Естественно, вам хочется иметь какой-то предпросмоторщик. И он есть. Называется bvhacker, является бесплатной и open source программой и живет . Так же, с помощью него можно исправлять и корректировать анимацию.

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

В следующей статье расскажу о том, как создать анимацию, используя камеру и motion capture в blender.

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

РАЗРАБОТКА ОБРАЗА ПЕРСОНАЖА

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

Для начала необходимо изучить вводные материалы (ТЗ, сценарий, литературное и режиссерское описание персонажей), пообщаться с режиссером, который попытается как можно точнее донести свои мысли до художника. Ознакомиться с особенностями стилистики проекта, про которую расскажет художник-постановщик, либо режиссер, если на этапе создания персонажей художника-постановщика на проекте еще нет. По результатам знакомства с проектом стоит сделать ряд зарисовок, отметив для себя какие-то наиболее важные моменты, которые пригодятся в дальнейшей работе с персонажем.

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

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

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

Следующий этап - "обкатка" персонажа.
Выбранный, но пока сырой вариант обыгрывается в действии. Для этого потребуется нарисовать персонажа в присущих ему позах. Лишние детали по ходу работы исключаются и заменяются на новые, более подходящие для героя и наиболее удобные в работе.

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

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

ХАРАКТЕРНЫЕ ПОЗЫ ПЕРСОНАЖА

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

Характерные позы персонажа бывают "Естественные" (непринужденные), "Привычные" (рефлекторные) и "Постановочные" (эмоциональные):

- "Естественные позы " - это спокойные состояния персонажа в положении стоя с опорой на одну ногу. Реже опорными являются обе ноги, с равномерно распределенным центром тяжести.

- "Привычные позы " - характерные для героя положения тела, принимаемые рефлекторно в соответствии с настроением персонажа, например: задумчивость, возбужденность, усталость.

- "Постановочные позы " - нарочито-преувеличенные позы принимаемые героем в присутствии третьего лица, например: флирт, восторг, удивление, стыд.

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

Любопытный факт:

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

- "Плоско-вогнутая " спина характерна для женщин. Такой изгиб спины хорошо подчеркивает женские формы в области талии и бедер;

- "Плоская спина " свойственна военным, когда нужно преувеличенно показать выправку;

- "Круглая спина ", как правило, принадлежит долговязому, неуверенному в себе молодому чело-веку или высокому, худощавому старцу;

- "Вогнуто-круглой спиной" обладают монстры с мощным торсом.

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

Положение головы персонажа напрямую связано с настроением героя. К примеру: голова приподнятая вверх подчеркнет уверенность, высокомерие или мечтательность; опущенная - ярость и агрессию, усталость или грусть; чуть опущенная с наклоном в сторону - смущение и флирт, а в положении прямо - удивление, страх или раздражение. Несмотря на определенную закономерность, существуют приемы, нарушающие эти принципы, но это уже можно считать исключением из правил.

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

ПОСТРОЕНИЕ ПЕРСОНАЖА

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

Как мы знаем, любой сложный объект состоит из простых форм (кружков, овалов, треугольников, прямоугольников). Задача художника детально разобрать своего персонажа на простые формы, показать способы их соединения на осевых линиях и уточнить пропорции. Схема построения персонажа должна быть проста, логична, удобна и понятна. Чем грамотнее продумана схема построения, тем проще будет дальнейшая работа с персонажем. Стоит отметить, что техника создания персонажа у каждого художника индивидуальна - одни сразу строят персонажа при его создании, другие рисуют персонажа без построения, ориентируясь на свой опыт и интуицию. Тем не менее, независимо от техники создания персонажа, разбирать его на "болванки" всеже придется, если конечно речь не идет об особой анимационной стилистике, где важен только образ, а построение персонажа не играет большой роли.

Примерно так может выглядеть персонаж

Не редко бывают случаи, когда возникает необходимость приспособить (адаптировать) статичного персонажа с иллюстрации для анимационного проекта. Для этого достаточно заново построить персонажа, разбив его на "болванки", вместе с тем упрощая мелкие детали.

Пример статичного персонажа приспособленного (адаптированного) к анимации.

С животными работа происходит по той же схеме как и с людьми.

ЭМОЦИИ ПЕРСОНАЖА

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

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

УТОЧНЕНИЕ ДЕТАЛЕЙ

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

Для уточнения деталей создаются дополнительные листы.

СРАВНИТЕЛЬНАЯ ТАБЛИЦА

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

Эпизодичные персонажи, как правило, не включаются в сравнительную таблицу. Для них создается отдельный лист, привязанный к "линейке" с помощью масштабной сетки. Либо делается сравнение с героем из таблицы (с которым взаимодействует эпизодичный персонаж).

Sponsored Content

This sponsored post features a product relevant to our readers while meeting our editorial guidelines for being objective and educational.

What You"ll Be Creating

Как графический дизайнер, вы, должно быть, знакомы с Adobe Photoshop. Но Photoshop, хоть и является мощным инструментом, не достаточно хорош для всего – например, попробуйте анимировать что-то помимо прыгающего мяча! К счастью, есть другие программы, в которых можно анимировать персонажа, созданного непосредственно в Photoshop, поэтому вы можете проектировать в ПО, предназначенном для проектирования, и анимировать в ПО, предназначенном для анимации.

В этом руководстве я покажу, как использовать такую программу как CrazyTalk Animator 3 для анимации персонажа, созданного в Photoshop. Я научу вас, как подготовить персонажа к редактированию, как создать кости, как импортировать в CrazyTalk Animator и затем как анимировать тело и черты лица при помощи как простых, так и расширенных техник.

1. Как создать персонажа для анимации

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

Персонаж легче всего анимировать, если он состоит из простых фигур. В Photoshop их можно создать в качестве Фигур при помощи Инструмента «Перо». Это не сложно, но если вы хотите научиться это делать, взгляните на этот очень короткий курс « Есть также более старая версия руководства с отличным упражнением, которое поможет вам в краткий срок овладеть инструментом:

Убедитесь, что ваше Перо находится в режиме Фигуры. Это автоматически придаст цвет контурам. Вы сможете изменить цвет в любое время, дважды нажав на иконку.

Шаг 1

Начните с туловища. Оно не должно быть полностью овальным, постарайтесь сделать переднюю часть слегка меньше. Используйте цвет #acb6b8 . Вам не нужно идеально копировать мою фигуру – просто убедитесь, что она плавная и круглая.

Шаг 2

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

Шаг 3

Скопируйте ногу с лапой и поместите их позади всех остальных слоёв. Измените их цвет на #919a9c.

Шаг 4

Таким же образом создайте две другие ноги.

Шаг 5

Создайте хвост из простого овала. Раскрасьте его цветом #919a9c.

Шаг 6

Добавьте голову с цветом #c1cdcf.

Шаг 7

Добавьте два эллипса для пятен вокруг глаз. Окрасьте их в цвет туловища.

Шаг 8

Добавьте глаза: чёрный круг, белый овал для блика и тёмно-серую фигуру в нижней части для отражения. Глаза должны быть на отдельных слоях.

Шаг 9

Из трёх кругов создайте рот – два из них окрасьте в цвет туловища и один – в цвет ног на фоне.

Шаг 10

Добавьте простой эллипс для носа. Окрасьте его в цвет #ff7dd1.

Шаг 11

Добавьте уши. Окрасьте их в цвет туловища.

Шаг 12

Мы создали все части тела, но лицо так же важно, как ноги или хвост. Вы можете добавить несколько вариантов глаз и рта для достижения нужных выражений лица, которые можно позже использовать в анимации. Держите все варианты в одном месте, чтобы вы могли изменить выражение, показав/спрятав слои.

Шаг 13

Вот все мои слои. Базовые:

• Передняя правая нога
• Передняя правая лапа
• Задняя правая нога
• Задняя правая лапа
• Хвост
• Туловище
• Передняя левая нога
• Передняя левая лапа
• Задняя левая нога
• Задняя левая лапа
• Голова

Если вы хотите анимировать только тело, объедините глаза и рот с головой (вы можете добавить также и уши). Если хотите анимировать лицо тоже, вам понадобится больше слоёв:

• Левый глаз норма
• Правый глаз норма
• Левый глаз закрыт
• Правый глаз закрыт
• Левый глаз улыбается
• Правый глаз улыбается
• Левый глаз напуган
• Правый глаз напуган
• Рот норма
• Рот открыт
• Рот удивлённый
• Рот улыбается
• Рот зубастый
• Правое ухо
• Левое ухо

2. Как добавить кости персонажа в Photoshop

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

Шаг 1

Скачайте набор образцов и перейдите в 01_Templates > Quadruped Template , чтобы открыть образец в Photoshop.

Шаг 2

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

Шаг 3

Выделив слои, используйте Инструмент «Свободное трансформирование» (Control-T), чтобы изменить размер скелета и чтобы он приблизительно совпадал с персонажем.

Шаг 4

Файл с образцом содержит четыре типа элементов:

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

Сначала нам нужно заменить картинки образца с нашими собственными, одну за другой. Откройте группу RL_Image и затем откройте папку внутри неё и удалите содержимое.

Замените его частью тела персонажа.

Проделайте это со всеми папками, кроме Шеи (которой у нас нет) и Головы, если хотите создать анимацию лица позже. Уши можно анимировать как часть тела, но в случае со смотрящей вперёд головой они не должны слишком активно двигаться, поэтому также их исключите.

Шаг 5

Картинки для выражений лица нужно подготовить таким же образом, но у них свои папки внутри группы RL_TalkingHead > HeadImage. Поместите «нормальные» глаза в группу Iris и другие глаза в группу Белка глаза.

Шаг 6

Картинки готовы, теперь можем добавить кости. Кости будут созданы автоматически в CrazyTalk Animator, вам просто нужно указать программе, где находятся суставы. Вы можете взять образец за основу, на которой показано, где у собаки суставы и как они применяются к персонажу.

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

Шаг 7

Покажите сейчас одну из задних лап и найдите соответствующую папку с суставами. Поместите отметку «Выступ_стопы » почти на кончике стопы и отметку «Стопа » - в середине.

Шаг 8

Покажите остальную часть ноги и добавьте другие суставы: Голень для пятки , Бедро для колена и Верхняя часть бедра для бедра .

Шаг 9

Добавьте суставы на другой ноге.

Шаг 10

Теперь перейдите к ногам на переднем плане. Здесь Голень – это запястье , Бедро – локоть , а Верхняя часть бедра – плечо (названия взяты с образца для человеческого персонажа, вот почему они немного смущают при создании кота!).

Шаг 11

Таким же образом закончите создание другой ноги.

Шаг 12

Откройте папку с Туловищем , чтобы назначить суставы для бедра и позвоночника.

Шаг 13

У моего персонажа нет видимой шеи, но нам нужно показать, где она.

Шаг 14

Если хотите, чтобы уши двигались как часть тела, добавьте им кости.

Шаг 15

Если хотите анимировать черты лица, перейдите в RL_TalkingHead и откройте папку «Кости головы ». Поместите отметки на соответствующие черты лица.

Шаг 16

Наконец, расположите Опорный элемент объекта прямо под лапами персонажа (вы найдёте его в группе RL_Bone_Quadruped ) и посмотрите на весь скелет. Теперь он виден как цельная структура, поэтому, если что-то не на своём месте, это сразу будет видно. Если вы заметили ошибку, просто перейдите к группе и сдвиньте отметку на правильное место.

3. Как импортировать персонажа в CrazyTalk Animator

Шаг 1

Когда персонаж будет готов и сохранён, откройте CrazyTalk Animator и нажмите

Ваш персонаж будет перенесён в программу и автоматически показан в Режиме составителя. Вы можете видеть созданные между суставами кости, которые вы назначили в Photoshop. В ушах нет костей, т.к. я сделал их частью головы, чтобы они не двигались (если хотите, чтобы они двигались, просто поместите их в папку группы RL_Image ).

Шаг 2

В Режиме составителя можете немного поэкспериментировать с персонажем, чтобы увидеть, что он готов для анимации. Например, вы можете нажать на «Предпросмотр », чтобы протестировать суставы.

Шаг 3

Если нажмёте Edit Pose , вы сможете настроить персонажа.

Например, можете сдвинуть целую часть тело с костями, если обнаружили ошибку…

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

Шаг 4

Если этих параметров не достаточно, и вы хотите что-то изменить в Photoshop для удобства, просто нажмите Launch to External PSD Editor. Либо можете просто открыть файл снова, изменить его и ещё раз импортировать.

Шаг 5

Вы можете заметить, что некоторые слои смешались в процессе назначения костей. Сейчас мы можем их подправить. Перейдите в Менеджер слоя…

И перетащите слои туда, где они должны быть. Я поместила уши над лицом и переднюю правую ногу и лапу - над головой.

Шаг 6

Когда будете готовы начать создавать анимацию, выйдите из Режима составителя, нажав Back stage.

4. Как добавить простую анимацию персонажа

Шаг 1

При наличии готового персонажа его очень легко анимировать! Сначала откройте редактор Window > Timeline.

Шаг 2

Нажмите Motion , чтобы увидеть типичную панель таймлайна под персонажем.

Шаг 3

В CrazyTalk Animator есть набор примерных анимаций, которые можно использовать сразу же. Просто перейдите в Менеджер содержания…

Откройте вкладку Анимации ...

Перейдите в Движение ...

И перейдите в папки: G3 Animals. ..

... Коты...

... Движение...

Пока не увидите список доступных действий. Есть много видов действий. Здесь, к примеру, у вас есть начальное движение (1S ), цикличное движение (2L ) и конечное движение (3E) . Вы можете использовать все виды для создания плавного движения.

Чтобы добавить анимацию, просто выделите своего персонажа и дважды кликните на движении. Для простой анимации ходьбы добавьте одну Прогулку (1S ), две Прогулки (2L) и одну Прогулку (3E).

Шаг 4

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

Если хотите больше готовых движений, вы можете найти их в наборе G3-Animals: Cats.

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

Готовые движения универсальны, они созданы для костей, но не для картинок, поэтому иногда они могут не полностью подходить под вашего персонажа. Например, для смотрящего вперёд персонажа, как у меня, нет движения Сидеть и Облизывать. Но это не проблема – мы можем создать такую анимацию (и многое другое) сами!

Шаг 1

Откройте 2D Motion Key Editor.

Шаг 2

Сдвиньте маркер туда, где вы хотите организовать движение.

Шаг 3

Примените изменения. Двигайте и вращайте кости для расположения своего персонажа.

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

Шаг 4

Итак, наш котёнок садится. Теперь нам нужно, чтобы он двигал лапой и облизывал её. Как вы только что заметили, анимация происходит между ключевыми кадрами – теми, где что-то было изменено (указано точкой на таймлайне). Если вы хотите, чтобы ваш персонаж оставался в определённом положении какое-то время перед началом анимации другого изменения, просто добавьте ключевой кадр вручную, нажав V.

Шаг 5

Сдвиньте маркер туда, где движение должно остановиться.

Шаг 6

Снова расположите кости по своему усмотрению.

Шаг 7

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

6. Как анимировать выражения лиц

Теперь вы знаете, как анимировать тело, но что насчёт лица? Это тоже не очень сложно!

Шаг 1

Добавьте ключевой кадр, где должно начаться движение.

Шаг 2

Откройте редактор Face Puppet.

Шаг 3

Выделите кота как Профиль анимации лица.

Шаг 4

Нажмите на Предпросмотр и сдвиньте курсор к центру лица персонажа. Нажмите Пробел и подвигайте курсор вокруг, чтобы увидеть, как котёнок следит за ним!

Шаг 5

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

Вы можете заставить персонажа моргать, нажав левой кнопкой мыши во время предпросмотра. Это пригодится!

Шаг 6

Некоторое время попрактикуйтесь с предпросмотром, пока не запомните, как двигать голову для достижения нужного эффекта. Затем нажмите Record и пробел или Enter , чтобы записать движение. Снова нажмите Пробел для завершения.

Выглядит хорошо!

Шаг 7

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

Шаг 8

Поместите маркер на некотором расстоянии от этого ключевого кадра...

И снова установите положение персонажа.

Шаг 9

После завершения анимации я хочу, чтобы котёнок наклонил голову и улыбнулся. Первую часть можно сделать при помощи 2D Motion Key Editor...

А другую – при помощи Sprite Editor.

Шаг 10

Установив маркер на нужном кадре, выделите тот элемент лица, который вы хотите изменить, и затем выделите картинку, которую вы хотите установить на замену.

Он улыбается!

Шаг 11

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

7. Как завершить анимацию

Но что, если вы хотите добавить немного анимации в начале, где слишком мало кадров? Не проблема! Давайте просто добавим больше кадров.

Шаг 1

Убедитесь, что в списке есть Project .

Шаг 2

Нажмите Collect Clip.

Шаг 3

Нажмите Insert Frame.

Шаг 4

Введите количество кадров, которое хотите добавить. Не бойтесь добавить слишком много – пустые кадры легко удалить.

Шаг 5

Кадры добавлены! Я решила заполнить их анимацией ходьбы.

Шаг 6

Убедитесь, что в таймлайне достаточно места для двух анимаций, и что они встречаются в нужный момент.

Шаг 7

Котёнок теперь ходит на месте, но это можно исправить. Просто перейдите к первому кадру и сдвиньте персонажа за сцену.

Скорость движения будет подстроена под расстояние автоматически.

Шаг 8

Шаг 9

Когда анимация будет закончена и готова к показу, перейдите в Render > Render Video.

Шаг 10

Настройте параметры по своему усмотрению. Убедитесь, что Диапазон