آموزش ساخت انیمیشن با فلش

animations

Active Member
سلام دوستان. توی این تاپیک می خوام ساخت انیمیشن با Flash رو از ابتدا بگم تا برسیم به انیمیت کاراکتر و نکات ریزی که باعث می شه کار قشنگ بشه.


من از فلش برای ساخت ساخت انیمیشن و ecard استفاده می کنم. قبلش بگم که تقریبا همه اینها رو تجربی یاد گرفتم. خیلی چیزها رو هنوز نمی دونم. پس اگه دیدین با روشهای بهتر یا ساده تر می شه انیمیشن ساخت، خوشحال می شم بگین. مخصوصا راجع به Flash CS4 و امکانات انیمیشن سازیش و گیرهایی که هنوز دارم، دوست دارم بعدا صحبت کنیم...


فعلا چیزهایی که خودم بلدم رو می گم. آموزشها رو بصورت تصویری می ذارم. امیدوارم به درد بخور باشن. :rose:


..........





شروع کار با Flash :


اولش که Flash CS4 رو باز می کنیم، Flash File (ActionScript 3.0) l رو انتخاب می کنیم تا یه فایل جدید باز بشه.









برای راحتی کار، حالت پیش فرض فلش رو برای انیمیشن تغییر می دیم. برای این کار می ریم توی:

Window \ Workspace \ Animatior​
(از بالای صفحه، سمت راست هم می شه انتخابش کرد. کنار search یه منوی کرکره ایه) :D










خب، قیافه ش اینطوری بهتر شد... من فلش رو برای یاد گرفتن به سه قسمت تقسیم می کنم:

گرافیک - انیمیشن - برنامه نویسی


- ابزارهای گرافیک برای کشیدن شکلها هستند. (منوی TOOLS در وسط صفحه)
- انیمیشن که همون متحرک سازیه. (اصلش TIMELINE هست که در بالای صفحه ست)
- برنامه نویسی هم که من شرمنده... سه چهار تا دستور بیشتر بلد نیستم، اونم از actionscript 2 . (اگه F9 رو بزنین، منوش کنار TimeLine در بالای صفحه باز می شه)





این تابلوئه دیگه... صفحه اصلی کارمون همین سفیده ست که وسطه. اسمش هست: Scene 1

منوی PROPERTIES هم در سمت راست برای تنظیم خصوصیت هاست، که قراره زیاد باهاش کار داشته باشیم.


..........






خب... فعلا اینها بمونه تا بعدا تاپیک رو ادامه بدم. الان خوابم گرفته راستش.

فعلا
 

animations

Active Member
آموزش حرکت یک توپ

شاید حرکت یه توپ ساده باشه، ولی کلی نکته توش هست. :wink:

نکته ها و ترفندها رو با یه رنگ دیگه نشون می دم.


..........




کشیدن توپ:


اول یه صفحه جدید باز می کنیم.

برای کشیدن یه دایره به عنوان توپ، ابزار Oval Tool رو انتخاب می کنیم.


pic 04



قبل از اینکه دایره رو رسم کنیم، رنگش رو می تونیم تعیین کنیم (از منوی Tools یا Color ). من اینجا حالت گرادیانت رو انتخاب می کنم تا توپه به نظر سه بعدی بیاد.


pic 05



می ریم توی صفحه، دایره رو می کشیم (برای اینکه دایره کاملا گرد بشه، روی کیبورد Shift رو نگه می داریم). دایره رو بالای صفحه می کشم، چون می خوام توپ روی هوا باشه، بخوره زمین، دوباره بره هوا...


pic 06



گرادیانتش زیاد تعریفی نداره. می خوام اینطور به نظر بیاد نور از کنار تابیده بهش. پس همین طور که دایره انتخابه، ابزار Gradient Transform Tools رو انتخاب می کنم.


pic 07



موس رو می بریم تقریبا وسط شکل که قیافه ش شبیه فلش چهار سر بشه. حالا مرکزش رو می گیریم و جا به جاش می کنیم.
بعد موس رو می بریم به سمت مداری که دور شکلمونه، جایی که یه مربع و دو تا دایره هست. روی دایره وسطی کلیک می کنیم و محیط گرادیانت رو یه کم بزرگتر می کنیم (مثل شکل 8).


pic 08


یادتون نره فایلتون رو save کنین...


یه نکته مهم برای آدمهای مبتدی: از الان دیگه حواستون باشه که همش باید توی Scene 1 باشید. یعنی نباید روی شکلی که کشیدین دو تا کلیک کنین. (چون اگه group باشه یا بعدا که Symbol ش می کنیم، ممکنه برید توشون و همه چیز به هم بریزه).
از کجا بفهمیم توی Scene 1 هستیم یا نه؟ مطابق شکل، جلوی عکس کلاکت فقط و فقط باید نوشته شده باشه: Scene 1 . اگه جلوش نوشته های دیگه ای هم دیدین، روی Scene 1 کلیک کنین تا موقعیتتون همیشه توی صفحه اصلی باشه.
:wink:


pic 09





حرکت دادن با روش Classic Tween


- مراحل مقدماتی:

بعد از اینکه شکلمون رو کشیدیم، ابزار Selection Tool رو انتخاب می کنیم. دور شکلمون یه کادر بزرگ می کشیم تا همه ش انتخاب بشه. حواسمون باشه که باید همش درست انتخاب بشه. اگه شک داریم که خوب انتخاب کردیمش یا نه، بهتره در منوی TimeLine (در بالای صفحه)، روی فریم اول یه کلیک کنیم.


pic 10



بعد از اینکه شکلمون رو انتخاب کردیم، روی کیبورد F8 رو یک بار می زنیم. یه صفحه باز می شه به اسم Convert to Symbol. اسمش رو می ذاریم مثلا Ball و در قسمت Tipe می ریم Movie Clip رو انتخاب می کنیم. و Ok رو می زنیم.


pic 11



حالا شکلمون رفته توی Library یا کتابخونه که در سمت راست صفحه معلومه. کتابخونه توی فلش خیلی باحاله. اگه درست ازش استفاده کنیم، می تونیم انیمیشن ها رو فوق العاده کم حجم بسازیم. شاید اولش آدمهای مبتدی اذیت بشن وقتی باهاش کار می کنن. ولی قلق هاش که دست آدم بیاد، می فهمه که چه شاهکاریه...



- انیمیت:

مراحل مقدماتی تموم شد. حالا می ریم سراغ انیمیت کردن. می خوام توپ روی هوا باشه، بعد بیاد بخوره زمین، بعد دوباره بره هوا.
الان توپ روی هواست. موس رو می بریم روی TimelLine (در بالای صفحه) و روی فریم مثلا 15 یه کلیک می کنیم.


pic 12



بعد دکمه F6 روی کیبورد را می زنیم تا در فریم 15 ، یک keyframe درست بشه.


pic 13



حالا توپ رو جا به جا می کنیم. می بریمش پایین. ترجیحا برای پایین بردن توپ، به جای موس از فلش روی کیبورد استفاده کنین تا توپ دقیقا در جای خودش پایین بره.
فلش روی کیبورد کنده؟ توپه خیلی آروم می ره پایین؟ shift رو هم نگه دارید که سریعتر بره. :wink:

حالا اگه روی فریم اول کلیک کنین، توپ بالاست، ولی وقتی روی فریم 15 کلیک کنین توپ پایینه:


pic 14



حالا روی یه فریم بین 1 تا 14 رایت کلیک می کنیم و Create Classic Tween رو انتخاب می کنیم.


pic 15



رنگ فریم های روی TimeLine بنفش می شه. یه فلش هم می یاد روش.


pic 16



اگه دکمه Enter روی کیبورد رو بزنیم، انیمیشن توی محیط Flash یه بار پخش می شه. ولی اگه Ctrl + Enter رو بزنیم، یه خروجی swf برامون می گیره:


pic 17
Flash Animation- 17.gif




خب، حرکت رو ساختیم. ولی چرا توپه وقتی می رسه پایین، یه هو غیب می شه؟؟

