™Porshe's Tutorials

Alexb — Sun, 10 Jan 2010 13:07:00 GMT

Доступно только для пользователейТренинг по рисованию чаров "for RPG Maker XP".
Часть первая.

Поворот головы, на 3-четверти.

Для удобства, пункты написанные здесь, соответствуют цифрам, в примере...

http://rakun-soft.narod.ru/training/...g_Face_3-4.PNG
1) Тут долго думать не нужно... собственно под первым номером, у нас оригинал головы, смотрящей в фас.
2) Что бы было более просто объяснить дитали урока, я привёл пример на кружке, который почти идентичен любой голове RPT чаров в RPG Maker XP...
3) В третьем примере видно что голова была малость... ну как сказать, разсечина по вертикали, и левая часть головы поднята на один пиксель...
4) На четвёртом примере мы подправляем подбородок... что бы он нас не смущал такой кривизной...
5) На пятом примере сдвигаем правый локон волос, на право, на один пиксель...
6) Шестой пример, опять пострадал с подбородком, так как поворот был бы не особо реалистичным, как хотелось бы... (и кстати, подправленно пустые пиксели у правого локана волос, далее он останиться без изменений)...
7) Пример под номером семь, словил подправку левого локана, и подрисовки уха, на уровне глаз, у правого локана волос...
8) Советую стереть немного волос сверху по правой стороны... что бы было проще *на глаз*, дорисовать голову...
9) Ни каких пиксельных изминений... всего лишь залили светлым цветом пустое поле волос... (Почему светлым ?... всё легко объяснить... тени наложить куда проще, чем выресовывать освещение)...
10) Финальный рывок... собственно накладываем тени, и добавляем маленький блик, что бы придать большего объёма в повороте...

Собственно ни чего сложного, думаю проблем в рисовании головы на три-четверти, не появиться...

Писал статью, и рисовал: Porshe
© Все права нарушены, и приследуются в незакона...

ps: В следующем уроке (Если не будет лень), объясню как заставить двигаться само тело, не имоверными кульбитами ^___^

Тренинг по рисованию чаров "for RPG Maker XP".
Часть вторая.

Воплощение в движении.

Для удобства, пункты написанные здесь, соответствуют цифрам, в примере...

1) Не поверите... мы будет рисовать контурами только в пайнте... я аж сам офигел...
Собственно старайтесь просто представить себе то движение, которое хотите нарисовать, а далее рисуем простыми пиксельными контурами... (данная часть, пожалуй самая тяжёлая...)
2) Всё... контуры собственно готовы, и мы принимаемся задавать цвет контурам, которые будуи иметь похожий цвет к примеру, с одеждой, телом и ботинками...
3) Заливаем всё это добро приблизительным цветом... не особо тёмным, не и не сильно светлее самих контуров...
4) АднАзнАчнА... начинаем накладывать тени... я пошёл более лёгким путём, это стал класть тени, не посредственно рядом у контуров... (Собственно пуговищи, и всякие там прибомбасы не забывайте...
5) И как всегда, мой самыю любимый штрих, это накладывать блики... тоже ни чего сложного... плюнуть тут, плюнуть там...

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

Писал статью, и рисовал: Porshe
© Все права нарушены, и приследуются в незакона...

Урок по рисованию (3)

Тренинг по рисованию "for RPG Maker XP".
Надеюсь что часть будет всего одна ^___^
Но вообще, это уже как бы часть третья...

Искожение RTP.

Для удобства, пункты написанные здесь, соответствуют цифрам, в примере...

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

Вбивание плитки в пол...

1) Собственно из скрина выше, я просто урезал его малость...
Делаем разметку... то есть, выдираем маленькую плитку...
2) Ну вот и сама плитка...
3) Делаем её потемнее... (Это можно сделать двумя способами... либо свиснуть такое же RTP из стандарта, там есть такие же плитки, но темнее... или же, насиловать Фотошлёп...)
По скольку я на резервке сейчас, то мне кроме Paint ни чего не доступно... (так что я выдрал плитку из RTP)
4) Чуть чуть чикрыжим плитку... (Заметьте, что я немного осветлил её сверху...)
5) Ну это для того что бы показать что получилось...
6) Тут я её инвенсировал (сверху вниз), и добавил немного освещения... (прикиньте сами, каким должно быть освещение... а то объяснять это по разным наклонам света, тяжеловато будет)
7) Думаю, когда вы освоитесь делать одну плитку, то вы научитесь делать их много ^__^
(Я опять таки, пошёл более лёгким путём... Я увеличивал её на один пиксель, и убовлял тени... дабы придавать "Даже не знаю как это назвать - высоту ?" объёма...)
8) Повторить не однократно... и до посинения... увеличивайте плитки объёмом, задавайте им разные формы.. и т. д.)
9!) То что получилось у меня... (Скажу сразу... это мой первый опыт... я раньше ни когда не анимировал плитки...)
Подобную тему, можно юзать в моменты когда на плитки наступает, или падает что-то тяжёлое...

