Журнал LinuxFormat - перейти на главную

LXF154:Pencil

Материал из Linuxformat
(Различия между версиями)
Перейти к: навигация, поиск
(Новая страница: «[Категория: Учебники ] Pencil: Соз­да­ем 2D-ани­ма­цию Ани­ма­ция Ожив­ляй­те свои кар­тин­к…»)
 
Строка 1: Строка 1:
[Категория: Учебники ]
+
[[Категория: Учебники ]]
Pencil: Соз­да­ем 2D-ани­ма­цию
+
=Pencil: Соз­да­ем 2D-ани­ма­цию=
Ани­ма­ция Ожив­ляй­те свои кар­тин­ки  
+
''Ани­ма­ция Ожив­ляй­те свои кар­тин­ки при по­мо­щи это­го про­сто­го ин­ст­ру­мен­та
при по­мо­щи это­го про­сто­го ин­ст­ру­мен­та
+
''
 
+
'''Джо­но Бэ­кон учит нас во­оду­шев­лять изо­бра­жения в Linux.
Джо­но Бэ­кон учит нас во­оду­шев­лять изо­бра­жения в Linux.
+
'''
 
+
{{Врезка|left|Заголовок=Наш эксперт |Содержание=
Подними­те ру­ки те, кто лю­бит муль­тик «Симп­со­ны». Те­перь те, кто лю­бит «Ма­ша и Мед­ведь», «Леднико­вый пе­ри­од» или «Шрек»! Ос­таль­ные на­вер­ня­ка скры­ва­ют, что хоть один ри­со­ван­ный фильм им да нра­вит­ся.
+
Джо­но Бэ­кон
 +
ме­нед­жер Со­об­ще­ст­ва Ubuntu, ав­тор The Art Of Community [Ис­кус­ст­во Со­об­ще­ст­ва] и ос­но­ва­тель под­кас­та Чет­вер­ки От­ще­пен­цев. |Ширина=15%}}
 +
'''П'''одними­те ру­ки те, кто лю­бит муль­тик «Симп­со­ны». Те­перь те, кто лю­бит «Ма­ша и Мед­ведь», «Леднико­вый пе­ри­од» или «Шрек»! Ос­таль­ные на­вер­ня­ка скры­ва­ют, что хоть один ри­со­ван­ный фильм им да нра­вит­ся.
  
 
Муль­ти­п­ли­ка­ция, или анима­ция – од­на из са­мых уди­ви­тель­ных форм твор­че­­ско­­го ис­кусст­ва: мы здесь не ог­раниче­ны фи­зи­че­­ской при­ро­дой жи­во­го дей­ст­вия, и вам по пле­чу все! Ес­ли вы хо­тите уронить на ко­го-то на­ко­валь­ню, в муль­ти­ке и это вы­полнимо – как и лю­бые ва­ши по­же­лания на­счет на­ко­вальни.
 
Муль­ти­п­ли­ка­ция, или анима­ция – од­на из са­мых уди­ви­тель­ных форм твор­че­­ско­­го ис­кусст­ва: мы здесь не ог­раниче­ны фи­зи­че­­ской при­ро­дой жи­во­го дей­ст­вия, и вам по пле­чу все! Ес­ли вы хо­тите уронить на ко­го-то на­ко­валь­ню, в муль­ти­ке и это вы­полнимо – как и лю­бые ва­ши по­же­лания на­счет на­ко­вальни.
Строка 14: Строка 16:
 
А вот и нет! Вам нуж­но толь­ко при­ло­жение Pencil [Ка­ран­даш], ко­то­рое мож­но ска­чать бес­плат­но для ва­ше­го ди­ст­ри­бу­ти­ва.
 
А вот и нет! Вам нуж­но толь­ко при­ло­жение Pencil [Ка­ран­даш], ко­то­рое мож­но ска­чать бес­плат­но для ва­ше­го ди­ст­ри­бу­ти­ва.
  
Зна­ко­мим­ся с Pencil
+
==Зна­ко­мим­ся с Pencil==
  
 
Pencil всту­пил в жизнь как Pencil Planner Пат­ри­ка Кор­рь­е­ри [Patrick Corrieri]. Это был все­го лишь ин­ст­ру­мент ри­со­вания, но Паскаль Не­дон [Pascal Naidon] взял его и рас­ши­рил его функ­ции до бо­лее пол­но­го па­ке­та 2D-анима­ции. Ныне Pencil об­за­вел­ся мно­го­люд­ным со­об­ще­ст­вом поль­зо­ва­те­лей, с об­шир­ным ар­хи­вом сде­лан­ных в нем анима­ций на YouTube.
 
Pencil всту­пил в жизнь как Pencil Planner Пат­ри­ка Кор­рь­е­ри [Patrick Corrieri]. Это был все­го лишь ин­ст­ру­мент ри­со­вания, но Паскаль Не­дон [Pascal Naidon] взял его и рас­ши­рил его функ­ции до бо­лее пол­но­го па­ке­та 2D-анима­ции. Ныне Pencil об­за­вел­ся мно­го­люд­ным со­об­ще­ст­вом поль­зо­ва­те­лей, с об­шир­ным ар­хи­вом сде­лан­ных в нем анима­ций на YouTube.
Строка 26: Строка 28:
 
Pencil по­став­ля­ет на­бор ин­ст­ру­мен­тов, пред­ла­гаю­щих боль­шую гиб­кость для опыт­ных анима­то­ров и в то же время про­стых и эф­фек­тив­ных для обу­чения но­вич­ков вро­де нас. На да­нном уро­ке мы изу­чим ин­тер­фейс Pencil, и соз­да­дим про­стую анима­цию пры­гаю­ще­го мя­чи­ка: попробуем на­бро­сать эс­киз на­шей анима­ции, об­вес­ти его, рас­кра­сить, оз­ву­чить и за­тем со­хранить его как ви­део, ко­то­рым мож­но по­де­лить­ся с дру­ги­ми.
 
Pencil по­став­ля­ет на­бор ин­ст­ру­мен­тов, пред­ла­гаю­щих боль­шую гиб­кость для опыт­ных анима­то­ров и в то же время про­стых и эф­фек­тив­ных для обу­чения но­вич­ков вро­де нас. На да­нном уро­ке мы изу­чим ин­тер­фейс Pencil, и соз­да­дим про­стую анима­цию пры­гаю­ще­го мя­чи­ка: попробуем на­бро­сать эс­киз на­шей анима­ции, об­вес­ти его, рас­кра­сить, оз­ву­чить и за­тем со­хранить его как ви­део, ко­то­рым мож­но по­де­лить­ся с дру­ги­ми.
  