ما پایین رفتن توپ رو ساختیم. ولی بالا رفتنش رو نساختیم. توپ از فریم 1 تا فریم 15 می یاد پایین، حالا باید از فریم 15 تا فریم 30 به سمت بالا حرکت کنه.

پس روی فریم 30 کلیک می کنیم و F6 روی کیبورد رو فشار می دیم. توپ رو باز دوباره می بریم بالا.


pic 18



بین فریم 15 تا 29 روی Timeline رایت کلیک می کنیم و باز دوباره Create Classic Tween رو انتخاب می کنیم.


pic 19



روی کیبورد Ctrl + Enter رو می زنیم تا نتیجه رو ببینیم.


pic 20
Flash Animation- 20.gif




دو تا مشکل داره. اول اینکه توپ وقتی بالاست تیک می خوره. دوم اینکه زمان بندیش افتضاحه. کجای این شبیه یه توپه که می خوره زمین هوا می ره؟!



مشکل اول: توپ وقتی بالاست تیک می خوره.

دلیل: در فریم اول، توپ ما بالاست. در فریم آخر هم توپ ما بالاست. این دو تا باید دقیقا در یه مکان باشن. ولی چون ما بصورت دستی توپ رو بالا و پایین بردیم، جاهاشون یه کم فرق می کنه با هم.

راه حل: روی فریم 30 (آخرین فریم) در TimelLine کلیک می کنیم و توپ را پاک می کنیم (با استفاده از Delete روی کیبورد). شکل فریم های TimeLine اینطوری می شه:


pic 21



حالا به فریم اول می ریم، توپ رو انتخاب می کنیم، و Ctrl + c روی کیبورد رو می زنیم تا توپ کپی بشه.
بعد به فریم 30 که الان خالیه می ریم، و Shift + Ctrl + v رو می زنیم تا شکل دقیقا سر جایی که باید باشه ظاهر بشه.

حالا وقتی Ctrl + Enter رو بزنیم، دیگه تیک نمی خوره، فقط یه لحظه مکث داره که بعدا بهش می رسیم. :D


pic 22
Flash Animation- 22.gif




مشکل دوم (زمان بندی صحیح) رو توی پست بعدی می گم.




منبع: مجیدآنلاین
نویسنده: ا . فروهری
 

B E H N A M

Member
بسیار عالی بود .
ما هم منتظر ادامه آموزشها هستیم .
تازگیا خوشم اومده فلش یاد بگیرم ...
 

animations

Active Member
آموزشی که شروع کرده بودم به خاطر مشغله کاریم نصفه موند. این آموزش رو امروز توی اینترنت دیدم که از یه کتاب عالی ترجمه شده. امیدوارم همونطور که اون کتاب به درد من خورد، این ترجمه کوتاه به درد شما هم بخوره.


..........


عنوان آموزش : Character Animation in Flash
نام تهیه کننده : امیر پروای بی شک
مبحث آموزش : Animation
نرم افزارها : Flash
منبع: http://cgacademy.ir/tutorials/character_animation_in_flash


[FONT=&quot] خيلي از انيماتور ها از نرم افزار [/FONT] [FONT=&quot] Macromedia Flash[/FONT] براي دست يابي به انيميشن هاي برداري با جزئيات بيشتر استفاده مي كنند. يكي از قدرت هاي برنامه Flash سليس بودن آن در فرايند توليد است. من يك سري تكنيك هاي شخصي ابداع كرده ام كه مي تواند به شما كمك كند اجزاء مختلف يك انيميشن پيچيده را مديريت كنيد و بسازيد. در اين مقاله، من چند تا از بهترين اسرار ساخت انيميشن خودم را فاش كرده ام كه ما را از يك اسكيس (طراحي سريع) ساده كاراكتر به يك انيميشن كامل Flash مي رساند.
شما براي انجام مراحل اين مقاله نياز به برنامه Macromedia Flash Professional 8 و فايل نمونه mudbubble_boy.zip هستيد. اين مقاله براي افراد مبتدي تهيه شده، بنا براين تمام افرادي كه تجربه كار با Flash را دارند مي توانند اين مقاله را مطالعه كنند.


در باره نويسنده:
01.jpg

Chris Georgenes هنرمند و انيماتوري است كه بدون وابستگي به هيچ حزبي، تمام وقت در حال فعاليت براي سايت ها، CD ها و برنامه هاي تلويزيوني است. او براي شركت هاي زير فعاليت داشته:
Pileated Pictures
LucasArts
Universal Records
Plot Developers
AOL
در اين ميان او طراحي و نگه داري از سايت www.mudbubble.com را در پرونده خود دارد، و سايت www.keyframer.com به عنوان سايت آموزش Flash ايشان مي باشد. Chris همچنين عضو گروه [FONT=&quot]Macromedia[/FONT] مي باشد.


نقاشي در Flash:
برنامه Flash‌ داراي چندين ابزار نقاشي براي خلق كاراكتر هاي كارتوني و ... است. هر كدام از اين ابزارها نتيجه منحصر به فرد خود را دارند. همچنان كه شما با اين ابزارها بيشتر آشنا مي شويد شما ياد خواهيد گرفت كه چگونه بهترين ابزار را براي كار خود انتخاب كنيد كه براي خلق سبك هنري خودتان مناسب است و سايز فايلي را كه انتظار داريد را براورده كند، اين فقط يك سبك سنگين كردن اين است كه مي خواهيد دانلود فايل شما چقدر طول بكشد و چه كيفيتي از كار خود انتظار داريد. در اين بخش من نگاهي به هر يك از ابزارهای نقاشي در Flash خواهم انداخت و درباره مناسب چگونگی کاربردشان بحث خواهم كرد.


ابزار Brush يا قلم مو:
ابزار Brush كه در عكس زير مي بينيد، تقريبا روان ترين ابزار است، مخصوصا وقتي كه با حساسيت فشار قلم تركيب شود.
02.jpg
نقاشي با ابزار Brush دقيقا همانند نقاشي با اشياء مي باشد. ابزاري است كه وقتي از حساسيت فشار و خاصيت كج شدن در آن استفاده مي شود، كه خيلي طبيعي به نظر مي آيد. شركت Wacom يكسري قلم نوري مي سازد كه نيازي به باطري ندارند، بي سيم مي باشند و همچنين در سايز هاي مختلف ساخته مي شوند كه به خوبي با برنامه Flash كار مي كند، وقتي كه Wacom مي تواند به جاي موس شما عمل كند، ديگر چه نيازي به ماوس در موقع نقاشي داريد؟ كار كردن با قلم نوري و Flash خيلي بهتر است تا به تنهايي با Flash كار كنيد. بسياري از طراحان ديجيتال كه با برنامه هاي مختلف گرافيكي و انيميشن مانند Adobe Photoshop، Adobe Illustrator و Macromedia Freehand كار مي كنند، قلم نوري يكي از ابزار هاي اصلي آنهاست. اما نترسيد، اگر در حال حاضر صاحب صفحه و قلم نوري نيستيد، فعلا مي توانيد از ابزار Brush استفاده كنيد ولي خاصيت كج كردن قلم و فشار قلم در دسترس نخواهد بود. اگر يك صفحه و قلم نوري با قابليت حساسيت به فشار داريد، انتخاب ابزار Brush دو حالته مي شود كه انتخاب هر كدام كيفيت خط منحصر به فرد خود را دارد. در پايين ترين قسمت جعبه ابزار خود، شما متوجه دكمه حساسيت فشار و خاصيت كج كردن قلم مي شويد (به تصوير 2 نگاه كنيد)، با انتخاب يكي از اين ابزار يا هر دوي آنها، نتايج گوناگوني را در موقع استفاده از اين قلم خواهيد ديد.

03.jpg
تصوير 3 نشان مي دهد كه در موقع استفاده از ابزار Brush چه اتفاقي مي افتد، نتيجه تصوير چپ يك "شكل" يا Shape است، يعني از اطراف داراي نقاط برداري مي باشد، هر چه تعداد نقاط بيشتر باشد اندازه يا سايز فايل نيز بزرگتر خواهد شد. من اين شكل را با صفحه و قلم نوري مجهز به حساسيت به فشار رسم كرده ام، به نوك تيز بودن انتهاي خط و كلفتي نازكي آن توجه كنيد كه با حساسيت فشار قلم به وجود آمده اند. من شكل سمت راست را نيز با ابزار Brush رسم كرده ام، البته اين بار خاصيت كج كردن قلم و حساسيت به فشار را خاموش كردم.