Опять пострадал стандартный RTP...
В этом скрине, всё что я использывал, для анимации разрушения колонны...

КАЛИФОРНИЯ!!

1) Не поверите... это выдранный стандартный RTP...
2) "Он зарижаер сферу в руке... вытягивает руку вперёд, запускает сферу в противника, и чёрт... он промахиваеться !!!. лузер..."
3) Продолжение анимации падения колонны...
4) Начну делать заметки, что бы вам не казалось что я что-то там скрываю )
(Со второго скрина, видно что я использовал на колонне, трещину... трещинц рисовал сам... методом пиксельных полосок с палитрой цвета тени от света у колоны...)
Так же чуток пострадала шапка колонны... тоже добавлены трещины, и я малость откусил там уголок шапки коллоны... гадость редкостная... >___<
Камушки выдранны из тех кирпичиков, которые были на скрине чуть выше... и так же при каждом их движении, поворачивал их на 90 градусов... (при том, при сём... я и сам малость, был под градусом... так что за кривизну, не пинайте)...
Всю эту анимацию, мне приходилось делать в Paint...
Так как к PhotoShop мне на данный момент, доступ закрыт... но всё же вертеть все эти летящщие объекты, лучше в фотошлёпе...
5, 6 и т. д.) Ну это у нас продолжение анимации... что бы дойти до "Конечного результата", я нарисовал 16 анимаций...
Конечный результат) Аммм... собственно, к чему пришли...

Старьё...

1) Почти оригинал RTP... (Он со злости ударил по колонне, и пошёл прогресс)...
2) Почти оригинал RTP с камушком в верхнем правом углу...
3) Почти оригинал RTP с падающим камушком, в правом верхнем углу...
4) Почти оригинал RTP с падающим камушком, уже в просто правом углу...
5) Вообще ни чего сложного в этой анимации нету... (это как простой пример, для начального уровня, может быть)... Я малость обрезал уголок колонны в правом верхнем углу, дабы показать что камушек, это сама часть колонны...
Камушек я как всегда крутил на 90 градусов... м как всегда я был и сам под градусом...

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

Писал статью, и рисовал: Porshe
© Все права нарушены, и приследуются в незакона...

Урок по основам анимации (4)

Тренинг по рисованию "for RPG Maker XP".
Заключительная часть.

Основы анимации в RPG Maker.

Для удобства, пункты написанные здесь, соответствуют цифрам, в примере...

Для начала объясню:
1) Если присудствует ветер, то задействуються в движении только лёгкие вещи к примеру (Одежда, волосы и прочее)
2) Старайтесь соблюдать высоту ширину, и тому подобное... поскольку уменьшать пиксельные арты, ну очень рискованно...
3) Не естественно повёрнутая голова, и не естественный изгиб руки (ноги, тела), к сожалению портят нимацию... и данную ошибку, лучше исправлять зарание...

© На Рагнарок чем-то похоже.

Тут тяжело что либо сказать... открываем в Paint и разглядываем...
Ну конечно же не с плотоядным взглядом...
1) Начальная анимация, которая была нарисована... далее ручка пошла тудэма, сюдэма...
2) Тут я задал анимацию только рукам, которая на груди, и той, которая в...
3) В частности это самая простая анимация... поскольку дальше будут сложнее... и пока не освоите подобную анимация, не советую идти дальше...
Натренируйтесь пока что на лёгком...

Nik: Почему это у него такие белые глаза ?
Porshe: Они не белые... они слепые... >__<

АднАзнАчнА по мне самый удачный праобраз злодея )))
Длинные тёмные волосы, слепые глаза, длинный кожанный плащ, и внушающи красивый вид...
Будьте знакомы, "Тэмплэста" из "Sys32"...
1) Простая стойка, рисуеться методом пикселявости, который был объяснён во втором тренинге...
2) Тут я изогнул его тело для того что бы показать его крутость (Заметьте что рука поднята полностью горизонтально... дорисовывать анимащию поднимающейся руки, я не стал...)
3) Далее тот же изгиб тела, но рука чуть опущина... (Сделал спецом для перехода на следующую анимацию...)
4) Собственно тут уже капитальные изменения... единственное, рука очталась в том же положении... волосы за спиной начали калышиться на ветру (В моём случае от напора ветра от магии), плащ тоже начал движение, показывая что ветер окутывает всю часть тела...
5, 6, 7) Это уже полное продолжение анимации, пока он типа запускает магию в противника...
В частности тут сложность заключаеться в том, что бы наверняка представить как это будет выглядить...
Представить как будет калышиться плащ, и естественно волосы с ним... (тоесть воплотить в движение только более лёгкие вещи, более тяжёлые, остаються в без действии...) Воспроизводиться как 5-6-7-6...

© *Побежал создавать аккоунт на Дэвиан Арт*