Начнем, по­жа­луй!
+
==Начнем, по­жа­луй!==
  
 
Пер­вый шаг при соз­дании анима­ции – вы­полнение на­бро­ска. Это соз­дание гру­бо­го эс­ки­за ка­ж­до­го кад­ра анима­ции, ко­то­рый мож­но ис­поль­зо­вать в ка­че­­ст­ве ука­зания поз­же, когда вы долж­ным об­ра­зом об­ве­де­те свою анима­цию. За­пусти­те Pencil, и при­сту­пим к соз­данию на­ше­го пер­во­го эс­ки­за.
 
Пер­вый шаг при соз­дании анима­ции – вы­полнение на­бро­ска. Это соз­дание гру­бо­го эс­ки­за ка­ж­до­го кад­ра анима­ции, ко­то­рый мож­но ис­поль­зо­вать в ка­че­­ст­ве ука­зания поз­же, когда вы долж­ным об­ра­зом об­ве­де­те свою анима­цию. За­пусти­те Pencil, и при­сту­пим к соз­данию на­ше­го пер­во­го эс­ки­за.
Строка 32: Строка 34:
 
Се­го­дня мы соз­да­дим про­стую анима­цию мя­чи­ка, от­ска­ки­ваю­ще­го от по­ла. От­крыв Pencil, вы уви­ди­те че­ты­ре основ­ных зо­ны ин­тер­фей­са:
 
Се­го­дня мы соз­да­дим про­стую анима­цию мя­чи­ка, от­ска­ки­ваю­ще­го от по­ла. От­крыв Pencil, вы уви­ди­те че­ты­ре основ­ных зо­ны ин­тер­фей­са:
  
247142.png Ле­вая – это на­бор ин­ст­ру­мен­тов, ко­то­рые мы бу­дем ис­поль­зо­вать для соз­дания анима­ции.
+
*Ле­вая – это на­бор ин­ст­ру­мен­тов, ко­то­рые мы бу­дем ис­поль­зо­вать для соз­дания анима­ции.
  
247144.png Сред­няя – об­ласть ри­со­вания; это вир­ту­аль­ный холст, где по­явит­ся на­ша анима­ция.
+
*Сред­няя – об­ласть ри­со­вания; это вир­ту­аль­ный холст, где по­явит­ся на­ша анима­ция.
  
247146.png Пра­вая – здесь по­ка­за­ны на­ша цве­то­вая па­лит­ра и ин­ст­ру­мен­ты. Мы восполь­зу­ем­ся ими поз­же, при рас­крас­ке ри­сун­ков.
+
*Пра­вая – здесь по­ка­за­ны на­ша цве­то­вая па­лит­ра и ин­ст­ру­мен­ты. Мы восполь­зу­ем­ся ими поз­же, при рас­крас­ке ри­сун­ков.
  
247148.png Ниж­няя – здесь вы уви­ди­те вре­мен­ную шка­лу, где мы бу­дем до­бав­лять к на­шей анима­ции вир­ту­аль­ные страницы, что­бы соз­дать ил­лю­зию дви­жения.
+
*Ниж­няя – здесь вы уви­ди­те вре­мен­ную шка­лу, где мы бу­дем до­бав­лять к на­шей анима­ции вир­ту­аль­ные страницы, что­бы соз­дать ил­лю­зию дви­жения.
  
 
Сна­ча­ла щелкнем по ин­ст­ру­мен­ту Sketch [Эс­киз] на ле­вой панели. Это кноп­ка с кар­тин­кой ка­ран­да­ша. На­жми­те кноп­ку, а за­тем на­ри­суй­те круг, изо­бра­жаю­щий мяч, и линию, изо­бра­жаю­щую зем­лю. Это долж­но на­по­ми­нать див­ное про­из­ве­дение ис­кусс­ст­ва, по­ка­зан­ное на рис. 1.
 
Сна­ча­ла щелкнем по ин­ст­ру­мен­ту Sketch [Эс­киз] на ле­вой панели. Это кноп­ка с кар­тин­кой ка­ран­да­ша. На­жми­те кноп­ку, а за­тем на­ри­суй­те круг, изо­бра­жаю­щий мяч, и линию, изо­бра­жаю­щую зем­лю. Это долж­но на­по­ми­нать див­ное про­из­ве­дение ис­кусс­ст­ва, по­ка­зан­ное на рис. 1.
Строка 45: Строка 47:
  
 
Сле­ва от шка­лы есть два слоя – Bitmap [Рас­тро­вый] и Vector [Век­тор­ный]. Сей­час мы ри­су­ем наш эс­киз на рас­тро­вом слое, а на­ша конеч­ная об­ве­ден­ная анима­ция бу­дет на век­тор­ном, по­это­му убе­ди­тесь, что у вас вы­бран рас­тро­вый слой.
 
Сле­ва от шка­лы есть два слоя – Bitmap [Рас­тро­вый] и Vector [Век­тор­ный]. Сей­час мы ри­су­ем наш эс­киз на рас­тро­вом слое, а на­ша конеч­ная об­ве­ден­ная анима­ция бу­дет на век­тор­ном, по­это­му убе­ди­тесь, что у вас вы­бран рас­тро­вый слой.
 
+
[[Файл:LXF154.tut animation.f opt.jpeg  |thumb|400px|Рис. 1. Наш пер­вый про­стой эс­киз — мяч.]]
 
Те­перь на­жми­те пер­вую кноп­ку спра­ва от над­пи­си Onion Skin [Лу­ко­вич­ная ше­лу­ха]; что она де­ла­ет, я объ­яс­ню немно­го по­го­дя. Те­перь на­жми­те кноп­ку +, ря­дом с над­пи­сью Keys [Клю­чи]. В слой Bitmap до­ба­вит­ся вто­рой клю­че­вой кадр, и бу­дет ав­то­ма­ти­че­­ски вы­бран.
 
Те­перь на­жми­те пер­вую кноп­ку спра­ва от над­пи­си Onion Skin [Лу­ко­вич­ная ше­лу­ха]; что она де­ла­ет, я объ­яс­ню немно­го по­го­дя. Те­перь на­жми­те кноп­ку +, ря­дом с над­пи­сью Keys [Клю­чи]. В слой Bitmap до­ба­вит­ся вто­рой клю­че­вой кадр, и бу­дет ав­то­ма­ти­че­­ски вы­бран.
  