04.jpg
ابزار Brush‌ داراي گزينه هاي متعددي است كه باعث مي شوند افكت هاي ويژه اي به وجود آوريد (در تصوير 4 نشان داده شده).
·[FONT=&quot] [/FONT] حالت عادي (Normal): روي خط ها (Line) و رنگهاي (Fill) لايه جاري را پر مي كند.
·[FONT=&quot] [/FONT] حالت پر كردن رنگها (Paint Fills): درون يك رنگ را پر مي كند و بيرون آن را نيز رنگ مي كند، يعني با خطوط كاري ندارد.
·[FONT=&quot] [/FONT] حالت رنگ كردن پشت (Paint Behind): پشت خطوط و رنگها را پر مي كند.
·[FONT=&quot] [/FONT] حالت رنگ كردن نواحي انتخاب شده (Paint Selection): به شما اين امكان را مي دهد كه فقط نواحي انتخاب شده را رنگ كند.
·[FONT=&quot] [/FONT] حالت رنگ كردن درون (Paint Inside): وقتي كه شروع به نقاشي كردن درون يك رنگ كنيد شما را از خارج شدن از خطوط محافظت مي دارد.

05.jpg

رسم اشكال:
رسم اشكال يكي از خصوصيات جديد Flash 8 مي باشد و به شما اين امكان را مي دهد كه اشكال مجزا از هم رسم كنيد كه مستقل هم باشند، آن روزها كه بايد همه اشكال را در يك لايه مجزا رسم مي كرديم تا در همديگر تداخل و برش ايجاد نكنند گذشته است. با Flash 8 شما به سادگي با فعال كردن Object Drawing يا با فشار دكمه J اين گزينه را كه بخشي از تمام ابزار هاي نقاشي است (قلم، مداد، خودكار، بيضي و مستطيل) را روشن يا خاموش كنيد (تصوير 5). براي آنهايي كه با نرم افزارهاي Macromedia FreeHand يا Adobe Illustrator آشنا هستند، اين گزينه براي آنها جديد نمي باشد ولي در Flash 8‌ اين گزينه به تازگي اضافه شده است.

06.jpg
همان طور كه در تصوير 6 مي بينيد، رسم يك شكل روي يك شكل ديگري كه قبلا وجود داشت باعث مي شود يك قسمت از شكل زيرين برش بخورد. به اين نوع نقاشي نوع تركيبي يا Merge مي گويند. اين نوع نقاشي موقعي مفيد است كه بخواهيم با برش دادن قسمت هايي از يك شكل، يك شكل جديد به وجود بياوريم.
07.jpg
وقتي شما يك شكل را با استفاده از گزينه Object Drawing رسم مي كنيد، اشكال در يكديگر اختلال ايجاد نمي كنند و همديگر را برش نمي دهند. شما مي توانيد اشكال را روي هم رسم كنيد بدون اين كه آنها با يكديگر تركيب شوند (تصوير 7). اين گزينه موقعي مفيد است كه بخواهيد اشكال را بعدا جابجا كنيد يا فقط بخواهيد آنها مجزا از هم بمانند.

08.jpg
من اين شخصيت كارتوني را كاملا با استفاده از ماوس و ابزار هاي مستطيل و بيضي خلق كرده ام. اصلا نيازي به استفاده از صفحه و قلم نوري Wacom براي تركيب با ابزار قلم نداشتم. من به راحتي مي توانستم ابزار Brush‌ را انتخاب كنم، اما استفاده از ابزار هاي رسم شكل كيفيت خيلي خوب و تميزي را به وجود مي آورد. ابزار Brush‌ مي تواند باعث به وجود آمدن نقاط غير ضروري بسياري شود كه باعث مي شود اندازه فايل بزرگ شود و اگر بخواهيم شكل را دوباره ويرايش كنيم بسيار سردرد آور خواهد شد. در طراحي كاراكتر اين پسر من تا حد امكان به دنبال اشكال ساده تر و كوچك ترين فايل ممكن مي گشتم.

09.jpg

ابزار مداد:
اگر بخواهيد كلفتي خط را در تمام تصويرتان هماهنگ كنيد و اندازه فايلتان را نيز كوچك نگه داريد ابزار مداد يا Pencil كه در تصوير 9 نمايش داده شده،‌ يك ابزار بسيار دقيق مي باشد.

10.jpg
خطي كه با ابزار مداد رسم شده داراي نقاط برداري كمتري است،‌ يك خط كاملا راست فقط دو نقطه برداري دارد، يكي در ابتداي خط و ديگري در انتهاي آن. يك خط كج با توجه به تعداد موج آن داراي 3 نقطه يا بيشتر است (تصوير 10).
11.jpg
ابزار مداد نيز داراي چندين حالت مي باشد (تصوير 11):
·[FONT=&quot] [/FONT] Straighten‌ يا صاف: اين يك گزينه عالي براي رسم خطوط بسيار صاف است كه با دست رسم مي شوند. حتي با يك دست لرزان هم مي توانيد خطوط بسيار صافي رسم كنيد.
·[FONT=&quot] [/FONT] Smooth‌ يا نرم: اگر از اين گزينه استفاده كنيد، خطوط شما نرم خواهند شد، در حالي كه شكل اصلي كه شما مي خواستيد خلق كنيد از بين نرفته است.
·[FONT=&quot] [/FONT] Ink يا جوهر: اين گزينه هيچ اثري روي خطوطي كه رسم كرديد نمي گذارد.

12.jpg

ابزارهاي رسم اشكال:
ابزارهاي رسم اشكال، بيضي و مستطيل، اشكال و خطوط اوليه را به وجود مي آورند (تصوير 12 را نگاه كنيد). نگه داشتن Shift‌ در هنگام رسم اين اشكال، مربع و دايره كامل حاصل مي شود.
13.jpg
شما مي توانيد رنگ خطوط و رنگ درون اشكال را در قسمت Property Inspector تعريف كنيد (تصوير 13 را ببينيد). روي مربع رنگي كليك كنيد تا پالت رنگ باز شده و رنگ مورد نظر خود را براي درون و خطوط شكل خود انتخاب كنيد.
14.jpg
شما همچنان مي توانيد با انتخاب مربعي كه يك خط مورب درون آن است، رنگ درون يا خط شكل مورد نظر را بي رنگ انتخاب كنيد.


ابزار Pen يا خودكار:
براي رسم مسيرهاي دقيق، خطوط مستقيم و منحني هاي نرم مي توانيد از اين ابزار استفاده كنيد (تصوير 15 را ببينيد). با اين ابزار مي توانيد خطوط مستقيم و منحني را با تعريف زاويه، بلنداي خطوط مستقيم و شيب خطوط منحني، رسم كنيد.
15.jpg
با ابزار خودكار، شما با كليك كردن نقاط را در قطعات خطوط مستقيم به وجود مي آوريد، سپس كليك كنيد و بكشيد (Drag) تا خط را به منحني تبديل كنيد. شما مي توانيد مستقيم بودن و منحني بودن خطوط را با نقاط روي خط تغيير دهيد. همچنين مي توانيد خطوط مستقيم را به منحني تبديل كنيد و برعكس. وقتي خطوط منحني رسم مي كنيد شما متوجه مي شويدكه Flash يك دسته مماس به نقاط سپر (Anchor) مي سازد. مي شود نقاط را بعدا با استفاده از ابزار Subselection انتخاب كنيم، دستگيره ها را بكشيم (Drag) و آنها را اصلاح كنيم (تصوير 16 را نگاه كنيد). تغيير دادن دستگيره ها با توجه به نقطه اي كه انتخاب كرده ايد، منحني را تغيير مي دهد.

16.jpg

