Прислали ссылку. Набираем 10 человек на тест. Кто хочет, отпишитесь, будем вместе рады помочь ребятам. От меня — ссылка, блины и варенье. От ребят — почти интересная игра про бродячую собаку сделанная на каком-то физ движке. Целую. Люблю.

email: moy@murlyka.com

при поддержке WayToRise

Ссылка на игру на FGL (нужен аккаунт)
О том как разрабатывалась игра я уже писал, и даже выкладывал видео по дизайну вроде бы быка, так что — наслаждайтесь!

email: moy@murlyka.com

при поддержке WayToRise

Концепт и графика — Bred

Код, правка наших кривых рук, лидинг — Chrust.

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

email: moy@murlyka.com

при поддержке WayToRise

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

3) Анимация.
Это как правила самая долгая стадия в разработке персонажей. Главная задача аниматоров придать классу свою собственную, отличительную особенность (а как вы думали? — бить кулаком/мечом, или делать пассы руками в воздухе — каждый может анимировать такую ботву, а вот как сделать так, чтобы классы имел свой собственный характер, и был не похож на другие классы — это задача не из легких, впрочем, в WakFu, ребята из Анкамы это вообще проигнорировали, а в Dofus, как-то не организовали нормально. Сложнее всего дизайну даются классы персонажей ближнего боя — одними заклинаниями тут не обойтись, ещё экшн нужен. Вообщем, этот этап может занимать от двух недель и больше.

4) Эффекты.
Вот персонаж машет руками, что-то там шепчет, а ничего и не происходит, вот чтобы что-то происходило, как раз и есть такой этап как FX — сидишь себе, рисуешь красивые переливы цветов, всякие странные штуки, свечения, огни, молнии и пр. От 10 дней.

5) Программирование.
Всё вроде сделано, теперь можно и посмотреть, как это всё работает в деле. Связка между собой действий. Прописывание персонажу координат (мир изометрический), редактирование важных точек.

6) Писание скриптов.
Вот этот пункт, как я думал, равен предыдущему, но не тут то было… для ребят из Анкамы. Скрипты отвечают за правильно выполненную последовательность действий, при получении удара — загнись и скорчись, при победе — попрыгай от радости.

7) Описание персонажа.
Рассмотрение всех изменений, вывод чистового диздока на рассмотрение судей-арт-директоров.

8) Озвучка.
Озвучивается кждое действие, шаг, кряхтение, эмоция персонажа

9) Тест и окончательный баланс персонажа.
Вот этот пункт даже у меня в работе, всегда меня обходил. Я особо никогда не участвовал в тесте и обкатке персонажей. Почему? Начиная тестировать анимацию персонажа, в рабочем виде, как ни странно, вдруг находятся откуда ни возьмись, куча ошибок, недочетов. Вечный перфекционизм аниматора встаёт в протипостояние со сроками сдачи игры, и грамотные программисты (как наш), просто напросто не дают нам иногда «немножко поиграться, да посмотреть» в почти готовый продукт:)

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

email: moy@murlyka.com

при поддержке WayToRise

С героем, а точнее с пафосным созданием гламурного (терпеть не могу этого слова) персонажа (и это тоже терпеть не могу) вроде как-то усреднилось, и вроде, все справились. Вроде, даже кому-то там понравилось, да? Мне тоже. Безумно понравилось. Ага-ага, особенно в частности многие из вас. Образы были хороши. Потом даже сделаем некую галерею, где будем (поливать грязью) обсуждать работы друг-друга.

Ну, перейдём к теме сегодняшнего дня.

Сегодня мы углубимся в тему создания и разбора нашего персонажа. Как мы все поняли из введения, хоть мой Джонни у меня, в футболке супермена (лучше бы кроссовки одел) и в трусах в сердечко, это ему ещё не даёт никакого шанса на выживание (ну может быть совсем чуть-чуть, минимум-минимум) в борьбе за спасение мира. Нет, конечно он может появиться перед злобным врагом в таком виде и сразить бедного злодея наповал своим эго, вызвав у того истерические смехо-конвульсии, но мы так делать не будем. Хотя один вид Пабло уже даёт нам форы в победе, как минимум, со стороны психологической атаки.