Parkur Owned !
Пожалуй одна из самых сложных анимаций... это заставить двигаться не в зависимости от положения камеры... (один из трюков паркура)
Что бы это всё прям до детально рассказать, у меня сил не хватет...
Рисовалось это всё, как в тумане... я уже и сам не помню какие там были изменения...
Но могу сказать точно: Анимация идёт слево, направо, и ноги идут в сторону камеры.
Советую открыть через Paint, и приглядеться как всё это делаеться...

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

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

Урок по Груповой анимации (5)

Тренинг по пиксельарту.
Груповая анимация.

Пока у меня не было интернета, я малость подумал.
И решил сделать ещё один тренинг по пиксельарту.
Я парой сам себе удивляюсь как легко мне даёться пиксельарт.
Потому я попробывал взаимодействовать в анимации одновременно два объекта...
Это Чара и Машину.
Тренинг довольно сложный, хоть я и давно рисовал машины для XP...
Но всёравно сложный...

Для удобства, пункты написанные здесь, соответствуют цифрам, в примере...

Et-to...
Для начала научимся рисовать саму машину.
1) Основа машины, так сказать её кости.
2) Далее был долгий и мучительный процесс с высчитыванием в геометрических фигурах.
Точнее я просто придал машине некоторый объём.
3) Тут уже давольно таки тяжеловато, это (придать цвет плёвое дело, проблема в салоне.) Долго кипятя мозги как бы съимпровизировать что бы и было видно салон машины, но и не было сильных там деталий.
4) Тут фотошлёп просто не заменим, иначе вы не сможете сделать полу прозрачное окно с градиентом.

Моя любимая часть работы, это реализовывать уже существующие машины.
Потом глаз радуеться когда видишь наглядную схожесть марки машины.
После тюнинга если кто не знает, у нас марка машины "De'Lorean"...
ps: play list windows media: Bummer_Tema_Dorogi.mp3 ^__^

Так советую вам разобрать машину по частям.
Это нам понадобиться для того что бы создать маленькую анимацию.
(Заметьте я стараюсь во всё пихнуть анимацию... может из-за того что я люблю более реалистичные игры ?)

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

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

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

Вот мы и пришли к полной версии данного добра.
Анимация полного взаимодействия двух объектов по ту сторону экрана.
В смысле я хотел сказать одновременная анимация ^__^
Ну кароче вы поняли ))

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

И последняя часть которую я оставил на потом, но тоже не мало важную.
Она относиться к тем кто хочет сделать полу прозрачное окно с градиентом в PhotoShop.
Для этого то нам и нужны были двери и стёкла для дверей отдельно ^____^
Извиняюсь что так перескакиваю с части на часть.
Но мне показалось что о Фотошлёпе стоит поговорить более менее отдельно от пиксельарта.

Копируем дверь, и ставим на машину.
Копируем стекло той двери в которое хотим его вставить и открываем PS (PhotoShop).
У меня пиратская версия, постоянно какие то ошибки кидает, потому у меня мошенально наживаеться 4 раза кнопка Enter )))
Теперь волшебство передачи данных (Ctrl+V) ^___^
И вставленное стекло, умещаем в двери.
Обычно данную операцию я провожу на белом фоне, потому ни куда не денусь, но белые квадраты оставшиеся от копированного стекла нужно убирать.
Делаеться это просто:
Свободное лассо + обводка + "Очистить" (Очищать дважды не придёться если с двух сторон белый фон... просто удерживая шифт обводите вторую область белого поля...)
Всё... окно в двери... но оно пилять не прозрачное !!!
Что же делать ?
Ну в таких случаях можно обратиться к функции не "прозрачность слоя"...
Заметься (по умолчанию панэль внизу с право...) в панэли слоёв, прибавился ещё один слой, когда мы вставили стекло через Ctrl+V...
Чуть выше и правее есть шкала, которую можно уменьшить на параметр 50... ну или 70 если хотите более тонированое стекло )))
Далее объединяем слои, и сохраняем рисунок.
После не забудьте очистить осветления из-за "Обрезания" кхм... белого фона.

Всё... полу прозрачное стекло на не прозрачной двери полностью готово.
Теперь повторяйте данную процедуру столько раз, сколько вы нарисовали анимацию >___<
Я прям от души зарядил анимации, аж руки устали стекло тонировать...
Кстати, про градиент то на стекле я забыл написать ^_____^
Ну думаю не важно... сами надеюсь с этим разберётесь.
"Настройки градиента" там палитры типа мутно голубой с переливанием на мутно зелёный.
(Я про свой пример на Дэлорине)...

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

Собственно, не садитись в не трезвом состоянии за руль авто !

Писал статью, и рисовал: Porshe
© Все анимации которые представлены в этом тренинге, защищены авторскими правами, и их использование без разрешения самого автора, запрещаеться...
Данная анимация используеться в играх: System32 и в клипе MSDOS...

Sprites

Gaara Tutorials

Японский туториал

Туториалы анонимуса

™Porshe's Tutorials

Uchiha Tutorials

AlexB's Tutorials