ابزار پوست پياز (Onion Skin Tool):
ابزار Onion Skin در زير پنل TimeLine قرار دارد.
17.jpg
وقتي شما ابزار Onion Skin را انتخاب مي كنيد، نرم افزار دو علامت در بالاي TimeLine به وجود مي آورد (تصوير 17 را نگاه كنيد). شما مي توانيد اين علامت ها را بكشيد تا تعداد فريم هاي بعد و قبل فريم فعلي را گسترش دهيد.
18.jpg
Flash دو نوع اين ابزار را ارائه مي دهد:
·[FONT=&quot] [/FONT] عادي يا Normal Onion Skin: فريم جاري با رنگ كامل نمايش داده مي شود در حالي كه فريم هاي قبلي و بعدي به مرور كم رنگ شده اند، اين همان اثر كاغذ هاي نيمه شفاف را مي دهد كه روي آنها مجموعه اي از نقاشي ها رسم شده اند و كاغذها روي هم انباشته مي شوند (تصوير 18 را نگاه كنيد).
·[FONT=&quot] [/FONT] حالت خطوط خارجي يا Onion Skinning on Outline Mode: فريم جاري با رنگ كامل نمايش داده مي شود در حالي كه فريم هاي قبلي و بعدي به صورت خطوط خارجي نمايش داده مي شوند (تصوير 18 را نگاه كنيد). وقتي كه با فريم هاي كليدي بعد و قبل متعددي سروكار داريم اين حالت براي چشم ها راحت تر است.

19.jpg

كار سمبل ها:
سمبل ها يا Symbols ماهيت اصلي برنامه Flash مي باشد. شما هر چيزي را مي توانيد رسم كنيد و آن را تبديل به يك Symbol كنيد و تقريبا در تمام موارد شما بايد اين كار را كنيد. وقتي يك شكل تبديل به يك Symbol مي شود به صورت خودكار وارد كتابخانه (Library) Flash مي شود. هر فايل Flash كتابخانه مختص خود را دارد كه مي توانيد Symbol ها را از آن به درون صفحه بكشيد. وقتي كه شما اين كار را مي كنيد، شيء ي كه در صفحه است،‌ به عنوان يك نمونه به حساب مي آيد، مهم نيست چند نمونه در صفحه وجود دارد، در برنامه Flash فقط يك بار اين نمونه Load مي شود، به خاطر همين است كه با Flash ميتوان انيميشن هاي بلند ساخت و در عين حال اندازه فايل را نيز كوچك نگه داشت. وقتي از يك Symbol به بيشترين تعداد ممكن استفاده كنيم بسيار موثر خواهد بود. شما همچنين مي توانيد افكت هايي نيز به Symbol ها اعمال كنيد، از جمله: چرخش (Scale) تغيير رنگ (Tint) شفافيت (Alpha) و روشني (Brightness) همچنين مي توانيد Motion Tween را با تركيب اين چند افكت انجام دهيد.
به هر حال قبل از اينكه از بحث دور شويم، من شما را به Symbol‌ ها و رفتار آنها آشنا مي كنم.
يك شكل بكشيد، مهم نيست چه مي كشيد يك شكل ساده نيز كار را انجام خواهد داد. آن را انتخاب كنيد (Ctrl+A) و با انتخاب Modify > Convert to Symbol يا فشردن دكمه F8 آن را تبديل به Symbol‌ كنيد. با اين عمل پنجره Convert to Symbol باز مي شود (تصوير 19).

20.jpg
در پنجره Convert to Symbol مي توانيد يك نام براي Symbol خود تايپ كنيد، يكي از سه Behavior‌ (رفتار) را انتخاب كنيد و در انتها يكي از نقاط Registration‌ را انتخاب كنيد. در زير توضيحات هر رفتار و معني آنها شرح داده شده:
·[FONT=&quot] [/FONT] Movie Clip- Movie Clip ها پويا يا Dynamic هستند، اين بدين معني است كه مي شود آنها را توسط Action Script (زبان برنامه نويسي Flash) مورد هدف قرار داد (Target). مي توان در آنها به تعداد دلخواه لايه و فريم داشت، ولي Timeline آنها كاملا با Symbol‌ هاي ديگر مستقل است. به منظومه شمسي فكر كنيد: هر سياره يك Movie Clip است و دائما و به صورت مستقل به دور خورشيد كه Timeline اصلي شما است در حركت هستند.
·[FONT=&quot] [/FONT] Button- دكمه ها داراي 4 حالت هستند: Over، Up، Down و Hit. اينها به صورت فريم در Timeline اين Symbol نمايش داده مي شوند. شما مي توانيد هر عكس گرافيكي را در اين فريم ها قرار دهيد، ActionScript به نمونه تان اعمال كنيد و آن را در فيلم Flash خود قرار دهيد.
·[FONT=&quot] [/FONT] Graphic- Symbol هاي گرافيكي شباهت زيادي به Symbol هاي Movie Clip دارند، تنها تفاوت آنها اين است كه آنها پويا نيستند و نمي توان آنها را توسط ActionScript مورد هدف قرار داد. هرچند شما مي توانيد يك Graphic را درون يك Movie Clip قرار دهيد. Symbol هاي گرافيكي مي توانند به تعداد دلخواه فريم و لايه داشته باشند. مهمترين خصوصيت اين است كه آنها هميشه در هارموني و هماهنگي با Timeline اصلي و يكديگر هستند. موقعي كه مي خواهيم يك انيمشني بسازيم كه اساس آن زمان است، بسيار مهم است.
در اين آموزش، من توصيه مي كنم از Symbol گرافيكي استفاده كنيد، اين به شما اين امكان را مي دهد كه بتوانيد در Timeline اصلي Scrub كنيد، معني Scrub جلو و عقب بردن فريم ها به صورت دستي است تا بتوانيد انيميشن را آزمايش كنيد. Movie Clip ها از فريم 1 به بعد را نمايش نمي دهند مگر اينكه آن را با فشردن دكمه هاي Ctrl+Enter امتحان كنيد يا اينكه فيلم خود را تبديل به يك فايل Swf كنيد.
اجرا كردن طرح هايتان:
هر طرح خوب معمولا با يك مداد و كاغذ شروع مي شود. من بعضي اوقات لحضات بسيار خلاقم را در سمينار هاي خسته كننده يا در مهماني هاي پر سرو صدا گذرانده ام، و در اين لحضات بود كه كاراكتر هاي بسيار عالي به من الهام شدند. واقعيت اين است كه هيچ وقت شما نمي دانيد يك ايده خوب چه موقع به ذهنتان الهام خواهد شد، پس هميشه يك مداد را در جيب پشتتان يا پشت گوشتان قرار دهيد.
شما در Flash با هر ابزاري كه دوست داريد مي توانيد طراحي كنيد (كه قبلا در موردشان صحبت كردم). اگر شما يك نقاشي روي كاغذ داريد كه مي خواهيد به عنوان يك كاراكتر از آن در Flash استفاده كنيد، نياز به يك Scanner داريد تا آن را وارد كامپيوترتان كنيد. فايل هايي كه مي شود به آساني آن ها را وارد Flash كرد PNG، GIF، JPEG، TGA و TIFF مي باشند.
بعد از اينكه شما طراحي خود را وارد Flash كرديد (Import)، به اين فكر كنيد كه چگونه مي توانيد آن را به قطعه هاي جدا تقسيم كنيد. اين سخت ترين قسمت و پروسه اي ادراكي است كه در آخر بستگي به سبك انيميشن شما و كاراكتر شما دارد.
"تركيب از عمل كرد پيروي مي كند" اين حرفي است كه Volkswagen زده، و اين بسيار در طراحي كاراكتر شما مهم است، شما بايد تصور كنيد كاراكتر شما چگونه ممكن است حركت كند، اين موضوع در سرتاسر طراحي شما تاثير خواهد گذاشت.
تصوير 20 يك نمونه از طراحي اوليه و تصوير بازسازي شده توسط Flash را نشان مي دهد. اين كاراكتر تماما با ابزار هاي مستطيل و بيضي رسم شده است. ببينيد من چگونه از يك طرح اوليه به عنوان مرجع استفاده كرده ام. من با ابزارهاي Flash تغييرات ماهرانه اي روي تصوير به وجود آورده ام.