Для продления жизни нашего героя, нам нужно составить план того, что будет ему, хотя бы, помогать укрываться-скрываться, бегать, прыгать от атак, и в ответ самому атаковать. Мы набрасывали образ персонажа, теперь делаем план анимации, по которой наш персонаж будет создаваться, да креативиться.
Начнём с базовой анимацией. И так. Сегодня урок по базовой анимации. Её некоторые проходилил в FGA, но немного долго, и немного в разрозненном ключе. Шутки в сторону. Да здравствует отжиг.

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

Начну с того, что любому, сколь крутому герою, несмотря на всю его крутость нужно двигаться (а ведь можно просто стать памятником, и двигаться не надо будет)! Что входит в движение? Это перемещения по горизонтали, с разной скоростью (да! мы будем делать разную скорость перемешения), перемещение по вертикали   — прыжок, и нужно как-то атаковать злых монстров: а то как это — они нас атакуют, а мы их что ли нет? Нет! И мы их будем атаковать!

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

Как же нам заставить двигаться нашего персонажа в плоскости ведения земного боя?
Встречайте, наших героев на сегодня:

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

Хочу сразу сказать, что количество кадров какой-либо циклической анимации, нужно делать так, чтобы получалось целое число циклов в секунду. На пример, можно сделать анимацию в 1, 2, 3, 4, 6, 8, 12, 24 кадров, и тогда, количество циклов в одной секунде анимации будет равно — 1, 12, 8, 6, 4,
3, 2, 1 соответственно. Выбор достаточно велик, не правда ли?

Маленький чит: Важно сразу сказать, что изначально, в цикле, только два кадра могут быть предельно одинаковы. Это кадр номер 1 и кадр номер последений+1.  Взяв цикл в 8 кадров. Рисуйте анимацию так, чтобы совпадали первый и девятый кадры, потом удаляйте 9 кадр, и вуа-ля, всё становится на свои места. Я рассказывал о похожем приёме ещё в FGA, но приводил другой пример, и с количеством кадров, несколько большим нынешнего (там было 100 кадров).

Я придумал, что скорость бега, в прицнипе, должна быть выше скорости ходьбы. Но как это реализовать? И тут нам в первый раз приходит на помощь, его величество Тайминг. К сожалению, или всеобщему счатью, правление Тайминга настолько грамотно и справделиво в королевстве анимации, что не сместить нам этого, уже обрюзшего и полысевшего старикана с трона… ну и пусть там и сидит, главное чтобы помогал, но не усложнял жизнь. Тайминг… тайминг… вот и он!

Прикидывая, что жизнь начинается совсем нелёгкая, я решил, что бег будет примерно в два раза быстрее ходьбы. Этого можно добиться двумя способами — первый — уменьшить количество кадров бега в два раза, второй — визуально, сделать шаг бега, в два раза длинее шага анимации. Помним из курса школной физики, что V=s/t? Ну так вот, нам нужно получить 2V. А как это сделать? Либо увеличить S (длина шага), сделав его 2S, либо уменьшить t (количество кадров), сделав их 0.5t. Я попробую оба способа, вы пробуйте тот, который хотите.

Важный чит, про который многие не знают, и многие просто забывают! Для создания цикла шага мне потребуется заново отрисовывать ноги — насколько я хорошо помню, я создавал цельные ноги, без особых делений на куски. Но на той мой путь — классического аниматора. Я создаю сетку, под названием grid_grid. Что это за файл? Это такой интересный файл, в котором у меня будет хранится вся информация по ногам. Откуда, какие, для чего и почему. Именно из этого файла я всегда буду вытаскивать нужное положение ног, и именно в этот файл, будут подключаться дополнительные ноги, которые я буду рисовать для тела.

Файлы типа Grid не участвуют в самих сценах. Такие же файлы будут создаваться для рук, головы, шлема, меча, и возможно кое-ещё для чего. Зачем это? Это сокращает (сильно сокращает) время рисования остальных анимаций. Фактически, файлы grid_ — это библиотеки, с сохранёнными массивами используемых частей тела. Библиотека части тела!

Вот какие ноги и руки получились у меня:

Возвращаемся обратно к нашей анимации, создаём два файла hero_walk и hero_run.

Скачать видео по анимации ходьбы.

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

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

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

Переходим к прыжку?

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

А с прыжком у нас всё в порядке, в полном порядке. И так. Рассмотрим как действует прыжок? Анимация прыжка начинается из обычного статического положения (прыжок с места) и нестатического положения (прыжок с бегущей или идущей анимации). Причем эти два прыжка имеют и отличия-то небольшие, почти совсем схожи. Если первый — начинается с положения стоя, то у второго прыжка можно попробовать оставить все кадры, убрав только первые кадры подготовки к прыжку (статика-присед-выпрыгивние). Почему так? Всё дело в том, что для прыжка с разбега не нужно старотового усилия — оно уже есть в энергии движения (бег и ходьба), следовательно и присаживаться не нужно… и к тому же… видели ли вы когда нибудь, чтобы кто нибудь в процессе бега немного приседал, для подготовки к прыжку? Вот. Я тоже не видел, не естесственно это как-то. А ещё лучше, дабы не запугивать детей и взрослых странным присаживанием, да и чтобы программисты не мучались с путаницей прыжков, — мы делаем один, но зато красивый.

Технически, как высота прыжка, так и его длина — регулируются программистами, получившими мувиклип с прыжком, и описанием прыжка. Но так как мы грамотные ребята, мы даже описания им не пошлём(!) Обойдутся!:) Ещё чего? Ишь! Мануалы им слать!

По хорошему, мы подготовим все клипы для программистов. В конце шага я расскажу как это делается.

Сейчас мы просто анимируем прыжок, такой, каким его видим мы. Дублируем нашего hero, и называем его hero_jump. Пусть будет так.
На замедлённой анимации показан весь цикл прыжка, каким он должен быть, видно как идут руки (о-да, тот самый жест), и как передвигаются ноги, так же, видна знакомая по FGA группировка в конце прыжка. Всё, вроде-бы, по делу, так? так.

На нормального-вида анимации я убрал фазы подготовки и   выхода из падения. Так он будет выглядеть «в жизни».

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

Возвращаясь к «медленному» прыжку.
Прыжок делится на две фазы — подъем (up) и спуск (down). В подъёме, как мы видим — ничего страшного, просто небольшая группировка ног… в спуске, как мы видим тоже лишь группировка ног. Соединив это всё правильно-габбаритной анимацией (количество внутррених кадров клипа heroJumpUp совпадает или меньше (пояснения ещё ниже) с количеством кадров подъёма, названного на таймлайне — Up, тоже самое — со спуском). Естественно до создания этой анимации, мы прикидываем, собственно, сколько у нас будет длиться прыжок (в количестве кадров).

Вы когда нибудь видели, чтобы всю первую фазу человек семенил своими ногами туда-сюда? Нет? Я тоже. А при спуске? Тоже нет? Вот именно. Именно поэтому, раньше я использовал лишь 5-7 кадров на первую фазу прыжка Up, на последнем кадре, на слое выше основного — код «stop();», сейчас я просто делаю плавные твин преходы. Группировка в полёте останавливается на этом кадре, а дальше наш Алёша летит дальше, спокойно наблюдая за летающими лайнерами и чайками. Полёт начат. Фаза спуска — мой нонейм чувствует падение, и словно настоящий человек, начинает группироваться сверху (и молодец, что сверху, значит грамотный парень). Проходит какое-то количество кадров анимации (предположим 8-11), и всё… опять пресловутый, но столь любимый «stop();». (Кстати, все знают как «stop();» вписывать? Если нет — на почту ко мне го!).

И того, у нас на выходе получилось 3 клипа: hero_jump, heroJumpUp и HeroJumpDown. Причем hero_jump особо нигде не понадобиться, кроме как для просчета анимации прыжка. А heroJump -Up и -Down — это, фактически, трансформации на месте, на основе которых делается hero_jump.

3. Удар… ещё удар… гооооол!
Разбираемся с ударом, ya?
Что такое удар? Это инерционная штука, помогающая нашему герою очистить мир от зла, и всем доказать, что деньги побеждают зло только любовь спасёт мир!

