Перейти к содержанию

Добро пожаловать в сообщество творческих людей - ARTTalk.ru!

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

Для новых пользователей доступна регистрация.

Тема для обсуждения новой версии сообщества.

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

DerPapst

Персонажная анимация

Рекомендуемые сообщения

hbjb_animation_highres_198.jpg

В статье за прошлый месяц Paul Shih ( Пол Ши ) обучал вас процессу разработки двух персонажей во флеш ( Flash), из его серии работ “Леденящая душу компашка ” , о кроликах , любящих тяжелый рок.

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

 

Мы также рассмотрим некоторые инструменты Flash CS4 :в частности the Bone tool,которая позволяет связать все части персонажа вместе, что является необходимым для анимации рук и ног.

Эта система позиционируется как “Инверсивная кинематика ”(inverse kinematics) , которую ,благодаря исключительному удобству ,широко используют “персонажные аниматоры”. 3D Rotation tool позволяет создавать 3D-эффекты с 2D объектами- мы будем использовать этот инструмент для создания псевдоанимации головы персонажа. Мы так же изучим основы анимации с помощью motion tweens.

01a_611.jpg

Шаг 1 Во-первых, мы должны подготовить свой проект для последующего анимирования , так что для начала откроем character design document. Если вы не изучали статью по теме за прошлый месяц , открываем hbjb_animation1.flv из Download Zone . Необходимо удалить ‘outline’ слой наброска, а также разблокировать все слои, чье имя начинается с 'HB' – знакомьтесь , это наш персонаж мальчег ).

Выберите (Cmd / Ctrl + A) и щелкните правой кнопкой мыши на фрейме , выберите Cut Frames, и превратите его в символ (F8). Далее, жмякаем на Вставка> Новый символ(Insert > New Symbol), называем его HB и выбираем Movie Clip, как идентификатор данного типа. Щелкните правой кнопкой мыши на blank frame и выберите Paste Frames.

02_211.jpg

Шаг 2 Теперь, когда мы представили наш персонаж в виде особого символа, мы будем делать то же самое для каждой подвижной части тела, начиная с головы. Lock-аем все слои, кроме рта, глаз и головы. Выделяем все элементы , щелкаем правой кнопкой мыши на frame, выбираем Cut Frames, создаем новый символ Movie Clip, и обзываем его ‘HB Head’, жмякаем правой кнопкой мыши на первый blank frame и вставляем фреймы.

03_740.jpg

Шаг 3 Мы удалили грубые наброски в шаге 1, а теперь, чтобы вдохнуть некоторую “эстетичность” в проект приступим к созданию индивидуальных набросков для каждого элемента. Выбираем Selection Tool (V), дважды щелкаем на контур головы: данная процедура позволяет выделить и выбрать все “общие ” линии в работе .Выберите Правка> Копировать (Cmd / Ctrl + C), создайте новый слой в нижней части стека слоев, Правка> Paste In Place (Cmd / Ctrl + Shift + V) и увеличьте stroke size до 18 точек ( Points / сокр. Pt)

04b_332.jpg

Шаг 4 Чтобы собрать перса , перейдите на ‘HB’ symbol, удалите руки персонажа –в процессе мы заменим их анимированным эквивалентом.Откройте окно библиотеки (L) и перетащите HB rArm1 и HB rArm2 “на платформу”( stage) в том же слое(Layer), а затем ‘HB Guitar’ и ‘HB Head’, каждую в своем отдельном слое. Если вы разрабатываете свой собственный Flash file, откройте hbjb_animation1.fla и копируйте все символы из библиотеки.

05b_180.jpg

Шаг 5 Очень важно , чтоб все элементы были в нужных местах и в правильном порядке. Сверху вниз слои должны быть расположены в порядке: голова, туловище, руки, гитара, ноги. Перетащите элементы, согласно Screengrab-у выше, а затем используйте Free Transform tool (Q), чтобы получить возможность вращать руки. Убедитесь в том ,чтоб HB rArm2 находились спереди , нажмите правой кнопкой мыши на символе, выберите пункт Упорядочить> На передний план (Arrange > Bring to Front), и, наконец, повторите шаг 3 для создания толстых контуров для ног

05b_180.jpg

Шаг 6 Нажмите на вкладку “Сцена 1”( Scene 1 tab )для того чтобы вернуться в рабочую область(stage) и перетащите символ HB из библиотеки на новый слой с именем "HB”. После выбора символа , установите позицию (position) в окне Свойства(Properties window) (Cmd / Ctrl + F3) в положение X: 586, Y : 355.Так же необходимо увеличить частоту кадров для достижения более плавной анимации - кликните на stage, чтобы отменить выбор, а затем в свойствах(Properties) выставьте FPS до 24 .

07b_160.jpg

Шаг 7 Теперь HB полностью готов к анимации. Дважды щелкните на символе HB: мы будем использовать Bone tool (X), чтобы оживить его правую руку.Выберите Bone tool для выделения и определения его “костной системы”, зажимаем и передвигаем от плеча до локтя, а затем и от локтя до внешнего ребра ладони ( вершина предполагаемого среднего пальца ) руки персонажа.

08a_130.jpg

Шаг 8 Создавая структуру костного скелета, Flash так же создает новый слой, называемый 'якорь' (‘Armature’ layer ) ;оригинальный слой, который участвовал в создании костной системы будет пустым, так что мы можем смело удалить его. Теперь мы можем оживить кости. Выберите frame №19 на всех слоях. Щелкните правой кнопкой мыши, выберите Insert Frame, и на frame 4 слоя ‘Armature’ используйте инструмент выделения (Selection tool ). Нажмите и перетащите его руку, как показано на рисунке выше