21.jpg
بعد از اينكه يك فريم كليدي خالي بعد از فريم طراحي تان ساختيد (F7)، Onion Skin را روشن كنيد تا يك تصوير روشن تر را ببينيد. مي توانيد از هر ابزار نقاشي در Flash‌ استفاده كنيد تا كاراكتر را با توجه نقاشي Onion Skin شده رسم كنيد. همان طور كه در تصوير 21 مي بينيد، من از ابزار بيضي براي رسم سر كاراكتر استفاده كرده ام. وقتي اعضاي مختلف بدن كاراكتر را رسم مي كنيد، سعي كنيد ابتدا تصور كنيد، و بعد كل شكل را رسم كنيد. شما بايد كاراكتر خود را به صورت 3 بعدي در فضا ببينيد. هر چند اين كار به صورت 2 بعدي است، ولي اگر مثل يك3 بعدي كار فكر كنيد، اين به شما كمك خواهد كرد كه بتوانيد تصور كنيد چه قسمت هايي ديگري قرار است اضافه شود كه قرار است به قسمت هاي ديگر بدن متصل شوند.

22.jpg

صرفه جويي در وقت:
من هميشه اشياء درون صفحه را تبديل به Symbol مي كنم و آنها را با نامهاي كوتاه و مفيد، قابل شناسايي مي كنم، مثلا Head1، Eye1، Mouth_Wide و ...، من در اين قسمت براي لايه هايم نام گزاري نمي كنم چون راه سريع تر و بهتري وجود دارد. بعد از اينكه تمام قسمت هاي كاراكتر تبديل به Symbol شدند و نام گزاري شدند، به سادگي همه آنها را انتخاب كنيد و (Ctrl+A) و سپس آنها را كپي كنيد (Ctrl+C) و يك لايه جديد بسازيد و آنها را در جاي خودشان قرار دهيد (Ctrl+Shift+V). اين كار آنها را در جاي خودشان قرار مي دهد. سپس تمام لايه هاي ديگرتان را پاك كنيد كه فقط يك لايه برايتان باقي بماند (لايه اي كه Symbol هاي كاراكتر را در آن كپي كرده بوديد).
اين قسمت عالي ترين بخش است، همه Symbol ها را انتخاب كنيد، روي آنها راست كليك كنيد و گزينه Distribute to Layers را انتخاب كنيد (تصوير 22).

23.jpg

صرفه جويي در وقت با مديريت خوب در سندتان:
تصوير 23 شكل Timeline را بعد از طراحي كاراكتر و پخش كردن Symbol ها در لايه ها نشان مي دهد كه آماده انيميشن شدن است. اگر مي خواهيد نام يك لايه را عوض كنيد روي آن دوبار كليك كنيد و نام جديد را وارد كنيد. وارد كردن نام خوب براي لايه ها بر اساس شيء اي كه در آن است، يك تمرين خوب براي مديريت خوب Timeline است، اين به خصوص وقتي مهم است كه با بيش از يك نفر همكاري داريد يا در محيط هاي گروهي كار مي كنيد.

24.jpg
از Flash 6 به بعد ما مي توانستيم براي لايه ها Folder‌ بسازيم، يك Folder فقط يك لايه است كه مي تواند لايه هاي ديگر را در خود نگه دارد و مي تواند باز يا بسته شود. اين وقتي مفيد است كه ما با لايه ها و كاراكتر هاي زيادي سروكار داريم. شما مي توانيد يك Folder براي هر كاراكتر بسازيد و تمام لايه هاي مربوط به هر كاراكتر را در Folder خودش قرار دهيد كه به شما اين امكان را مي دهد تمام Folder ها را ببنديد و تنها Folder اي را باز بگزاريد كه با آن سروكار داريد (تصوير 24). اين از حركت كردن هاي (Scrolling) خسته كننده و بي پايان جلوگيري و در وقت شما صرفه جويي مي كند.

25.jpg
راه ديگر براي مديريت فايل Flash خود داشتن يك كتابخانه (Library) مرتب است. همان طور كه قبلا گفتم وقتي شما چيزي را به Symbol تبديل مي كنيد، به صورت خود كار به كتابخانه اضافه مي شود. براي باز كردن كتابخانه گزينه Window > Library را انتخاب كنيد يا كليد هاي Ctrl+L را فشار دهيد. كتابخانه (تصوير 25) اطلاعات متنوع و گزينه هاي زيادي را در اختيار شما مي گزارد. مي توانيد روي هر Symbol‌ كليك كنيد و يك تصوير كوچك را در پنجره كتابخانه ببينيد.

26.jpg
اگر Symbol شما يك انيميشن باشد، دكمه هاي Stop‌ و Play در گوشه سمت راست بالاي پنجره كتابخانه ديده مي شود كه مي توانيد انيميشن را از اين طريق ببينيد. در بالاي پنجره يك دكمه است كه گزينه هاي متعددي دارد (تصوير 26). مي توانيد يك Symbol، Font، Folder‌ يا Video ي جديد بسازيد. همچنين مي توانيد يك Symbol را تغيير نام دهيد، Symbol ها را در Folder‌ قرار دهيد Symbol ها را تكثير، پاك يا خصوصيات آن را تغيير دهيد.

27.jpg


آشنايي با انيميشن 2.5 (دو و نيم) بعدي:
فقط به خاطر اينكه در Flash‌ مي توانيد به راحتي Tween (همان مابين سازي در فريم ها است) كنيد، اين بدين معني نيست كه بايد هميشه براي ساخت انيميشن هاي خوب به آن تكيه كنيد. منظور من اين است: Tween كردن روش خيلي خوبي است كه مي تواند كار را انجام داده و مي تواند در وقت صرفه جويي كند، ولي فقط موقعي از آن استفاده خواهيم كرد كه انيميشن مورد نظر در مورد يك شيء باشد كه مي خواهد از جايي به جاي ديگر حركت كند.
اما اگه بتوانيد از روش Tween كردن براي ساختن انيميشن هاي واقع گرا (رئاليسم) استفاده كنيم چه؟ اگر بتوانيد سادگي آن را مهار كنيد و از آن استفاده كنيد طوري كه خيلي از طراحان Flash حتي به آن فكر نكرده اند چطور؟ اگر همه چيز را درباره Tween‌ كردن مي دانيد، به 10% اول آن علم برگرديد و به سمت چپ برويد، در آنجا شما به كجا خواهيد رفت؟!
در اين درس، من مي خواهم يك تكنيك عالي را فاش كنم كه در واقع بعضي ها آن را افكت سه بعدي مي نامند. جالب اين است كه شما لازم نيست محيط Flash‌ را ترك كنيد و از يك برنامه ديگر استفاده كنيد، شما در محيط دو بعدي خواهيد ماند. الان شما در برزخ ابعادي هستيد! اگر دو بعدي است ولي ظاهر سه بعدي دارد، خب بالاخره چه شد؟
به دنياي انيميشن 2.5 بعدي خوش آمديد!
بله انيميشن 2.5 بعدي، من خودم اين نام را انتخاب كرده ام. من ادعا نمي كنم كه خودم اين روش را اختراع كرده ام ولي نام آن مال من است.
تصوير 27 شخصيت لوگوي سايت من يعني www.mudbubble.com را نشان مي دهد.

28.jpg
تصوير 28 نشان مي دهد كه من هر Symbol را در يك لايه قرار داده ام. من حالت Outline را روشن كرده ام تا ببينيد اعضاء بدن كاراكتر چگونه از هم جدا شده اند. اين خيلي مهم است زيرا درMotion Tween فقط مي شود در هر لايه يك Symbol داشت. اگر سعي مي كنيد دو Symbol‌ متفاوت در يك لايه استفاده كنيد، Tween كار نخواهد كرد.