Брюс же не дурак? Да? Да!
А почему так? Да просто потому, что он носит с собой огроменный меч (фанат Клауда из FFVII). Меч ростом с себя любимого — ещё тот девайс, таким не только мир спасать можно, таким ещё и картошку с консервами открыть не стыдно… и дрова нарубить тоже не стыдно… Кстати о дровах! Ими-то и занимался Джонни до того, как кто-то похитил его злобную стерву которая должна ему кучу денег любовь всей жизни. И именно по этому, базовая (базовая! — слово-то какое страшное, а?) анимация удара у Брюса — рубащая. Сверху-вниз (кстати, вы заметили, что он ходит с мечом в руках?).

Тут всё просто — длительность моего замаха примерно равна удару, но вот одно но — амплитуды разные. Я сделал удар, длящийся 8 кадров. 5 замах, 3 удар.

Тут в дело вступает тайминг, подумайте, какие фазы у вас есть (в вашем ударе), и сколько они длятся. Правило тоже — количество циклов удара клипа hero_attack должно быть целым числом в одну секунду. Я полагаю, что минимум кадров будет — 6, максимум — 12. И того, всего три варианты выбора удара.

Как вы заметили — все клипы с hero — это всего лишь анимации, без смены координаты нашего героя, то, есть если бег, то бег на месте, если удар — то опять на месте, если прыжок — то две фазы: подъема и спуска, и опять — на месте! Это всё можно назвать анимацией «действия», а вот что с ней потом делать, и как создать взаимодействие с нашими программистами, я расскажу на совсем простом примере (и даже покажу), но в один из следующих шагов. Пока работайте!

И конечно же задания на сегодня, да?
Я хочу от вас увидеть
1) План базовых (именно базовых анимаций, не нужно планировать ещё что-то, будьте терпеливы) анимаций, с описанием их (особенно сконцентрируйтесь на атаке — опишите её подробно)
2) .fla файл с вашим героем, дополненный клипами hero_run, hero_walk, hero_attack, hero_jump, heroJumpUp и heroJumpDown

Вопросы?

ps. Вот думаю, важны ли вам видео-уроки, к каждой анимации, или ну их?)

email: moy@murlyka.com

при поддержке WayToRise

Ребята (мальчики и девочки, парни и девушки, мужичины и женщины), вы, все те, кто достиг этого урока — супер! Я нереально рад и горд за то, что вы проходите уроки, допускаете ошибки, исправляетесь, и главное, стараетесь. Вы — супер.

Дальше будет немного легче.

И так.

Сегодня пойдёт речь о том, что создаёт атмосферу в играх, именно — о фонах.
Что же такое фоны, и с чем их едят? Фоны, по своей сути — статическая картинка (а мы будем рассматривать именно этот вариант), абсолютно лишённая внутренней анимации. Внутренней? А что за внешняя? Ну как… фоны же должны двигаться? Ну… да. Рассмотрим этот вариант.

Для победного начала (слышал, есть такое выражение — «до победного конца», раз есть победный конец, значит есть и победное начало? Я прав? Или это всё моя алогичность?), я скажу, что фоны мы будем рассматривать бооольшие, однослойные и двуслойные.

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

Далее — фоны однослойные.
Эти фоны, как правило, нестатичны. Они двигаются с главной сценой. Расстояние (психо-визуальное — во, какой термин придумал) от фона до главной сцены — какое хотите. Суть этого фона — он зацикленный.
Как сделать зацикленный фон? Объясняю на пальцах(!) — не смеяться!!!

Создаём мувиклип (insert -> new symbol), рисуем в нём прямоугольник, той длины, которой, приблизительно, вы хотите сделать один фон. Теперь вытаскиваем такой символ на сцену. И… вытыскиваем рядом второй такой же.
Ставим их вплотную друг к другу. Заходи в один из них, и начинаем рисовать наш фон, предварительно, сделав альфу самого прямоугольника очень-очень маленькой, чтобы его совсем чуть-чуть было видно. Изменяя рисунок в одном из объектов, мы видим тоже самое в другом. Что нам это даёт? Мы грамотно рисуем начало и конец фонового изображения — они совпадают, что даёт нам возможность зацикливать картинку.