Строка 54: Строка 56:
 
За­тем ото­жми­те кноп­ку Onion Skin, вы­бе­ри­те пер­вый кадр и на­жми­те кноп­ку Play [Воспро­из­ве­дение]; и вы долж­ны уви­деть, как ваш мяч ожи­вет!
 
За­тем ото­жми­те кноп­ку Onion Skin, вы­бе­ри­те пер­вый кадр и на­жми­те кноп­ку Play [Воспро­из­ве­дение]; и вы долж­ны уви­деть, как ваш мяч ожи­вет!
  
Об­вод­ка
+
==Об­вод­ка==
  
 
Те­перь кон­вер­ти­руем на­бро­сок на­шей анима­ции в окон­ча­тель­ную, кра­си­во на­ри­со­ван­ную вер­сию. Этот про­цесс на­зы­ва­ет­ся «об­вод­ка [inking]»; для него по­тре­бу­ет­ся ин­ст­ру­мент ри­со­вания, от­сле­жи­ваю­щий толь­ко что сде­лан­ный эс­киз.
 
Те­перь кон­вер­ти­руем на­бро­сок на­шей анима­ции в окон­ча­тель­ную, кра­си­во на­ри­со­ван­ную вер­сию. Этот про­цесс на­зы­ва­ет­ся «об­вод­ка [inking]»; для него по­тре­бу­ет­ся ин­ст­ру­мент ри­со­вания, от­сле­жи­ваю­щий толь­ко что сде­лан­ный эс­киз.
  
 
Для на­ча­ла вы­бе­ри­те пер­вый кадр. По­том уве­личь­те мяч. Для это­го на панели вы­бе­ри­те ин­ст­ру­мент Move/Zoom Canvas [Пе­ре­мес­тить/Уве­ли­чить Холст] (зна­чок ру­ки). На­жав кла­ви­шу Ctrl, щелкните и пе­ре­та­щи­те его мы­шью, и вы смо­же­те уве­ли­чи­вать и умень­шать. За­тем мож­но дви­гать холст, от­пуская клавишу Ctrl и на­жи­мая для пе­ре­ме­щения туда-сюда.
 
Для на­ча­ла вы­бе­ри­те пер­вый кадр. По­том уве­личь­те мяч. Для это­го на панели вы­бе­ри­те ин­ст­ру­мент Move/Zoom Canvas [Пе­ре­мес­тить/Уве­ли­чить Холст] (зна­чок ру­ки). На­жав кла­ви­шу Ctrl, щелкните и пе­ре­та­щи­те его мы­шью, и вы смо­же­те уве­ли­чи­вать и умень­шать. За­тем мож­но дви­гать холст, от­пуская клавишу Ctrl и на­жи­мая для пе­ре­ме­щения туда-сюда.
 
+
[[Файл:LXF154.tut animation.h opt.jpeg |thumb|400px|]]
 
До­бив­шись уве­ли­чения, вы­бе­ри­те слой Vector на вре­мен­ной шка­ле. Вы уви­ди­те, что ри­су­нок сно­ва по­свет­лел – это произошло по­то­му, что мы на­ло­жи­ли наш век­тор­ный слой. Ото­жми­те кноп­ку Onion Skin.
 
До­бив­шись уве­ли­чения, вы­бе­ри­те слой Vector на вре­мен­ной шка­ле. Вы уви­ди­те, что ри­су­нок сно­ва по­свет­лел – это произошло по­то­му, что мы на­ло­жи­ли наш век­тор­ный слой. Ото­жми­те кноп­ку Onion Skin.
  
Строка 72: Строка 74:
 
Есть и дру­гие по­лез­ные ин­ст­ру­мен­ты, при­год­ные для об­вод­ки ри­сун­ка:
 
Есть и дру­гие по­лез­ные ин­ст­ру­мен­ты, при­год­ные для об­вод­ки ри­сун­ка:
  
247150.png Сте­реть (зна­чок лас­ти­ка) – им мож­но уда­лить часть ва­шей об­вод­ки; но помните, что по­сле уда­ления нуж­но сно­ва замк­нуть ва­ши линии, что­бы мож­но бы­ло по­том за­лить цвет. Ес­ли у вас есть что-то цвет­ное (мы этим сей­час зай­мем­ся), сти­рание уда­лит весь цвет внут­ри фи­гу­ры, ко­то­рая ста­ла незамк­ну­той, так что вам при­дет­ся кра­сить ее за­но­во.
+
*Сте­реть (зна­чок лас­ти­ка) – им мож­но уда­лить часть ва­шей об­вод­ки; но помните, что по­сле уда­ления нуж­но сно­ва замк­нуть ва­ши линии, что­бы мож­но бы­ло по­том за­лить цвет. Ес­ли у вас есть что-то цвет­ное (мы этим сей­час зай­мем­ся), сти­рание уда­лит весь цвет внут­ри фи­гу­ры, ко­то­рая ста­ла незамк­ну­той, так что вам при­дет­ся кра­сить ее за­но­во.
  
247152.png Вы­брать/Пе­ре­мес­тить объ­ект (зна­чок – стрел­ка) – этим ин­ст­ру­мен­том мож­но щелк­нуть на объ­ек­те и пе­ре­мес­тить его в дру­гую часть хол­ста. Вы так­же мо­же­те на­жать на об­ве­ден­ной час­ти ри­сун­ка – поя­вит­ся ог­раничи­ваю­щее ок­но, где мож­но на­жать на ру­ко­ят­ку, что­бы из­менить его раз­мер. Этот ин­ст­ру­мент по­ле­зен для пе­ре­дви­гания ри­сун­ка, при­менения вы­ре­зания и встав­ки, что­бы вве­сти эле­мент в но­вый клю­че­вой кадр, и ис­поль­зо­вания ин­ст­ру­мен­та Modify Curve для на­строй­ки но­во­го ри­сун­ка по сво­ему усмот­рению.
+
*Вы­брать/Пе­ре­мес­тить объ­ект (зна­чок – стрел­ка) – этим ин­ст­ру­мен­том мож­но щелк­нуть на объ­ек­те и пе­ре­мес­тить его в дру­гую часть хол­ста. Вы так­же мо­же­те на­жать на об­ве­ден­ной час­ти ри­сун­ка – поя­вит­ся ог­раничи­ваю­щее ок­но, где мож­но на­жать на ру­ко­ят­ку, что­бы из­менить его раз­мер. Этот ин­ст­ру­мент по­ле­зен для пе­ре­дви­гания ри­сун­ка, при­менения вы­ре­зания и встав­ки, что­бы вве­сти эле­мент в но­вый клю­че­вой кадр, и ис­поль­зо­вания ин­ст­ру­мен­та Modify Curve для на­строй­ки но­во­го ри­сун­ка по сво­ему усмот­рению.
  
 
За­тем, при вы­бран­ном в панели ин­ст­ру­мен­тов слое Vector, щелкните на сле­дую­щей по­зи­ции вре­мен­ной шка­лы и до­бавь­те вто­рой клю­че­вой кадр. Вы уви­ди­те, что ваш пер­вый об­ве­ден­ный ри­су­нок ис­чезнет, и поя­вит­ся вто­рой ри­су­нок-эс­киз.
 