09_636.jpg

Шаг 9 Вот тут я заметил, что локоть смещен. Чтобы исправить это, используйте Selection tool удерживая нажатой клавишу Cmd / Ctrl и перетащите HB rArm2 в место, где область локтя выглядит корректно. Продолжайте редактирование позиционирования эл-тов для каждого третьего фрейма

10a_117.jpg

 

Шаг 10 Теперь HB научился помахивать гитаркой и теперь мы можем попробовать усилить его рок-расколбас , добавив обрывистые движения головой ( в русском языке ( сленг ) часто называемые ГРИВОТРЯСОМ ) . Правой кнопкой мышки жмякаем на любом фрейме ‘HB head’ слоя,далее выбираем команду Create Motion Tween, переходим к фрейму 4, используя 3D инструмент вращения(3D Rotation tool) (W) указываем голову символа

В окне "Свойства"( Properties window), откройте вкладку Положение и 3D вид (3D Position and View): установить Vanishing Point в значении X =401 и Y= 200 .

11b_522.jpg

Шаг 11 Продолжаем выгибать вперед голову на фрейме 4 : далее будем применять инструмент 3D вращения(3D Rotation tool), перетащив красную ,вертикальную линию вправо примерно на восемь частей от круга так , чтоб голова теперь начала парить в воздухе. Используйте Selection Tool (V) и выберите head symbol, а затем, удерживая Shift и перетащите его вниз до половины тела.

12b_634.jpg

Шаг 12 В фреймах 7, 13 и 19 голова должна быть приподнята, как на фрейме 1 – следуя последнему шагу, отведите перетаскиванием красную линии влево. В фреймах 10 и 16 голова должна быть чуть опущенной и наклоненной вперед ,однако в меньшей степени нежели на фрейме 4.

13_206.jpg

Шаг 13 Теперь вы изучили некоторые инструменты для анимации персонажей, повторите эти действия для другого персонажа, JB, начав с создания Movie Clip symbol для нее. Для нее необходим только один набор рук в библиотеке, так что можно задать их положение с самого начала, затем скопируйте и вставьте руки и выберите Modify> Transform> Flip Horizontal, чтобы отдублировать руки для противоположной стороны.

14a_965.jpg

Шаг 14 Для JB, слои должны быть в порядке: голова, руки, тело, барабан, и ноги. Обратите внимание, что руки перекрывают тела в области плеча. С помощью Selection tool выберите верхнюю часть тела. Затем выполнитеСкопировать> Правка> Вставить на место (Copy > Edit > Paste in Place ) , чтобы вставить эту часть верхней части тела в новом слое над руками

15b_128.jpg

Шаг 15 Давайте сделаем голову JB движущуюся как метроном. Используйте инструмент Free Transform tool (Q) нажмите на голову, а затем перетащите белые точки вниз головы и разместите их по центру , где она соединяется с шеей. Сделать Motion Tween, на фреймах 1, 17 и 33. Установите значение Rotate value на -15 в Transform window (Cmd / Ctrl + T). В фреймах 9 и 25, установить Rotate в значении 14 .

16_122.jpg

Шаг 16 Используйте то, что вы узнали в этом руководстве для завершения движения JB –“Барабанный Бой”.Не бойтесь проявлять инициативу в работе и пытаться привнести в нее что то от себя. И наконец, оживите их заранее анимированным фоном, путем перетаскивания "фоновых" символов(‘Background’ symbol) из библиотеки в новый слой в самом низу, привязывая его к центру сцены.

Автор -- Paul Shih ( Пол Ши )

Адаптивный перевод by DerPapst

09.jpg.c30245653448faaacdd76b45f74311a2.jpg

08a.jpg.92c8a3f2d2a8ddcb0fdf48d990250cc3.jpg

07b.jpg.f0b5e00af690ccb33c84b30beda72c3d.jpg

06b.jpg.b4e6c7be91395da04936985b36ca381e.jpg

05b.jpg.12bd91b8443b6a7e1fbd98b6ccc23443.jpg

04b.jpg.e9eac7d5d42c5dbb31cd87a652373216.jpg

03.jpg.395eb3a40f53895c430a078180ebf40f.jpg

02.jpg.f083a4e25c88ffe47fde48295708ac59.jpg

hbjb_animation_highres.jpg.e9dcd1e47586c061601c4531706e4712.jpg

01a.jpg.633b90f8873e5f71da54cad429204b0a.jpg

09.jpg.1e72316b092ecd495a260b694a862d9c.jpg

08a.jpg.8cd419f7c1cc11b3a3ec7e4605548ffa.jpg

07b.jpg.387df35bf69612064d90e41db7c4d1bd.jpg

06b.jpg.bbbbb2f2db96363621afae7c911448e2.jpg

05b.jpg.f5c716bbd5f6b18bace51c7114fc5fe4.jpg

04b.jpg.cdc935a8eb5d6609dda61e347579485d.jpg

03.jpg.8512c3448775477ad6e88cac1be8a76e.jpg

02.jpg.1823208ac1c7f612b05c6c72a3e7e73b.jpg

hbjb_animation_highres.jpg.d79282e81b4febe600d018a6a2fcd5a0.jpg

01a.jpg.746dd4c844829281b337c78c268e276a.jpg

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти


×

Важная информация

Мы разместили cookie-файлы на ваше устройство, чтобы помочь сделать этот сайт лучше. Вы можете изменить свои настройки cookie-файлов, или продолжить без изменения настроек. Условия использования