Как теперь это всё дело анимировать?
Обводим оба одинаковых фона. F8. Далее, танцуем с твинами. Создаём твин (пусть будет 100 кадров). Первый кадр — в первоначальном положении, последний кадр — сдвинут ровно на один объект.

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

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

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

Двуслойные фоны нужны нам для увеличения восприятия и атмосферности происходящего на экране (ууааа!!!). Их исопльзуют по трём причинам:
1) это круто
2) это круто
3) это клево выглядит.

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

Какое задание вам, на сегодня.
Поскольку некоторые соизволили делать Ли, то таким людям задание — нарисовать фон двуслойный, динамичный бамбуковый лес (опа!). Всем другим — по состоянию. Но тоже, двуслойность и динамичность (в зависимости от того, какой основной герой боевика у вас). Кому-то, на пример (не буду показывать пальцем, кому), придётся рисовать спортивный инвентарь на переднем фоне, а на заднем — стены зала (и кому же это, а?:)

Скоро — FGA#6!

Ещё один момент(!)

Теперь, тему письма пишите в формате
«FGA#5 получение пароля к FGA#6 (никнейм на сайте Мурлыка.ком)»
«FGA#5 вопрос. (никнейм на сайте Мурлыка.ком)»
«FGA#5 консультация (никнейм на сайте Мурлыка.ком)»
«FGA#5 продам себя в рабство аниматору (никнейм на сайте Мурлыка.ком)»
«FGA#5 работаю за еду (никнейм на сайте Мурлыка.ком)»

Заметили в конце «никнейм на сайте Мурлыка.ком»?
вот это обязательно.

email: moy@murlyka.com

при поддержке WayToRise

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

Первый рассматриваемый вопрос — работа с программистами, особенности подготовки.

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

Что из этого следует? Из этого следует, что всё, что нам нужно — сделать трансформацию объекта на месте, и не важно — прыжок это, или бег. Для примера, просто вспомните Ли, из первого урока — он бежал на месте;  всё что нужно было — настроить правильно центральную точку (крест) нашего объекта на определённое постоянное положение.

Кстати, об этом крестике. С Рондой у нас произошёл небольшой разговор о точках объекта. Есть две разные точки объекта — точка центра вращения, и просто — центр объекта. Чем они отличаются? Создайте объект. Вытяните его на главную сцену. Клик по нему, далее Q, — объект у нас обведён. Левая верхняя точка (стоит по умолчанию) — центр объекта, именно координаты этой точки и является той координатой, которая показывается в properties. Это крест. Прогаммисты, как правило, требовали закинуть этот крест в центр нижнего ребра объекта, или в центр объекта.

Как это делается? Если внутри объекта у вас только один кадр — просто выделяете все слои (клик по главной сцене ctrl+A, Q), и перетаскиваете простой трансформацией на предположительное положение, где крестик бы установился по центру перемещаемого объекта, либо на нижнюю центральную реску инструмента transform.

Если кадров много. Что делать?
Заходим в объект. Снимаем замки со всех слоёв. Жмёт edit multiple frames, делаем так, чтобы onion markers охватили всё пространство нашего таймлайна. Жмём ctrl+a, и так же, как и с одним кадром — переносим все изображения одновременно в ту точку, предположительно куда, нам и нужно.

Вторая точка — центр вращения объекта. Нажимаем на наш объект (+Q) —  находим кружок. Попробуйте покрутить объект. При rotate — объект будет вращаться вокруг этого кружка. При выделенном объекте, с помощью transform Tool, переместите кружок в другое место из центра, повращайте теперь. Зачем нужно менять положение центра вращения? Это очень удобно делать для таких случаев, когда анимация у нас идёт tween, и нужно анимировать такие вещи, у которых физическим-реальным свойством, прописано вращение вокруг какого-то центра — плечи, ноги, коленные валы, лопасти мельницы. — Ниже мельница, в которой, у каждой лопасти, центры вращения смещенны в ось вала вращения (пометил красным крестом)

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

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

Далее, ниже — просто небольшой рывок из головы, немного убитой фантазии, и вот, что вышло —

Кстати, видели http://vkontakte.ru/app609435_3134517 ?

На сегодня — всё.

Думали всё?

