Незнаю куда это написать,но Maksim 2d ,незнаешь где можно взять информацию про то как надо расскрашивать героев? Цвет выбирать,наносить,тень делать(что на герое что под ним).И как рисовать заднии фоны?

Maksim 2d писал(а):

Maksim 2d ,я может не совсем правельно выразилась,но я имею в виду, как раскрашивать в таких программах как Photoshop,TVPAinte,и вообще где это удобно делать?(в какой программе?Как сделать так что бы тень на герое была плавно переходящей в его цвет?)

01. Создаем новый проект 768х576x24к\сек. Progressive.

02. Закрываем вот эту панель, она пока вам не пригодится:



03. Включаем Виртуальный стол-просвет (Light Table) Для этого нажимаем вот эту кнопку в главном меню:



лампочка должна загореться:



появится стол-просвет, вот он:



04. Снимите выделения с тех кадров что я указал, оставив только 0 и по 2 кадра по краям. Напротив квадратиков Color поставьте галочки, должно получиться вот так:



05. Панель "Animator Panel":



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




06. В панели Проекта (Project), где располагаются слои:



создайте новый анимационный слой - Layer Anim, кликнув по кнопке New:



должно получиться вот так:




07. Перейдите на старый слой, просто щелкнув мышкой по нему:



08. Удалите старый слой кликнув ПРАВОЙ кнопкой по нему:



или в Animator Panel просто нажмите вот эту кнопку:



Теперь у вас должен остаться лишь 1 вновь созданный вами анимационный слой:



Все слои в TVP как и в Фотошопе - ПРОЗРАЧНЫ. Они НЕ залиты белым фоном. Белый фон находится под всеми вашимим слоями и отличается от фона в Фотошопе лишь тем, что вы никогда на нем ничего не сможете нарисовать. Потому что в TVP белый фон не слой, а подсветка снизу и ничего более. Запомните это. Именно поэтому TVPaint Anination является по-сути настоящей виртуальной имитацией аниматорского стола со всеми его достоинствами.

Итак, на даный момент ваш анимационный слой состоит из 1 кадра. Увеличим его продолжительность пока до 3х кадров.

09. Чтобы увеличить продолжительность анимационного слоя жмем 2 раза в Animator Panel вот эту кнопку:



должно получиться вот так:



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



Но при этом появится окно Increase Layer Lenght, о нем я расскажу позднее, просто поставьте все как у меня и жмите Apply:




10. Переместите бегунок на 1 кадр вот так:



11. Теперь в Основной панели (Main Panel):



- выберите инструмент Свободная линия от руки (FreeHandLine). Кнопка должна быть вот такой:



12. В панели Инструментов (Tool):



- выберите инструмент PenBrush:



и нарисуйте на первом кадре крупно цифру 1, затем на втором кадре цифру 2, и наконец на третьем кадре цифру 3. Затем вернитесь на второй кадр, где нарисована цифра 2:



12. Получилось? Тогда самое время включить работу стола-просвета! Делается это легко, нужно просто активировать кнопочку с буквами LT (Light Table), которая находится на вашем анимационном слое в панели Project:

-->

Вуаля! Если вы все сделали правильно, то сквозь кадр с вашей двоечкой будут просвечивать первый кадр с единичкой (подцвеченной красным) и последний кадр с тройкой (подцвеченной синим):




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



тем самым "мощность лампы" уменьшена:




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


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

13. Теперь давайте перейдем на первый кадр с цифрой 1:



Теперь цифры 2 и 3 окрасились в синий цвет - так как они находятся после кадра с 1. Причем цифра 3 видна слабее.

Перейдем теперь на последний кадр с цифрой 3:



Теперь цифры 1 и 2 окрасились в красный цвет - так как они находятся перед кадром с 3. Цифра 1 соответственно видна слабее.


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

01. Удаляем слой кликнув в Animator Panel по кнопке:



вместо удаленного анимационного слоя появится обычный слой-картинка (Layer Image). Ничего необычного - почти все как в Фотошопе, только там вы просто не сможете удалить единственный слой, если нет слоя с фоном (Background) :О) Визуально отличить слой-картинку (Layer Image) от анимационного слоя (Layer Anim) можно по закрашенному серым фону, там где у анимационного будет белый фон-кадрик:

- слой картинка (Layer Image)

- слой анимации (Layer Anim)

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



появляется окно:



в поле вводим новое имя, жмем ок:




готово!


03. Давайте научимся из обычного слоя-картинки быстро делать анимационный. Есть 2 способа, первый - просто нажимаем в Animator Panel вот эту кнопку:



второй - кликаем по слою и указываем - Make Layer Anim (сделать анимационным):



Вуаля! Готово, у нас вновь анимационный слой.


04. Приступим к анимации! Давайте нарисуем первый кадр. Я нарисовал то, что мне проще всего - Джонатана. Я рисую его уже много лет, поэтому мне и вправду легче "играться" с ним. Вы можете нарисовать все, что вам пожелается, просто человечка-болванку, например, с поднятыми к верху руками, которые он потом опустит,(не сложного, палка-палка огуречик), или птичку, которая потом полетит, махая крыльями, глаза, круглые мультяшные, которые моргнут :О) Или просто черточку, которая будет бегать по листу. Это для того, чтобы вам не сложно было. Начинать учиться анимации нужно, как вы уже давно знаете, с самых простейших форм. Кружочки, палочки, овалы.

*Примечание:
Чтобы во время рисования кисть превратить в ластик нажмите клавишу F4. Чтобы вернуть режим ксити обратно - нажмите F2. Кроме того если вам лишь временно нужен ластик - нажмите пробел - ластик активируется. Как только вы отпустите пробел - вернется кисть. Чтобы перемещать холст как в Фотошопе "ладошкой" удерживайте Alt и тяните холст мышкой в нужную с торону. Чтобы вращать холст - нажмите Ctrl+Alt - и поверните мышкой под нужный угол. Чтобы вернуть холст в строго-горизонтальное положение, как был - нажмите Insert. Alt+правая кнопка мыши позволят приближать\удалять холст в реальном времени! (Чуть позднее я расскажу как назначить все эти команды на перо и кнопки планшета WACOM Intuos 3)
И вот первый кадр готов - Джонатан "застыл" в удивлении:



Этот кадр в анимации будет называться key - ключевой.


05. Теперь добавим еще пару кадров, кликнув 2 раза по знакомой вам кнопке:



и перейдем на последний треттий. Это будет еще один наш ключевой кадр:



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



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




Готово? Эти кадры называются ключевыми потому, что отображают крайние (конечные, пиковые) моменты движения. Это словно островки в озере, между которыми нужно будет проложить мосты :О) Ключевые кадры (далее просто ключи) должны быть очень выразительны. Они формируют внятность анимации, четкость движения. Вобщем это акценты. Поздравляю, вы познакомились с ключами :О)!

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



Знакомая картина, не правда ли? Только теперь, вместо цифр 1 и 3 мы видим подцвеченные фигурки Джонатана! У вас должно получиться точно так же, но только со своими фигурками. Теперь ориентируясь на наши ключи рисуем фазу. Вы должны нарисовать нечто среднее. Если это человечек - рисуем руки по середине, разведенными в стороны (он их начал опускать), если птица - крылья на уровне тела, если глаза - нарисуйте полностью закрытыми (произошел "мырг")! , ну а если полосочка - нарисуйте новую между первой и последней так же по середине.

Джонатан в это время "собрался в кучу" сделал "мырг" и повернулся к зрителю корпусом:




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



а потом жмем Playback:



*Примечание:
Нажав 1 раз кнопку Play запустится проигрывание анимации. Нажав второй раз - будет пауза. Нажав еще раз - вновь запустится проигрывание. Чтобы остановить цикл - жмем Stop (кнопка с черным квадратиком как обычно)

08. Теперь добавим еще фаз в нашу анимацию. Вначале между 1 и 2 кадрами. Установите бегунок на 2 кадре и нажмите вот эту кнопку:

- она позволяет добавить кадр перед текущим, в отличие от ее "соседки". Должно получиться вот так:




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



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

09. Готово? Теперь добавим кадр между теперь уже 3 и 5 вот так:



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



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

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

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

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



Пока я готовлю продолжение - вы можете скачать исходный файл, в формате .tvp, открыть его у себя прямо в программе и посмотреть. Подвигать бегунок. Я упаковал файл в rar и zip, скачивайте тот, который более вам подходит:

Jonathan rar

Jonathan zip

Maksim 2d писал(а):

Кстати, ты получила книгу?

Книгу получила,спасибо за нее.

познакомимся с окном экспорта, здесь есть много чего вкусного :



первым делом обратим внимание на формат:



нужно выставить GIF:



далее обратим внимание на количество цветов:



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

б. Если ваш рисунок "карандашный" - содержит оттенки какого либо 1-го цвета (серый, коричневый) - можно выставить 8 или 16.

в. Если рисунок цветной - то нужно ориентироваться по количеству цветов использованных в вашем мультфильме. Узнать все цвета которые вы использовали у себя в рисунке можно очень просто. Все они автоматически заносятся вот в эту палитру:



щелкаем по черному треугольничку и видим сколько у нас цветов было задействовано, например вот столько:





Этой подсказкой пользоваться не всегда удобно поэтому, если лень подсчитывать , можно просто выставить 32 или 64 или 128 или все 256. Однако помните, чем большее содержание цветов - тем больше размер вашего файла в итоге.


С цветами разобрались теперь вот с этим:

-сглаживание, смешение, рассеивание (кому как удобно) Это как раз то о чем я говорил ранее - знаменитая "крапинка" GIF'a Если галочка установлена - GIF попытается передать все оттенки вашего рисунка, путем смешения (рассеивания) нужных пикселей. Если у вас только четкий контур и заливка - рекомендую снять галочку. Привожу примеры:

исходная картинка:




- картинка без галочки Dither при 32 цветах:




- картинка с галочкой Dither при тех же 32 цветах:




- картинка с галочкой Dither уже при 64 цветах:



~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Поехали дальше! Строка сохранения:



ВНИМАНИЕ! У TVP есть одна особенность, я могу отнести ее скорее к минусам, помните: ВСЕГДА проверяйте КУДА, ЧТО и под КАКИМ ИМЕНЕМ вы сохраняете. К сожалению, в этой версии TVP бывают ситуации, когда можно ненароком перезаписать нужный файл! Будьте внимательны.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

- одна картинка. Ставим галочку в том случае, если у нас не анимация а просто картинка.

- последовательность картинок (Секвенция). Очень полезная функция. Если вы хотите собрать GIF в другой программе из кадриков вашей анимации, ставьте сюда галочку. Только не забудьте вернуть вот здесь более "чистый" формат, например PSD(Фотошоп):



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


Ну что-ж, поскольку у нас анимация - оставляем галочку вот здесь:




- здесь можно конвертировать свой проект из одного видео формата в другой. Например из NTSC в PAL. Это влияет на многое. На размер кадра, на частоту кадров в секунду, нa соотношение сторон и даже на форму пикселя. Уверен вам сейчас это ненужно, поэтому не заморачивайтесь. Должно стоять Custom.


- соблюдать пропорции. Эту галочку лучше не снимать. Тогда вы можете не опасаться за искажение кадра. Это поможет вам как раз при уменьшении картинки. Этим мы как раз сейчас и займемся здесь же:

- знакомое поле для ввода размера ширины к адра. Давайте уменьшим кадр. Введите 320. Если вы не снимали галочку в Preserve Proportion то в этом поле:

- автоматически выставится 240, TVPaint сам расчитал размер высоты кадра.

- снова знакомое поле, где "на лету" можно менять скорость кадров.

- включить\выключить фон. Если вы не создавали собственного фона, то ваша анимация "прозрачна" и поэтому лучше включить. Иначе ничего кроме черного фона в мультфильме вы не увидите. Однако помните, что и внутри, в вашем проекте фон-подсветка должен быть так же белый (по умолчанию он белый). Установить (и легко менять) цвет фона-подсветки можно вот здесь:



Давайте сразу же разберемся с этими загадочными кнопочками. Если кликнуть по кнопке Color - раскроется список с тремя режимами подсветки:



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

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



теперь "лампа светит" так:


Аналогичным образом установите вновь белый.

Check - проверка. В этом режиме включается сетка проверки совсем как в Фотошопе:



обратите внимание - сетка просвечивает даже сквозь кадры вашего анимационного слоя:



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



да и проверять пустоты в рисунке приятнее:


Поздравляю! Вы научились управлять фоном-подсветкой в TVP. Есть еще кнопочка Sound, но об этом не сейчас. Верните режим Color и установите белый цвет фона. В окне экспорта не забудьте выставить галочку:


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

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

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

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



Вдруг вы передумали, и решили сохранять анимацию не полностью а лишь ОТ и ДО определенного кадра? Это с легкостью можно указать не возвращаясь в проект и не обрезая там кадры, а прямо здесь же! Для этого выставляем бегунок на нужный кадр в начале и нажимаем Mark In (под кнопкой в поле выставится номер нового стартового кадра), затем выставляем бегунок ближе к концу на нужный кадр и нажимаем Mark Out(под кнопкой в поле так же выставится номер нового конечного кадра). Так мы выделим нужный фрагмент и TVP при экспорте сохранит только его, обрезав лишние кадры.

Все готово? Жмите Export !!! Наградой за ваше терпение и невероятные мучения станет ваш маленький GIF-мульт :