За­тем, при вы­бран­ном в панели ин­ст­ру­мен­тов слое Vector, щелкните на сле­дую­щей по­зи­ции вре­мен­ной шка­лы и до­бавь­те вто­рой клю­че­вой кадр. Вы уви­ди­те, что ваш пер­вый об­ве­ден­ный ри­су­нок ис­чезнет, и поя­вит­ся вто­рой ри­су­нок-эс­киз.
Строка 80: Строка 82:
 
Те­перь по­вто­ри­те тот же про­цесс, вы­бе­ри­те ин­ст­ру­мент Polyline и об­ве­ди­те вто­рой ри­су­нок. По­вто­ри­те тот же про­цесс для всех кад­ров в ва­шей анима­ции.
 
Те­перь по­вто­ри­те тот же про­цесс, вы­бе­ри­те ин­ст­ру­мент Polyline и об­ве­ди­те вто­рой ри­су­нок. По­вто­ри­те тот же про­цесс для всех кад­ров в ва­шей анима­ции.
  
Рас­крас­ка
+
==Рас­крас­ка==
  
 
Наш сле­дую­щий шаг – рас­крас­ка анима­ции. К сча­стью, это де­лается очень про­сто. Во-пер­вых, вы­бе­ри­те слой Vector и на­жми­те кноп­ку Fill [За­лить] на панели ин­ст­ру­мен­тов (зна­чок – вед­ро с лью­щей­ся крас­кой). Те­перь вы­бе­ри­те цвет из панели в пра­вой час­ти ин­тер­фей­са. Ес­ли вы недо­воль­ны на­бо­ром цве­тов по умол­чанию, на­жми­те кноп­ку + ря­дом с те­ку­щим вы­бранним цве­том. По­явит­ся зна­ко­мый диа­лог вы­бо­ра цве­та; най­ди­те нуж­ный вам цвет и на­жми­те кноп­ку Add To Custom Colours [До­ба­вить цвет поль­зо­ва­те­ля], что­бы со­хранить его. За­тем на­жми­те кноп­ку ОK, что­бы до­ба­вить его в спи­сок цве­тов в основ­ной ин­тер­фейс.
 
Наш сле­дую­щий шаг – рас­крас­ка анима­ции. К сча­стью, это де­лается очень про­сто. Во-пер­вых, вы­бе­ри­те слой Vector и на­жми­те кноп­ку Fill [За­лить] на панели ин­ст­ру­мен­тов (зна­чок – вед­ро с лью­щей­ся крас­кой). Те­перь вы­бе­ри­те цвет из панели в пра­вой час­ти ин­тер­фей­са. Ес­ли вы недо­воль­ны на­бо­ром цве­тов по умол­чанию, на­жми­те кноп­ку + ря­дом с те­ку­щим вы­бранним цве­том. По­явит­ся зна­ко­мый диа­лог вы­бо­ра цве­та; най­ди­те нуж­ный вам цвет и на­жми­те кноп­ку Add To Custom Colours [До­ба­вить цвет поль­зо­ва­те­ля], что­бы со­хранить его. За­тем на­жми­те кноп­ку ОK, что­бы до­ба­вить его в спи­сок цве­тов в основ­ной ин­тер­фейс.
Строка 94: Строка 96:
 
Те­перь вы мо­же­те ри­со­вать на хол­сте те­ку­щий кадр, и при до­бав­лении клю­че­во­го кад­ра на но­вый слой (при на­жа­той кноп­ке Onion Skin) вы буде­те ви­деть, где бы­ла на­ри­со­ва­на пре­ды­ду­щая линия. Это да­ет вам боль­шую гиб­кость для до­бав­ления тек­стур и глу­би­ны ва­шей анима­ции.
 
Те­перь вы мо­же­те ри­со­вать на хол­сте те­ку­щий кадр, и при до­бав­лении клю­че­во­го кад­ра на но­вый слой (при на­жа­той кноп­ке Onion Skin) вы буде­те ви­деть, где бы­ла на­ри­со­ва­на пре­ды­ду­щая линия. Это да­ет вам боль­шую гиб­кость для до­бав­ления тек­стур и глу­би­ны ва­шей анима­ции.
  
Да­дим под­роб­но­сти
+
==Да­дим под­роб­но­сти==
  
 
По­кон­чив с об­вод­кой и цве­том на­шей анима­ции, вы, ве­ро­ят­но, за­хо­ти­те до­ба­вить вся­кие мел­кие де­та­ли и тени. К сча­стью, в Pencil это то­же про­сто.
 
По­кон­чив с об­вод­кой и цве­том на­шей анима­ции, вы, ве­ро­ят­но, за­хо­ти­те до­ба­вить вся­кие мел­кие де­та­ли и тени. К сча­стью, в Pencil это то­же про­сто.
Строка 102: Строка 104:
 
Ес­ли вы хо­ти­те снаб­дить ва­шу анима­цию те­ня­ми, ин­ст­ру­мент Sketch [Эс­киз] (зна­чок – ка­ран­даш) при­го­дит­ся для ри­со­вания очер­таний, ко­то­рые за­тем мож­но за­лить бо­лее тем­ным цве­том. Это удоб­но для чет­кой об­ри­сов­ки кон­ту­ров объ­ек­тов в анима­ции.
 