Нет. Я не рассказал самого основного. Как происходит вообще работа с персонажами и объектами, что, каждый раз программист вытаскивает из библиотеки героя? ммм…не, нет.

Вся конструкция закручена так. Есть объект Li, заходим в него, внутри — несколько кадров, в каждом кадре — объекты. Первый кадр — состояние покоя, второй — ходьба, третий — бег, четвёртый — прыжок, пятый — бросок, шестой — получения хита и тп… Программист, начиная работать с Ли, при наличии каких-то внешних аттрибутов (получение удара) — переходит на 6 кадр, и проигрывается эта анимация. Когда мы не жмём на кнопки — кадр выбран первый, когда жмём пробел — четвёртый, и тп.  Скачать немного не тот пример, но чтобы было понятно как.

email: moy@murlyka.com

при поддержке WayToRise

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

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

И так. Где взять конструктор составных частей Ли?

Анимация сегодня будет немного смешанной, по крайней мере для прыжка нам потребуются небольшие знания из прошлого урока.

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

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

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

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

Прыжок, по своей сути, очень прост. Абсолютно такой же, как и в случае с кубом (имеется ввиду таймлайн самого движения прыжка).

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

Теперь переходим к следующей анимации. Анимация броска сюрикена. Для этой анимации нам не нужна будет анимация трансформации. Мы будем использовать покадровый вид анимации, без каких либо твинов. И так, что нам нужно знать в этом деле. Самое главное в любой анимации — представлять себе то, что хочется сделать.

Как вы видите на анимации ниже, я дорисовал ещё пару разных изображений руки Ли, звёздочка помечается на слой, ниже тела. Никаких других отличий, кроме новых фаз рук, от основного конструктора Ли, тут нет (даже ноги теже самые в прыжке использовались, — всего два экземпляра)
Фазы броска:

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

А теперь — задания.
Задания с каждым разом будут всё усиляться и усиляться.
1) Анимацию прыжка мы сделали, анимация броска есть… но как же быть с теми препятсвиями, которые нужно преодолевать сидя или ползком? Я хочу, чтобы вы сделали анимацию присидания (без перемещения), и прислали мне.
2) Анимация прыжка на месте — есть, ура… А как же быть с прыжком из движения? Скажем, не будет же останавливаться наш бодрый герой, и прыгать с места, когда он несся с такой невероятной скоростью? И так, я хочу, чтобы второй анимацией была анимация прыжка из бегущего положения, причем не просто прыжка — а сальто, в прыжке. Что вам нужно сделать? Анимация бега переходящая в анимацию прыжка с сальто.

Да, поскольку вас становится всё больше и больше, присылайте мне на почту письма со следующим форматом темы —
«FGA#3: задание для получения пароля к FGA#4».
И мне будет легче, и вы будете пароли получать быстрее.

Всем удачи в приручении анимации.

email: moy@murlyka.com

при поддержке WayToRise

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

И так, fx, и всё то, немногое, что нам сегодня понадобится.

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

Я акцентирую внимание на самых простых (курс ведь для самых маленьких) эффектах — взрыв и дым. Почему на них? Потому что их можно использовать везде, где только захочется. В некоторых уроках я буду впихивать то, что мы получили здесь, добавляя красок и интересных моментов в нелегкой жизни Кота Ли.

Поскольку курс у нас совсем простой, то я буду ждать вопросов по теме или околотеме.

И взрыв, и дым, по своей технике имеют общие черты. Каждый новый кадр сегодня мы будем рисовать заново, и можно рисовать как векторными инструментами (line & oval tools), так и кистью (это к счастливым обладателям планшетов).

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

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

Смотрим быстро(24 кадра fps):

Вообще, взрыв и дым после него — самый простой эффект, но, который можно усложнить до любых границ. Анимация проста до безумия, не нужно знать никаких особенностей тайминга или владеть какими-то потусторонними возможностями и даром великих аниматоров. В этом уроке я мельчил облако дыма, чего делать, в принципе, никогда не нужно. Я использовал только brush, не привыкнув к новому планшету от wacom, успел наделать пару ошибок. Постараюсь не делать такого. Картинка сверху, со словом «Bang» — это скрин из одного проекта, такое часто приходится делать.