29.jpg
من حتي وقت صرف كرده ام تا براي لايه ها نام بگزارم، هر چند اين كار ضروري نيست ولي وقتي لايه هاي شما زياد مي شود شما در نهايت مجبوريد در لايه ها بيشتر حركت كنيد (Scrolling). اين كار وقتي كه در محيط هاي گروهي كار مي كنيد و فايل ها به صورت اشتراكي استفاده مي شوند خيلي مفيد است.
وقتي كه Timeline شما مرتب شد، شما مي توانيد شروع به اعمال Motion Tween به كاراكترتان كنيد. براي اين مثال من فقط Symbol هايي را حركت داده ام كه سر كاراكتر را تشكيل مي دهند، به خاطر همين لايه هاي ديگر را قفل مي كنم تا به اشتباه آنها را تغيير ندهم.

چرخش سر (قسمت اول):
ابتدا من فريم هاي كليدي را براي جاهايي كه سر مي خواهد شروع به چرخش كند و متوقف شود مي سازم. به صورت عمودي از بالا تا پايين لايه ها ماوس را Drag كنيد (بكشيد) و دكمه F6 را فشار دهيد، اين كار را دوبار انجام دهيد و بين فريم ها 15 تا 20 فريم فاصله قرار دهيد، من در اين مثال فريم هاي كليدي را در فريم هاي 15 و 30 قرار دادم.

30.jpg
به فريمي برويد كه قرار است سر كاراكتر از چرخش متوقف شود، من هر Symbol را در صفحه با استفاده از ابزار Free Transform تغيير مي دهم.
كارهايي كه من انجام مي دهم شما نيز انجام دهيد. من با يكي از چشم ها شروع مي كنم. شما بايد تصور كنيد كه چشم ها به يك كره وصل شده اند (يعني همان سر)، طوري كه انگار سه بعدي است، يكي از چشم ها بايد وقتي به سمت شما نزديگ مي شود بزرگتر شود، همچنينن بايد از حالت تخم مرغي در آيد، پس اگر آن را باز تر كنيم بهتر به نظر مي آيد. چون چشم كاراكتر من از سه Symbol مختلف تشكيل شده، من هر سه آنها را با فشردن كليد Shift انتخاب (تصوير 30 را ببينيد) و بعد با ابزار Free Transform آنها را همزمان Scale (تنظيم) كردم. از اينكه زياد دقيق نمي توانيد اين كار را دقيق انجام دهيد نگران نباشيد، شما بعد هم مي توانيد انيميشن خود را به خوبي تغيير دهيد. اين كار تغريبا يك كار كور كورانه است و شما تا وقتي كه Motion Tween را به آن اعمال نكرده ايد نخواهيد فهميد انيميشن شما چه شكلي خواهد شد.

31.jpg
برويم سراغ بيني. چون كاراكتر به سمت ما دارد مي چرخد، پس هر چيزي كه به ما نزديك مي شود بايد از راست به چپ حركت كند، طوري كه انگار واقعا يك شيء سه بعدي است. بيني بايد صاف از سر بيرون زده باشد، اگر بخواهيم اين را واقعي تر جلوه دهيم، من در حالي كه بيني را به سمت راست به چپ بردم كمي نيز آن را به سمت پايين چرخاندم (تصوير 31 را ببينيد). فراموش نكنيد كه وقتي بيني به سمت بيننده حركت مي كند بايد كمي بزرگتر شود.

32.jpg
سپس من چشم بعدي را حركت دادم و آن را كمي از حالت بيضي بودن به دايره بودن تغيير دادم. من همچنين دو ابرو را نيز كمي حركت دادم و آنها را چرخاندم و همچنين كمي نيز آنها را بزرگتر كردم (تصوير 32 را ببينيد).
33.jpg
در اينجا من Motion Tween‌ را به لايه هايي كه تغيير داده بودم اعمال مي كنم. وقت اين رسيده كه بگويم در واقع چه كاري كرده ام و تصميم بگيرم كه چه تنظيماتي را نيز بايد اعمال كنم.
نگران نباشيد، هميشه بايد كش و قوص بسياري به كار خود دهيد تا به نتيجه خوب برسيد. تصوير 33 نتيجه آخر چرخش سر كاراكتر را نشان مي دهد.

34.jpg
فايل mudbubble_boy_head.swf را اجرا كنيد تا آخرين نتيجه انيميشن را ببينيد.
شروع بدي نبود، اينطور نيست؟ با چند تا تغيير كوچك با ابزار Free Transform، مي بينيد كه افكت هاي شما زنده مي شوند. اين كاملا عالي نيست ولي فعلا لازم هم نيست عالي باشد. شما مي توانيد به چرخاندن، تغيير جا دادن و كش و قوص دادن شكل ها آنقدر ادامه دهيد تا به نتيجه دلخواهتان برسيد.

چرخش سر (قسمت دوم):
چيز با ارزش ديگري مانده كه بايد به شما بگويم، اين نكته باعث ميشود سر كاراكتر را واقعي تر چرخش دهيم.
مهم ترين قسمت اين حيله، متقاعد كردن بيننده است كه اين شيء‌ دو بعدي، حجم و بعد دارد. شما همچنين بايد چشم بيننده را با عمق انيميشن گول بزنيد. شما بايد تصور كنيد كه اين كاراكتر از اشكال سه بعدي در فضا تشكيل شده است. اگر كاراكتر واقعا سر خود را در فضاي سه بعدي بچرخاند، چه چيزي در نماي جلو به سمت مخالف چيزي كه در پشت است حركت خواهد كرد. براي اين كه در اين مورد به شما كمك كنم، كره زمين را در حال چرخش روي محورش تصور كنيد، كره زمين در واقع در جهت عكس حركت عقربه هاي ساعت مي چرخد. اين يعني سطح نزديك به ما از سمت راست به چپ حركت مي كند و سطح دور به ما از سمت چپ به راست حركت مي كند. بگزاريد اين را روي سر كاراكتر خودم اعمال كنم.
چون سر كاراكتر فقط يك شكل بيضي مسطح است، تنها كاري كه بايد بكنم اين است كه آن را كمي اريب (Skew) كنم. همچنين من كمي هم آن را به سمت راست حركت دادم. من اين كار را به خاطر اين كردم كه وقتي كسي صورتش را به سمت شما مي چرخاند، شما بخش بيشتري از سمت راست چشم چپ صورت او را مي بينيد. همچنين چون اين قسمت سر جزو بخش هاي دور صورت به حساب مي آيد، بايد چند پيكسل به سمت راست حركت كند. بعضي از اين حركت ها را اغراق آميز نكنيد. بهتر است از حركت هاي ماهرانه استفاده كنيم تا حركت هاي شديد. اين اجزاء هستند كه كل انيميشن را تشكيل مي دهند چون چند انيميشن ماهرانه تمام يك نمايش را كامل مي كند.
سپس من لبه كلاه را به سمت راست سر كاراكتر مي چرخانم (تصوير 35 را ببينيد). به ياد داشته باشيد اجزاء دور كه در پشت قرار دارند در جهت مخالف اجزاء نزديك حركت مي كنند.

35.jpg
من همچنين با كليدهاي جهت، كمي لبه كلاه را به سمت راست حركت دادم تا لبه كلاه بيشتر در پشت گردن كاراكتر به نظر آيد.
همين قانون بايد به خود كلاه نيز اعمال شود. من كلاه را كمي كج كردم تا نازك تر شود و آن را نيز كمي به سمت راست حركت دادم (تصوير 36 را ببينيد).