Ес­ли вы хо­ти­те снаб­дить ва­шу анима­цию те­ня­ми, ин­ст­ру­мент Sketch [Эс­киз] (зна­чок – ка­ран­даш) при­го­дит­ся для ри­со­вания очер­таний, ко­то­рые за­тем мож­но за­лить бо­лее тем­ным цве­том. Это удоб­но для чет­кой об­ри­сов­ки кон­ту­ров объ­ек­тов в анима­ции.
  
Слой ка­ме­ры
+
==Слой ка­ме­ры==
  
 
Еще од­на по­лез­ная функ­ция Pencil – слой ка­ме­ры [Camera layer]. Он обес­пе­чи­ва­ет взгляд на ри­су­нок в оп­ре­де­лен­ном ра­кур­се, с уче­том со­от­но­шения сто­рон кад­ра. Слой ка­ме­ры соз­да­ет­ся на­жа­ти­ем знач­ка + ря­дом с Layers и вы­бо­ром но­во­го слоя ка­ме­ры. В ваш холст до­ба­вит­ся бе­лый квад­рат, ото­бра­жаю­щий вид из ка­ме­ры.
 
Еще од­на по­лез­ная функ­ция Pencil – слой ка­ме­ры [Camera layer]. Он обес­пе­чи­ва­ет взгляд на ри­су­нок в оп­ре­де­лен­ном ра­кур­се, с уче­том со­от­но­шения сто­рон кад­ра. Слой ка­ме­ры соз­да­ет­ся на­жа­ти­ем знач­ка + ря­дом с Layers и вы­бо­ром но­во­го слоя ка­ме­ры. В ваш холст до­ба­вит­ся бе­лый квад­рат, ото­бра­жаю­щий вид из ка­ме­ры.
Строка 110: Строка 112:
 
При на­жа­тии Play вы те­перь уви­ди­те, что ри­су­нок пе­ре­ме­ща­ется ме­ж­ду дву­мя клю­че­вы­ми кад­ра­ми, где вы из­менили по­зи­цию. Этот ин­ст­ру­мент обес­пе­чи­ва­ет про­стой и эф­фек­тив­ный спо­соб па­но­ра­ми­ро­вания ва­ших ри­сун­ков.
 
При на­жа­тии Play вы те­перь уви­ди­те, что ри­су­нок пе­ре­ме­ща­ется ме­ж­ду дву­мя клю­че­вы­ми кад­ра­ми, где вы из­менили по­зи­цию. Этот ин­ст­ру­мент обес­пе­чи­ва­ет про­стой и эф­фек­тив­ный спо­соб па­но­ра­ми­ро­вания ва­ших ри­сун­ков.
  
Оз­ву­чим
+
==Оз­ву­чим==
  
 
Pencil да­же пре­достав­ля­ет про­стей­шие функ­ции для оз­ву­чи­вания анима­ции. Это по­лез­но, ес­ли вы хо­ти­те вве­сти в свою ра­бо­ту зву­ко­вые эф­фек­ты (ти­па шмя­ка­нья, когда мя­чик уда­ря­ет­ся о зем­лю).
 
Pencil да­же пре­достав­ля­ет про­стей­шие функ­ции для оз­ву­чи­вания анима­ции. Это по­лез­но, ес­ли вы хо­ти­те вве­сти в свою ра­бо­ту зву­ко­вые эф­фек­ты (ти­па шмя­ка­нья, когда мя­чик уда­ря­ет­ся о зем­лю).
Строка 122: Строка 124:
 
За­тем мож­но пе­ре­мес­тить этот тре­угольник так же, как и лю­бой дру­гой кадр, что по­зво­лит вам вы­брать, где вы хо­ти­те вы­звать звук. Мож­но до­ба­вить и несколь­ко зву­ков.
 
За­тем мож­но пе­ре­мес­тить этот тре­угольник так же, как и лю­бой дру­гой кадр, что по­зво­лит вам вы­брать, где вы хо­ти­те вы­звать звук. Мож­но до­ба­вить и несколь­ко зву­ков.
  
Со­храним муль­тик
+
==Со­храним муль­тик==
  
 
За­вер­шив свой ше­девр, вы на­вер­ня­ка за­хо­ти­те со­хранить анима­цию как муль­тик, ко­то­рым мож­но по­де­лить­ся с дру­ги­ми.
 
За­вер­шив свой ше­девр, вы на­вер­ня­ка за­хо­ти­те со­хранить анима­цию как муль­тик, ко­то­рым мож­но по­де­лить­ся с дру­ги­ми.
Строка 128: Строка 130:
 
К со­жа­лению, с точ­ки зрения диа­па­зо­на воз­мож­но­стей Pencil здесь несколь­ко ог­раничен, но пре­достав­ля­ет сред­ст­во вы­во­да анима­ции в ви­де филь­ма Flash. Для это­го про­сто вы­бе­ри­те File > Export > Flash/SWF, и сгенери­ру­ет­ся флэш-анима­ция.
 
К со­жа­лению, с точ­ки зрения диа­па­зо­на воз­мож­но­стей Pencil здесь несколь­ко ог­раничен, но пре­достав­ля­ет сред­ст­во вы­во­да анима­ции в ви­де филь­ма Flash. Для это­го про­сто вы­бе­ри­те File > Export > Flash/SWF, и сгенери­ру­ет­ся флэш-анима­ция.
  
За­круг­ля­ем­ся
+
==За­круг­ля­ем­ся==
  
 
На на­шем уро­ке мы про­шлись по ба­зо­вым функ­ци­ям Pencil. Хо­тя Pencil – ин­ст­ру­мент про­стой, не впа­дай­те в за­блу­ж­дение, что с его по­мо­щью нель­зя соз­да­вать впе­чат­ляю­щие анима­ции.
 
На на­шем уро­ке мы про­шлись по ба­зо­вым функ­ци­ям Pencil. Хо­тя Pencil – ин­ст­ру­мент про­стой, не впа­дай­те в за­блу­ж­дение, что с его по­мо­щью нель­зя соз­да­вать впе­чат­ляю­щие анима­ции.

Версия 13:03, 20 июня 2018

Содержание

Pencil: Соз­да­ем 2D-ани­ма­цию

Ани­ма­ция Ожив­ляй­те свои кар­тин­ки при по­мо­щи это­го про­сто­го ин­ст­ру­мен­та Джо­но Бэ­кон учит нас во­оду­шев­лять изо­бра­жения в Linux.