Upd1: тем, кто по каким-то причинам не может рисовать, или читает этот блог не для того, чтобы научиться анимировать простые вещи, — тоже напишите в комментариях, мы подумаем вместе как нам выйти из ситуации. Остальным — работаем дальше! С каждым разом намечается большой прогресс.  Этот курс лёгок до безумия. Будет сложно. Несмотря на всё, я буду стараться быть рядом, и оказывать полную поддержку тем, кто будет работать над собой.

UPD2: некоторым отважным блогерам листы с паролями я пришлю сам лично. Список отважных блогеров я не оглашаю, но они и так знают, что они отважные.

И ещё раз — у вас всё получится.

email: moy@murlyka.com

при поддержке WayToRise

Пусть этот курс будет называться «анимация в играх, для самых маленьких», сокращённо FGA. Пусть этот курс будет состоять из 7 уроков и одного бонуса (сейчас я сверюсь с картой этого курса… да, точно — 7 уроков и один бонус).

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

Пару постов назад (пару месяцев назад:), здесь писали точно по такой же теме, но есть и сегодня отличия. Сегодня я взял, и полностью окунулся в перекладку, да ещё и motion использовал… ну, стоп об этом. Смотрим дальше.

В курсе нам будет помогать Кот Ли. Сначала я думал нарисовать ему костюм, а-ля костюм Брюса Ли, но остановился только на полосках на плечах, ведь всё таки это кот-ниндзя. Именно Ли мы будем мучать в процессе получения знаний. Вуа-ля!

Значит, Ли можно рисовать простыми фигурами. Сейчас распишем, как это. А анимация идёт тоже перекладкой. И об этом напишу. Вообще, много придётся читать, так что сядьте поудобней, теперь так часто будет. Перед нами составной конструктор Ли. Каждой части тела — свои клипы. Ног у нас два типа, именно о них — ниже.

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

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

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

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

Теперь о ходьбе.
Вот у нас есть ходьба. В целом, ходьбу можно рисовать только на интуитивном уровне. Особенно игровую. Если не верите, подойдите к зеркалу и посмотрите на свою походку. В ней есть что-то сложное? Ммм, не уверен, по-моему всё просто. Главное помнить: хвост, голова и даже тело(спасибо Lerika), должны двигаться. Реакция тела — это, вроде, так называется. Привожу пример скучной ходьбы при 8fps:

Так как Ли у нас — ниндзя кот, то спокойно он ходить точно не будет. Но вот носиться он будет как угарелый. Поэтому опуская неинтересности ходьбы, сразу переходим к бегу. На бег тратится 2 разных ноги, 8 кадров, по два кадра на одно положение ноги. Руки-лапы должны двигаться в противофазе к одноименной ноге-лапе, то есть, правая рука-лапа должна двигаться в том же направлении что и левая нога-лапа. 8fps:

Если тело ниндзи бежит, то оно должно слегка наклонятся. Амплитуда качания тела, головы и хвоста больше при беге, но кадров на неё расходуется в два раза меньше. На рисунке видно, что на качание головой требуется 10 кадров. Это при беге. При ходьбе кадров будет 20. Тоже самое получается в хвосте и теле.

При 24fps вот что получается (не забываем о тени под нашим героем):

А вот, что получается если сверху прикинуть motion tween, и заставить кота двигать телом в сторону счастья… Сразу теряются из вида некоторые ошибки и косяки движения.

Вопросы?

Будет очень хорошо, если читатели этого блога захотят поделиться с другими своими достижениями или примерами по этой теме. Я буду рад увидеть любые работы. Используйте файлохранилищи(типа narod.yandex.ru) для загрузки своих fla и swf.

Что касается меня, то я с радостью прокомментирую, восхищусь или найду что-то новое для себя в вашем творении. Мы все учимся. Так почему бы не перенимать опыт друг у друга и учиться вместе?

Вот так всё просто и без потерь энергии.

ps Кстати, запомните пароль: fgafirst

Чуть не забыл(спасибо Алексу) — исходник. В библиотеку можете не лазить, многое там не относится к этому топику.

email: moy@murlyka.com

при поддержке WayToRise