36.jpg
گوش نيز بايد كمي به سمت بالا كج شود و كمي هم به سمت چپ حركت كند (تصوير 37 را بينيد).
37.jpg
موها را فراموش نكنيد. من موها را از سه Symbol جدا به وجود آورده ام، بنابراين مي شود آنها را به صورت مستقل از هم حركت داد. در حالي كه سر به سمت بيننده حركت مي كند، من موها را به سمت چشم هاي كاراكتر كج (Skew) كردم و كمي نيز آنها را كوتاه كردم كه انگار نوك مو به سمت بيننده حركت مي كند (تصوير 37 را ببينيد). اين كار در واقع فريب دادن پرسپكتيو است، هر چند كار سختي است. شما در كج كردن و چرخاندن اجزاء محدود هستيد. به ياد داشته باشيد كه وقتي كه به صورت ماهرانه عمل كنيم، همين كار كافي و بهتر است.
38.jpg
سپس من به بقيه لايه هايي كه تغييرات در آنها انجام داده بودم، Motion Tween را اعمال كردم. اگر شما تا الان به كارهايي كه گفته بودم عمل كرده باشيد، انيميشن خود را نمايش دهيد.
زياد بد نشده، اينطور نيست؟ مي بينيد كه سر كاراكتر مانند يك شيء سه بعدي مي چرخد. به ياد داشته باشيد كه بيشتر كاراكتر ها اگر انسان باشند دو گوش دارند. براي اين كه گوش دوم كاراكتر از سمت راست سر او ظاهر شود، يك لايه زير تمام لايه هايي كه داريد بسازيد، گوش فعلي را كپي كنيد و در يك فريم كليدي خالي در بين Motion Tween يعني تغريبا در فريم 22ي اين لايه بچسبانيد. سپس گزينه Modify > Transform > Flip Horizontal را انتخاب كنيد تا آن را سرو ته كنيد.
گوش را در سمت چپ و پشت سر قرار دهيد كه تقريبا نصف آن بيرون بزند، اين تقريبا همان قدري است كه بايد ببينيد (تصوير 38 را ببينيد).
39.jpg
يك فريم كليدي ديگر هم فريم 30 قرار دهيد (جايي كه همه فريم هاي كليدي در آن قرار دارند) همان طور كه در شكل 39 نشان داده شده.
40.jpg
به اولين فريم كليدي گوش دوم برويد و گوش را كاملا در پشت سر قرار دهيد. من بعضي از لايه هاي ديگر را به Outline تغيير داده ام تا بتوانيد جاي جديد گوش را ببينيد، شما نيز همين كار را انجام دهد (تصوير 40 را ببينيد).
41.jpg
حالا يك Motion Tween به آن اضافه كنيد و انيميشن خود را اجرا كنيد، مي بينيد كه گوش پشتي در موقع چرخش سر خودش را نمايان مي كند (فايل mudbubble_boy_flash8.fla را ببينيد). اين جزء كوچك تاثير بزرگي در واقعي بودن سر دارد و كمك مي كند تا بيننده را فريب دهيم كه سر يك كره سه بعدي است.
در فريم هاي خود حركت كنيد و ببينيد چيزي غير عادي است يا نه، اگر اينطور بود سعي كنيد آن را آنقدر تغيير دهيد تا درست شود. اين بستگي به اين دارد كه شما چقدر در پيچيدگي كاراكترتان كامل هستيد. كاراكتري كه در اين مثال به آن پرداخته ايم تغريبا پيچيده است و اشكال آن نيز همينطور.
پانل Ease In/Ease Out (فقط در Flash 8 یا بالاتر):
من مي خواهم يك تغيير ديگر نيز به انيميشن چرخش سر اضافه كنم. همان طور كه مي دانيد Motion Tween كاملا ساكن به نظر مي آيد چون داراي نرخ سرعت فريم ثابتي هست و در شروع حالت خشكي دارد. يكي از خصوصيات جديد Flash Professional 8 اين است كه مي توانيد به Motion Tween خود Ease In و Ease Out اضافه كنيد تا حركت انيميشن نرم تر شود.
Ease In: باعث مي شود انيميشن در ابتدا به آرامي شروع شود.
Ease Out: باعث مي شود انيميشن در انتها به آرامي تمام شود.
اين نكته به چگونگي اضافه كردن Ease In و Ease Out مي پردازد.
اولين قدم اضافه كردن Motion Tween است، شما مي توانيد اين كار را بدين دو طريق انجام دهيد:
·[FONT=&quot] [/FONT] بين دو فريم كليدي راست كليك كنيد و از منوي باز شده گزينه Create Motion Tween را انتخاب كنيد.
·[FONT=&quot] [/FONT] تمام لايه ها را با ابزار انتخاب، انتخاب كنيد براي اين كار كليك كنيد و بكشيد (Drag)، در قسمت Property Inspector از منوي Tween‌ گزينه Motion را انتخاب كنيد.
به دكمه Edit در قسمت Properties توجه كنيد (تصوير 41 را ببينيد).
42.jpg
با كليك روي اين دكمه پنجره Custom Ease In/Ease Out باز مي شود (تصوير 42 را ببينيد).
43.jpg
با پانل جديد Ease In/Ease Out شما مي توانيد كنترل بيشتري روي Easing نسبت به نسخه هاي قبلي Flash داشته باشيد. پانل Ease In/Ease Out نموداري است كه درجه حركت نسبت به زمان را نشان مي دهد. محور افقي فريم ها را نمايش مي دهد در حالي كه محور عمودي درصد تغييرات روي شيء را نمايش مي دهد.
منحني نمودار، سرعت تغييرات شيء را تعريف مي كند. وقتي منحني افقي است (بدون شيب)، سرعت صفر است و وقتي منحني عمودي است شما هيچ Easing يا تاخير روي حركت شيء تان نداريد.
وقتي شما گزينه Use One Setting for All Properties را انتخاب كنيد، منحني فعلي روي تمام خصوصيات اعمال مي شود (موقعيت، چرخش، درجه، رنگ و فيلتر ها) اگر اين گزينه را انتخاب نكنيد مي توانيد منحني جداگانه به هر يك از خصوصيت اعمال كنيد، به شرح زير:
·[FONT=&quot] [/FONT] Position يا موقعيت: تنظيمات Ease را براي موقعيت يك شيء متحرك در صفحه تعيين مي كند.
·[FONT=&quot] [/FONT] چرخش يا Rotation: تنظيمات Ease را براي چرخش يك شيء متحرك در صفحه تعيين مي كند. براي مثال شما به خوبي مي توانيد تنظيم كنيد كه چقدر سريع يا كند سر يك كاراكتر در صفحه بايد بچرخد تا با بيننده روبرو شود.
·[FONT=&quot] [/FONT] درجه يا Scale: تنظيمات Ease را براي درجه يك شيء متحرك در صفحه تعيين مي كند. براي مثال شما آسانتر مي توانيد درجه يك شيء را تغيير دهيد، بنابراين به نظر ميرسد كه شيء از بيننده دور مي شود و دوباره نزديك مي شود و دوباره دور مي شود.
·[FONT=&quot] [/FONT] رنگ يا Color: تنظيمات Ease را براي تحول رنگ يك شيء در صفحه تعيين مي كند.
·[FONT=&quot] [/FONT] دكمه هاي Play و Stop: تنظيمات Ease را براي فيلترهايي كه به يك شيء متحرك در صفحه اعمال شده اند، تعيين مي كند. براي مثال مي توانيد تنظيمات Ease را براي سايه اي كه در جهت تغيير مسير منبع نور تغيير مكان مي دهد كنترل كنيد.
·[FONT=&quot] [/FONT] دكمه Reset: به شما اين امكان را مي دهد كه سرعت منحني را به به حالت اوليه يعني به حالت خطي برگردانيد.
روي خط مورب كليك كنيد تا يك نقطه كنترل (Control Point) به آن اظافه شود، شما به دقت مي توانيد حالت حركت يك شيء را با تغيير مكان دادن اين نقاط كنترل كنيد.
با استفاده از شاخص هاي فريم (كه با دستگيره هاي مربع شكل نمايش داده شده اند)، جايي كه شيء قرار است Ease In‌ يا Ease Out كند كليك كنيد (تا شتاب بگيرد يا از شتابش كاسته شود). با كليك كردن روي دستگيره هاي نقاط كنترل (دسته هاي مربع)، آن انتخاب شده و نقطه هاي مماسي در طرفين آن ديده مي شود (دايره هاي توخالي)، شما با ماوس يا كيبرد مي توانيد به راحتي اين نفاط را به جاهاي جديد منتقل كنيد.
نكته: در حالت عادي نقاط كنترل به خطوط عمودي و افقي قفل مي شود (Snap to Grid)، شما مي توانيد موقتا آن را با نگه داشتن كليد X در حين كشيدن نقاط، خاموش كنيد.
كليك كردن روي منحني در جايي كه هيچ نقطه كنترلي نيست يك نقطه كنترل جديد را در روي منحني به وجود مي آورد، كليك كردن در يك جاي خالي دور از منحني، نقطه كنترلي كه در حال انتخاب بود را از حالت انتخاب در مي آورد.
براي اين كه يك انيميشن را طوري بسازيم كه به آرامي شروع شود و به آرامي نيز تمام شود، منحني را مانند شكل 43 تغيير دهيد. من پيشنهاد مي كنم ساختن و ويرايش نقاط كنترل و خطوط مماس را تجربه كنيد و انيميشن خود را با دكمه هاي Play و Stop موجود در گوشه پايين پانل امتحان كنيد. زياد طول نخواهد كشيد كه شما حس خوبي نسبت به ارتباط منحني و تاثير آن روي انيميشنتان خواهيد داشت.
44.jpg
حالا انيمشن خود را اجرا كنيد، توجه كنيد چگونه حركت چرخش سر كاراكتر به نرمي شروع مي شود و به نرمي به پايان مي رسد. براي اين كه دوباره سر را به جاي اولش برگردانيم، شما فقط كافي است فريم هاي 1 را كپي كنيد و بعد از Tween ي كه ساخته ايد بچسبانيد. همين رويه را با اضافه كردن Motion Tween تكرار كنيد، و براي Ease In‌ و Ease Out شما كاراكتري داريد كه سرش را به خوبي به جاي اول بر مي گرداند.