Подними­те ру­ки те, кто лю­бит муль­тик «Симп­со­ны». Те­перь те, кто лю­бит «Ма­ша и Мед­ведь», «Леднико­вый пе­ри­од» или «Шрек»! Ос­таль­ные на­вер­ня­ка скры­ва­ют, что хоть один ри­со­ван­ный фильм им да нра­вит­ся.

Муль­ти­п­ли­ка­ция, или анима­ция – од­на из са­мых уди­ви­тель­ных форм твор­че­­ско­­го ис­кусст­ва: мы здесь не ог­раниче­ны фи­зи­че­­ской при­ро­дой жи­во­го дей­ст­вия, и вам по пле­чу все! Ес­ли вы хо­тите уронить на ко­го-то на­ко­валь­ню, в муль­ти­ке и это вы­полнимо – как и лю­бые ва­ши по­же­лания на­счет на­ко­вальни.

На бе­ду, на­ше во­об­ра­жение час­то раз­би­ва­ет­ся о стра­шил­ки про ка­тор­гу ху­дожников, тща­тель­но вы­ри­со­вы­ваю­щих ка­ж­дый кадр, рас­кра­ши­ваю­щих его и изо­бра­жаю­щих дви­жение по­сред­ст­вом 25 чуть от­ли­чаю­щих­ся ри­сун­ков в се­кун­ду. Хо­тя при всей кро­пот­ли­во­сти та­ко­го тру­да это не ме­ша­ло по­ко­лениям анима­то­ров-лю­би­те­лей ри­со­вать фи­гур­ки на пра­вом нижнем угол­ке школь­ных учебников и бы­ст­ро от­ги­бать страницы боль­шим паль­цем, что­бы при пе­ре­лис­ты­вании по­лу­ча­лась ил­лю­зия дви­жения (та­кие книж­ки на­зы­ва­ют­ся «кинео­граф»). Но это же не про­фес­сио­наль­но – ведь для соз­дания на­стоя­ще­го реа­ли­стич­но­го муль­ти­ка нуж­ны ка­ме­ры, хол­сты, чернила, крас­ки и мно­го сво­бод­но­го вре­мени?

А вот и нет! Вам нуж­но толь­ко при­ло­жение Pencil [Ка­ран­даш], ко­то­рое мож­но ска­чать бес­плат­но для ва­ше­го ди­ст­ри­бу­ти­ва.

Зна­ко­мим­ся с Pencil

Pencil всту­пил в жизнь как Pencil Planner Пат­ри­ка Кор­рь­е­ри [Patrick Corrieri]. Это был все­го лишь ин­ст­ру­мент ри­со­вания, но Паскаль Не­дон [Pascal Naidon] взял его и рас­ши­рил его функ­ции до бо­лее пол­но­го па­ке­та 2D-анима­ции. Ныне Pencil об­за­вел­ся мно­го­люд­ным со­об­ще­ст­вом поль­зо­ва­те­лей, с об­шир­ным ар­хи­вом сде­лан­ных в нем анима­ций на YouTube.

Pencil пред­на­зна­чен для соз­дания про­стых 2D-анима­ций. Он не за­ме­ня­ет сис­те­мы про­фес­сио­наль­ной анима­ции, та­кой как Toon Boom Harmony (при­ме­няе­мой во мно­гих ху­до­же­ст­вен­ных филь­мах и те­ле­шоу).

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

Он так­же не за­ду­ман как ин­ст­ру­мент 3D-анима­ции. Ес­ли вас ин­те­ре­су­ет 3D, об­ра­ти­те внимание на неве­ро­ят­но продуктивное 3D-мо­де­ли­ро­вание в Blender, сре­де анима­ции и про­из­вод­ст­ва игр, так­же доступ­ной в Linux.

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

Начнем, по­жа­луй!

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

Се­го­дня мы соз­да­дим про­стую анима­цию мя­чи­ка, от­ска­ки­ваю­ще­го от по­ла. От­крыв Pencil, вы уви­ди­те че­ты­ре основ­ных зо­ны ин­тер­фей­са:

  • Ле­вая – это на­бор ин­ст­ру­мен­тов, ко­то­рые мы бу­дем ис­поль­зо­вать для соз­дания анима­ции.
  • Сред­няя – об­ласть ри­со­вания; это вир­ту­аль­ный холст, где по­явит­ся на­ша анима­ция.
  • Пра­вая – здесь по­ка­за­ны на­ша цве­то­вая па­лит­ра и ин­ст­ру­мен­ты. Мы восполь­зу­ем­ся ими поз­же, при рас­крас­ке ри­сун­ков.
  • Ниж­няя – здесь вы уви­ди­те вре­мен­ную шка­лу, где мы бу­дем до­бав­лять к на­шей анима­ции вир­ту­аль­ные страницы, что­бы соз­дать ил­лю­зию дви­жения.

Сна­ча­ла щелкнем по ин­ст­ру­мен­ту Sketch [Эс­киз] на ле­вой панели. Это кноп­ка с кар­тин­кой ка­ран­да­ша. На­жми­те кноп­ку, а за­тем на­ри­суй­те круг, изо­бра­жаю­щий мяч, и линию, изо­бра­жаю­щую зем­лю. Это долж­но на­по­ми­нать див­ное про­из­ве­дение ис­кусс­ст­ва, по­ка­зан­ное на рис. 1.

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

Сле­ва от шка­лы есть два слоя – Bitmap [Рас­тро­вый] и Vector [Век­тор­ный]. Сей­час мы ри­су­ем наш эс­киз на рас­тро­вом слое, а на­ша конеч­ная об­ве­ден­ная анима­ция бу­дет на век­тор­ном, по­это­му убе­ди­тесь, что у вас вы­бран рас­тро­вый слой.

(thumbnail)
Рис. 1. Наш пер­вый про­стой эс­киз — мяч.

Те­перь на­жми­те пер­вую кноп­ку спра­ва от над­пи­си Onion Skin [Лу­ко­вич­ная ше­лу­ха]; что она де­ла­ет, я объ­яс­ню немно­го по­го­дя. Те­перь на­жми­те кноп­ку +, ря­дом с над­пи­сью Keys [Клю­чи]. В слой Bitmap до­ба­вит­ся вто­рой клю­че­вой кадр, и бу­дет ав­то­ма­ти­че­­ски вы­бран.

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

Затем на­ри­суй­те та­кую же кар­тин­ку, но мяч немно­го бли­же к зем­ле. Зем­лю обя­за­тель­но то­же на­ри­суй­те. Это долж­но по­хо­дить на рис. 2. По­вто­ри­те тот же про­цесс несколь­ко раз, по­ка мяч дви­жет­ся вниз, от­ска­ки­ва­ет от зем­ли и дви­жет­ся уже вверх. Ка­ж­дый раз, до­бав­ляя но­вый клю­че­вой кадр, ри­суй­те мяч чуть бли­же к зем­ле, а за­тем ри­суй­те зем­лю.

За­тем ото­жми­те кноп­ку Onion Skin, вы­бе­ри­те пер­вый кадр и на­жми­те кноп­ку Play [Воспро­из­ве­дение]; и вы долж­ны уви­деть, как ваш мяч ожи­вет!

Об­вод­ка

Те­перь кон­вер­ти­руем на­бро­сок на­шей анима­ции в окон­ча­тель­ную, кра­си­во на­ри­со­ван­ную вер­сию. Этот про­цесс на­зы­ва­ет­ся «об­вод­ка [inking]»; для него по­тре­бу­ет­ся ин­ст­ру­мент ри­со­вания, от­сле­жи­ваю­щий толь­ко что сде­лан­ный эс­киз.

Для на­ча­ла вы­бе­ри­те пер­вый кадр. По­том уве­личь­те мяч. Для это­го на панели вы­бе­ри­те ин­ст­ру­мент Move/Zoom Canvas [Пе­ре­мес­тить/Уве­ли­чить Холст] (зна­чок ру­ки). На­жав кла­ви­шу Ctrl, щелкните и пе­ре­та­щи­те его мы­шью, и вы смо­же­те уве­ли­чи­вать и умень­шать. За­тем мож­но дви­гать холст, от­пуская клавишу Ctrl и на­жи­мая для пе­ре­ме­щения туда-сюда.

LXF154.tut animation.h opt.jpeg

До­бив­шись уве­ли­чения, вы­бе­ри­те слой Vector на вре­мен­ной шка­ле. Вы уви­ди­те, что ри­су­нок сно­ва по­свет­лел – это произошло по­то­му, что мы на­ло­жи­ли наш век­тор­ный слой. Ото­жми­те кноп­ку Onion Skin.

Далее, на­жми­те кноп­ку Polyline [По­ли­линия] на панели ин­ст­ру­мен­тов (зна­чок – свя­зан­ные линии). Этот ин­ст­ру­мент мож­но ис­поль­зо­вать для об­вод­ки ва­ше­го основ­но­го наброс­ка: он ри­су­ет кри­вые ме­ж­ду точ­ка­ми щелч­ка. Те­перь щелкните в ка­кой-нибудь точ­ке мя­ча и сде­лайте се­рию ко­рот­ких чер­то­чек, и вы уви­ди­те, как ка­ж­дая из них изо­гнет­ся при щелч­ке по ней. Ес­ли вы совершили ошиб­ку, на­жми­те Escape и начните все за­но­во.

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

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

Ес­ли по ка­ким-то при­чи­нам ва­ша об­вод­ка не в точ­но­сти сов­па­да­ет с же­лае­мой, мож­но ее по­пра­вить, на­жав кноп­ку Modify Curve [Из­менить Кри­вую] (зна­чок ру­ки с ука­за­тель­ным паль­цем) и щелк­нув на линии об­вод­ки. Поя­вит­ся кол­лек­ция то­чек, по ко­то­рым мож­но щел­кать, до­би­ва­ясь со­вер­шен­ст­ва.

Есть и дру­гие по­лез­ные ин­ст­ру­мен­ты, при­год­ные для об­вод­ки ри­сун­ка:

  • Сте­реть (зна­чок лас­ти­ка) – им мож­но уда­лить часть ва­шей об­вод­ки; но помните, что по­сле уда­ления нуж­но сно­ва замк­нуть ва­ши линии, что­бы мож­но бы­ло по­том за­лить цвет. Ес­ли у вас есть что-то цвет­ное (мы этим сей­час зай­мем­ся), сти­рание уда­лит весь цвет внут­ри фи­гу­ры, ко­то­рая ста­ла незамк­ну­той, так что вам при­дет­ся кра­сить ее за­но­во.
  • Вы­брать/Пе­ре­мес­тить объ­ект (зна­чок – стрел­ка) – этим ин­ст­ру­мен­том мож­но щелк­нуть на объ­ек­те и пе­ре­мес­тить его в дру­гую часть хол­ста. Вы так­же мо­же­те на­жать на об­ве­ден­ной час­ти ри­сун­ка – поя­вит­ся ог­раничи­ваю­щее ок­но, где мож­но на­жать на ру­ко­ят­ку, что­бы из­менить его раз­мер. Этот ин­ст­ру­мент по­ле­зен для пе­ре­дви­гания ри­сун­ка, при­менения вы­ре­зания и встав­ки, что­бы вве­сти эле­мент в но­вый клю­че­вой кадр, и ис­поль­зо­вания ин­ст­ру­мен­та Modify Curve для на­строй­ки но­во­го ри­сун­ка по сво­ему усмот­рению.

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

Те­перь по­вто­ри­те тот же про­цесс, вы­бе­ри­те ин­ст­ру­мент Polyline и об­ве­ди­те вто­рой ри­су­нок. По­вто­ри­те тот же про­цесс для всех кад­ров в ва­шей анима­ции.

Рас­крас­ка

Наш сле­дую­щий шаг – рас­крас­ка анима­ции. К сча­стью, это де­лается очень про­сто. Во-пер­вых, вы­бе­ри­те слой Vector и на­жми­те кноп­ку Fill [За­лить] на панели ин­ст­ру­мен­тов (зна­чок – вед­ро с лью­щей­ся крас­кой). Те­перь вы­бе­ри­те цвет из панели в пра­вой час­ти ин­тер­фей­са. Ес­ли вы недо­воль­ны на­бо­ром цве­тов по умол­чанию, на­жми­те кноп­ку + ря­дом с те­ку­щим вы­бранним цве­том. По­явит­ся зна­ко­мый диа­лог вы­бо­ра цве­та; най­ди­те нуж­ный вам цвет и на­жми­те кноп­ку Add To Custom Colours [До­ба­вить цвет поль­зо­ва­те­ля], что­бы со­хранить его. За­тем на­жми­те кноп­ку ОK, что­бы до­ба­вить его в спи­сок цве­тов в основ­ной ин­тер­фейс.