اعمال فيلتر ها:
بله، از اين به بعد اين كار غير ممكن در Flash‌ ممكن شد. Flash 8‌ يك سري فيلتر هاي گرافيكي و حالت هاي تركيبي ارائه مي دهد كه طراحان Flash از آن به خوبي استقبال كرده اند. از حالا به بعد شما مي توانيد فيلتر هايي مانند سايه، Blur يا محو كننده، Glow يا تابش، Bevel يا برجسته كننده، Gradient Glow، Gradient Bevel و Adjust Color يا تنظيم رنگ را اضافه كنيد. بياييد به كاراكترمان سايه اضافه كنيم.
اولين كاري كه بايد كنيم اين است كه انيميشن كاراكترمان را در يك Movie Clip قرار دهيم، براي اين كار تمام فريم ها و لايه هايتان را انتخاب كنيد، بايد از اولين فريم در بالاترين لايه انتخاب و به صورت مورب ماوس را به آخرين فريم در پايين ترين فريم بكشيد. با اين كار تمام لايه ها و فريم ها به صورت مشكي انتخاب مي شوند. گزينه Edit > Timeline > Copy Frames را انتخاب كنيد يا دكمه هاي Ctrl+Alt+C را همزمان فشار دهيد تا تمام لايه ها كپي شوند، شما همچنين مي توانيد روي فريم هاي انتخاب شده راست كليك كنيد و گزينه Copy Frames را انتخاب كنيد. خب فعلا اين كارهايي كه كرديم را به خاطر بسپاريد.
كتابخانه خود را باز كنيد (Ctrl+L) و روي دكمه گوشه سمت راست بالاي پنجره كليك كنيد و گزينه New Symbol را انتخاب كنيد و Behavior آن را Movie Clip‌ انتخاب كرده و روي OK كليك كنيد. شما حالا در حالت ويرايش اين Symbol‌ هستيد. اولين فريم را انتخاب كنيد و گزينه Edit > Timeline > Paste Frames را انتخاب كنيد يا دكمه هاي Ctrl+Alt+V را فشار دهيد تا فريم هاي انتخاب كرده تان به لايه جديد منتقل شوند همان طور كه در تصوير 44 نمايش داده شده است. شما همچنينن مي توانيد روي فريم 1 راست كليك كرده و گزينه Paste Frame را از منوي باز شده انتخاب كنيد.
45.jpg
به صحنه اصلي برگرديد و يك لايه جديد بسازيد، Movie Clip‌ ي كه همين الان آن را ساخته بوديم را در صفحه قرار دهيد، براي اين كار از پنجره كتابخانه آن را به درون اين لايه جديد بكشيد.
46.jpg
تمام لايه هاي ديگرتان را پاك كنيد كه شامل فريم هاي كاراكترتان بود. در حال حاضر Timeline شما بايد داراي يك فريم و يك لايه باشد كه شامل Symbol انيميشن تان است.
شما دو جور مي توانيد سايه بسازيد، يك سايه استاندارد كه در زير نمونه قرار مي گيرد و كمي با آن فاصله دارد، اين افكت بسيار ساده و صاف جلوه مي كند و به نظر مي رسد سايه روي ديوار يا يك صطح صاف افتاده است و وقتي مي خواهيم سايه اي داشته باشيم كه روي زمين افتاده اين نوع سايه ما را راضي نخواهد كرد. براي دست يابي به يك سايه قانع كننده شما بايد چند مرحله كار انجام دهيد.
نمونه Movie Clip را دو تا كنيد (از آن يك كپي بسازيد) و كپي آن را در پشت نمونه اصلي قرار دهيد، براي اين كار مي توانيد آن را در يك لايه جداگانه در زير نمونه اصلي قرار دهيد.
نمونه زيري را انتخاب كنيد و به سربرگ Filter‌ در قسمت Property Inspector برويد. از منوي +، Drop Shadow را انتخاب كنيد. سپس Strength را به 45% تغيير دهيد و Hide Object را تيك بزنيد، با اين كار تصوير Movie Clip نامرئي شده و فقط سايه آن ديده مي شود. شما مي توانيد ديگر خصوصيات آن را به دلخواه تغيير دهيد، از جمله Quality و ...
47.jpg
براي اين كه سايه را از حالت صاف بودن و روي ديوار بودن در بياوريم از ابزار Free Transform استفاده كنيد تا نمونه سايه شده را كج كنيد، قبل از اين كه شما اين كار را به درستي انجام دهيد بايد چند بار امتحان كنيد و ممكن است چند بار اشتباه كنيد. سايه را فشرده و آن را كج كنيد تا شكلي شبيه به سايه اي به خود بگيرد كه روي زمين افتاده (تصوير 47 را ببينيد). ممكن است لازم باشد آن را جابجا كنيد تا واقعي بنظر بيايد.
48.jpg
فيلم خود را امتحان كنيد و ببينيد كه چقدر واقعي به نظر ميرسد.
وقتي يك انيميشن حلقه اي (انيميشني كه دائم تكرار مي شود) را با يك انيميشن حلقه اي ديگر تركيب كنيد، شما به يك نتيجه بهتر و ماهرانه تري خواهيد رسيد.
انيميشن mudbubble_boy_dog_flash8.fla يك نمونه از اين نوع تركيب را نشان مي دهد. در اين نمونه مي بينيد كه سايه چقدر در سه بعدي بودن انيميشن كمك مي كند. اين انيميشن يك سري از Movie Clip است كه شامل انيميشن هاي حلقه اي سگ و پسر مي باشد. من در مقاله بعدي توضيح خواهم داد چگونه يك انيميشن كوتاه حلقه اي مي تواند مدت زيادي به فيلم هاي شما اضافه كند.
اميدوارم اين مقاله مهارت شما را در طراحي و انيميشن سازي در Flash ارتقاء داده باشد. تكنيك هاي ديگري نيز در رابطه با انيميشن سازي در Flash وجود دارد كه مي توانيد به آنها دست يابيد، مانند انيميشن كامل يا Full Animation كه منظور همان انيميشن فريم به فريم مي باشد، Shape Tween، و سكانس هاي تصويري از يك ويدئو يا يك برنامه انيميشن سه بعدي. همچنين تعدادي Plug-In‌ هاي عالي از طراحان و انيماتور هاي ديگر وجود دارد كه مي تواند در روند كار به شما سرعت بخشد. منتظر مقالات بعدي باشيد كه تكنيك ها و ابزار هاي اين مقاله در آنها استفاده شده.


منبع: http://cgacademy.ir/tutorials/character_animation_in_flash
 

جدیدترین ارسال ها

بالا