Вам, ве­ро­ят­но, по­тре­бу­ет­ся про­кру­тить вниз, что­бы уви­деть цвет; за­од­но мож­но два­ж­ды щелк­нуть по его имени и из­менить имя на нечто бо­лее зна­чи­мое, чем Цвет 24.

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

Да­лее, скро­ем слой Bitmap, щелк­нув на се­ром кру­жоч­ке сле­ва от имени слоя. Мо­же­те на­жать кноп­ку Play, что­бы уви­деть, как ваш цвет­ной мя­чик от­ска­ки­ва­ет от зем­ли.

Еще од­на по­лез­ная воз­мож­ность – до­бав­ление к анима­ции рас­тро­вых рас­ту­ше­ван­ных цве­тов. Рас­ту­ше­ван­ный [feathered] цвет оз­на­ча­ет, что на­ри­со­ван­ная линия бледнеет по кра­ям, как нанесен­ная ки­стью. Для это­го щелкните по круж­ку в се­рой зоне над слоя­ми – она по­чернеет (это зна­чит, что вы мо­же­те ви­деть несколь­ко сло­ев од­но­вре­мен­но). Те­перь на­жми­те кноп­ку + ря­дом с Layers, что­бы до­ба­вить но­вый слой Bitmap. Вы­бе­ри­те этот слой, а за­тем при­мените ин­ст­ру­мент Colouring [Раск­ра­ска] (зна­чок – кис­точка) и из­мените па­ра­мет­ры под ин­ст­ру­мен­та­ри­ем для на­строй­ки цве­та, раз­ме­ра, эф­фек­та рас­ту­шев­ки и неко­то­рых дру­гих эле­мен­тов.

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

Да­дим под­роб­но­сти

По­кон­чив с об­вод­кой и цве­том на­шей анима­ции, вы, ве­ро­ят­но, за­хо­ти­те до­ба­вить вся­кие мел­кие де­та­ли и тени. К сча­стью, в Pencil это то­же про­сто.

Спер­ва до­ба­вим неко­то­рые де­та­ли. Начните с вы­бо­ра пер­во­го клю­че­во­го кад­ра на тре­ке Vector и на­жми­те кноп­ку Draw [Ри­со­вать] (значок – пе­ро ав­то­руч­ки). Пре­ж­де чем ри­со­вать, мож­но уста­но­вить раз­мер пе­ра в ле­вой панели ин­ст­ру­мен­тов, а так­же вы­брать цвет из па­лит­ры. Те­перь ри­суй­те на кар­тин­ке де­та­ли. На­при­мер, до­ба­вьте линии, подчеркивающие дви­жение, как на рис. 4.

Ес­ли вы хо­ти­те снаб­дить ва­шу анима­цию те­ня­ми, ин­ст­ру­мент Sketch [Эс­киз] (зна­чок – ка­ран­даш) при­го­дит­ся для ри­со­вания очер­таний, ко­то­рые за­тем мож­но за­лить бо­лее тем­ным цве­том. Это удоб­но для чет­кой об­ри­сов­ки кон­ту­ров объ­ек­тов в анима­ции.

Слой ка­ме­ры

Еще од­на по­лез­ная функ­ция Pencil – слой ка­ме­ры [Camera layer]. Он обес­пе­чи­ва­ет взгляд на ри­су­нок в оп­ре­де­лен­ном ра­кур­се, с уче­том со­от­но­шения сто­рон кад­ра. Слой ка­ме­ры соз­да­ет­ся на­жа­ти­ем знач­ка + ря­дом с Layers и вы­бо­ром но­во­го слоя ка­ме­ры. В ваш холст до­ба­вит­ся бе­лый квад­рат, ото­бра­жаю­щий вид из ка­ме­ры.

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

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

Оз­ву­чим

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

По­нят­но, что для при­менения этой функ­ции на­до за­по­лу­чить зву­ко­вые эф­фек­ты на свой ком­пь­ю­тер. Мно­же­ст­во та­ко­вых име­ет­ся в Ин­тернете; один из луч­ших сай­тов – http://www.freesound.org/ (с ог­ром­ной ба­зой дан­ных зву­ков по ли­цен­зии Creative Commons).

Ска­чай­те по­нра­вив­шие­ся зву­ки, и вы смо­же­те до­бав­лять но­вые, на­жав зна­чок + ря­дом с Layers и вы­брав но­вый слой зву­ка.

Что­бы до­ба­вить зву­ко­вой эф­фект, вы­бе­ри­те Edit > Import Sound [Прав­ка > Им­порт Зву­ка] и вы­бе­ри­те звук (в фор­ма­те WAV). На но­вом слое зву­ка [Sound Layer] вы уви­ди­те тре­угольник там, где в ва­шей анима­ции раз­да­ст­ся звук.

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

Со­храним муль­тик

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

К со­жа­лению, с точ­ки зрения диа­па­зо­на воз­мож­но­стей Pencil здесь несколь­ко ог­раничен, но пре­достав­ля­ет сред­ст­во вы­во­да анима­ции в ви­де филь­ма Flash. Для это­го про­сто вы­бе­ри­те File > Export > Flash/SWF, и сгенери­ру­ет­ся флэш-анима­ция.

За­круг­ля­ем­ся

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

Бы­ст­рый по­иск в Google или по­иск по “Pencil animation” на YouTube по­ка­жет вам мно­го чу­дес­ных муль­ти­ков, соз­дан­ных и вы­ло­жен­ных поль­зо­ва­те­ля­ми Pencil. На YouTube есть так­же ряд по­лез­ных ви­део­учебников и де­мо-вер­сий, где мож­но по­смот­реть мно­гие из функ­ций, ко­то­рые мы об­су­ди­ли во вре­мя это­го уро­ка.

Помните, что анима­ция тре­бу­ет тер­пения, но ес­ли вы его на­бе­ре­тесь, муд­ро при­мените функ­ции Pencil и да­ди­те во­лю сво­ему во­об­ра­жению, вы соз­да­ди­те по­ис­тине неза­бы­вае­мые анима­ции. Обя­за­тель­но со­об­щи­те нам в Linux Format о ва­ших ше­дев­рах! Желаем уда­чи!

Персональные инструменты
купить
подписаться
Яндекс.Метрика