آموزش Character Animation in Flash

خیلی از انیماتور ها از نرم افزار Macromedia Flash برای دست یابی به انیمیشن های برداری با جزئیات بیشتر استفاده می کنند. یکی از قدرت های برنامه Flash سلیس بودن آن در فرایند تولید است. من یک سری تکنیک های شخصی ابداع کرده ام که می تواند به شما کمک کند اجزاء مختلف یک انیمیشن پیچیده را مدیریت کنید و بسازید. در این مقاله، من چند تا از بهترین اسرار ساخت انیمیشن خودم را فاش کرده ام که ما را از یک اسکیس (طراحی سریع) ساده کاراکتر به یک انیمیشن کامل Flash می رساند.

شما برای انجام مراحل این مقاله نیاز به برنامه Macromedia Flash Professional 8 و فایل نمونه mudbubble_boy.zip هستید. این مقاله برای افراد مبتدی تهیه شده، بنا براین تمام افرادی که تجربه کار با Flash را دارند می توانند این مقاله را مطالعه کنند.

در باره نویسنده:


Chris Georgenes
هنرمند و انیماتوری است که بدون وابستگی به هیچ حزبی، تمام وقت در حال فعالیت برای سایت ها، CD ها و برنامه های تلویزیونی است. او برای شرکت های زیر فعالیت داشته:

Pileated Pictures

LucasArts

Universal Records

Plot Developers

AOL 

 

 عنوان آموزش : Character Animation in Flash
نام تهیه کننده : امیر پروای بی شکمبحث آموزش : Animation نرم افزارها : Flashتالیف |
رتبه بندی مولف | مترجم :
ترجمه | ترجمه و تالیف

 

نقاشی در Flash:

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

ابزار Brush یا قلم مو:

ابزار Brush که در عکس زیر می بینید، تقریبا روان ترین ابزار است، مخصوصا وقتی که با حساسیت فشار قلم ترکیب شود.

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

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

ابزار Brush‌ دارای گزینه های متعددی است که باعث می شوند افکت های ویژه ای به وجود آورید (در تصویر 4 نشان داده شده).

· حالت عادی (Normal): روی خط ها (Line) و رنگهای (Fill) لایه جاری را پر می کند.

· حالت پر کردن رنگها (Paint Fills): درون یک رنگ را پر می کند و بیرون آن را نیز رنگ می کند، یعنی با خطوط کاری ندارد.

· حالت رنگ کردن پشت (Paint Behind): پشت خطوط و رنگها را پر می کند.

· حالت رنگ کردن نواحی انتخاب شده (Paint Selection): به شما این امکان را می دهد که فقط نواحی انتخاب شده را رنگ کند.

· حالت رنگ کردن درون (Paint Inside): وقتی که شروع به نقاشی کردن درون یک رنگ کنید شما را از خارج شدن از خطوط محافظت می دارد.

رسم اشکال:

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

همان طور که در تصویر 6 می بینید، رسم یک شکل روی یک شکل دیگری که قبلا وجود داشت باعث می شود یک قسمت از شکل زیرین برش بخورد. به این نوع نقاشی نوع ترکیبی یا Merge می گویند. این نوع نقاشی موقعی مفید است که بخواهیم با برش دادن قسمت هایی از یک شکل، یک شکل جدید به وجود بیاوریم.

وقتی شما یک شکل را با استفاده از گزینه Object Drawing رسم می کنید، اشکال در یکدیگر اختلال ایجاد نمی کنند و همدیگر را برش نمی دهند. شما می توانید اشکال را روی هم رسم کنید بدون این که آنها با یکدیگر ترکیب شوند (تصویر 7). این گزینه موقعی مفید است که بخواهید اشکال را بعدا جابجا کنید یا فقط بخواهید آنها مجزا از هم بمانند.

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

ابزار مداد:

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

خطی که با ابزار مداد رسم شده دارای نقاط برداری کمتری است،‌ یک خط کاملا راست فقط دو نقطه برداری دارد، یکی در ابتدای خط و دیگری در انتهای آن. یک خط کج با توجه به تعداد موج آن دارای 3 نقطه یا بیشتر است (تصویر 10).

ابزار مداد نیز دارای چندین حالت می باشد (تصویر 11):

· Straighten‌ یا صاف: این یک گزینه عالی برای رسم خطوط بسیار صاف است که با دست رسم می شوند. حتی با یک دست لرزان هم می توانید خطوط بسیار صافی رسم کنید.

· Smooth‌ یا نرم: اگر از این گزینه استفاده کنید، خطوط شما نرم خواهند شد، در حالی که شکل اصلی که شما می خواستید خلق کنید از بین نرفته است.

· Ink یا جوهر: این گزینه هیچ اثری روی خطوطی که رسم کردید نمی گذارد.

ابزارهای رسم اشکال:

ابزارهای رسم اشکال، بیضی و مستطیل، اشکال و خطوط اولیه را به وجود می آورند (تصویر 12 را نگاه کنید). نگه داشتن Shift‌ در هنگام رسم این اشکال، مربع و دایره کامل حاصل می شود.

شما می توانید رنگ خطوط و رنگ درون اشکال را در قسمت Property Inspector تعریف کنید (تصویر 13 را ببینید). روی مربع رنگی کلیک کنید تا پالت رنگ باز شده و رنگ مورد نظر خود را برای درون و خطوط شکل خود انتخاب کنید.

شما همچنان می توانید با انتخاب مربعی که یک خط مورب درون آن است، رنگ درون یا خط شکل مورد نظر را بی رنگ انتخاب کنید.

ابزار Pen یا خودکار:
برای رسم مسیرهای دقیق، خطوط مستقیم و منحنی های نرم می توانید از این ابزار استفاده کنید (تصویر 15 را ببینید). با این ابزار می توانید خطوط مستقیم و منحنی را با تعریف زاویه، بلندای خطوط مستقیم و شیب خطوط منحنی، رسم کنید.

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

ابزار پوست پیاز (Onion Skin Tool):

ابزار Onion Skin در زیر پنل TimeLine قرار دارد.

وقتی شما ابزار Onion Skin را انتخاب می کنید، نرم افزار دو علامت در بالای TimeLine به وجود می آورد (تصویر 17 را نگاه کنید). شما می توانید این علامت ها را بکشید تا تعداد فریم های بعد و قبل فریم فعلی را گسترش دهید.

Flash دو نوع این ابزار را ارائه می دهد:
· عادی یا Normal Onion Skin: فریم جاری با رنگ کامل نمایش داده می شود در حالی که فریم های قبلی و بعدی به مرور کم رنگ شده اند، این همان اثر کاغذ های نیمه شفاف را می دهد که روی آنها مجموعه ای از نقاشی ها رسم شده اند و کاغذها روی هم انباشته می شوند (تصویر 18 را نگاه کنید).
· حالت خطوط خارجی یا Onion Skinning on Outline Mode: فریم جاری با رنگ کامل نمایش داده می شود در حالی که فریم های قبلی و بعدی به صورت خطوط خارجی نمایش داده می شوند (تصویر 18 را نگاه کنید). وقتی که با فریم های کلیدی بعد و قبل متعددی سروکار داریم این حالت برای چشم ها راحت تر است.

کار سمبل ها:
سمبل ها یا 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).

در پنجره Convert to Symbol می توانید یک نام برای Symbol خود تایپ کنید، یکی از سه Behavior‌ (رفتار) را انتخاب کنید و در انتها یکی از نقاط Registration‌ را انتخاب کنید. در زیر توضیحات هر رفتار و معنی آنها شرح داده شده:

· Movie Clip- Movie Clip ها پویا یا Dynamic هستند، این بدین معنی است که می شود آنها را توسط Action Script (زبان برنامه نویسی Flash) مورد هدف قرار داد (Target). می توان در آنها به تعداد دلخواه لایه و فریم داشت، ولی Timeline آنها کاملا با Symbol‌ های دیگر مستقل است. به منظومه شمسی فکر کنید: هر سیاره یک Movie Clip است و دائما و به صورت مستقل به دور خورشید که Timeline اصلی شما است در حرکت هستند.
· Button- دکمه ها دارای 4 حالت هستند: Over، Up، Down و Hit. اینها به صورت فریم در Timeline این Symbol نمایش داده می شوند. شما می توانید هر عکس گرافیکی را در این فریم ها قرار دهید، ActionScript به نمونه تان اعمال کنید و آن را در فیلم Flash خود قرار دهید.
· 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 تغییرات ماهرانه ای روی تصویر به وجود آورده ام.

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

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

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

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

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

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

آشنایی با انیمیشن 2.5 (دو و نیم) بعدی:

فقط به خاطر اینکه در Flash‌ می توانید به راحتی Tween (همان مابین سازی در فریم ها است) کنید، این بدین معنی نیست که باید همیشه برای ساخت انیمیشن های خوب به آن تکیه کنید. منظور من این است: Tween کردن روش خیلی خوبی است که می تواند کار را انجام داده و می تواند در وقت صرفه جویی کند، ولی فقط موقعی از آن استفاده خواهیم کرد که انیمیشن مورد نظر در مورد یک شیء باشد که می خواهد از جایی به جای دیگر حرکت کند.

اما اگه بتوانید از روش Tween کردن برای ساختن انیمیشن های واقع گرا (رئالیسم) استفاده کنیم چه؟ اگر بتوانید سادگی آن را مهار کنید و از آن استفاده کنید طوری که خیلی از طراحان Flash حتی به آن فکر نکرده اند چطور؟ اگر همه چیز را درباره Tween‌ کردن می دانید، به 10% اول آن علم برگردید و به سمت چپ بروید، در آنجا شما به کجا خواهید رفت؟!
در این درس، من می خواهم یک تکنیک عالی را فاش کنم که در واقع بعضی ها آن را افکت سه بعدی می نامند. جالب این است که شما لازم نیست محیط Flash‌ را ترک کنید و از یک برنامه دیگر استفاده کنید، شما در محیط دو بعدی خواهید ماند. الان شما در برزخ ابعادی هستید! اگر دو بعدی است ولی ظاهر سه بعدی دارد، خب بالاخره چه شد؟
به دنیای انیمیشن 2.5 بعدی خوش آمدید!
بله انیمیشن 2.5 بعدی، من خودم این نام را انتخاب کرده ام. من ادعا نمی کنم که خودم این روش را اختراع کرده ام ولی نام آن مال من است.
تصویر 27 شخصیت لوگوی سایت من یعنی [فقط کاربران ثبت نام شده می توانند لینک ها را مشاهده کنند . برای ثبت نام کلیک کنید...] را نشان می دهد.

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

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

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

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

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

سپس من چشم بعدی را حرکت دادم و آن را کمی از حالت بیضی بودن به دایره بودن تغییر دادم. من همچنین دو ابرو را نیز کمی حرکت دادم و آنها را چرخاندم و همچنین کمی نیز آنها را بزرگتر کردم (تصویر 32 را ببینید).

در اینجا من Motion Tween‌ را به لایه هایی که تغییر داده بودم اعمال می کنم. وقت این رسیده که بگویم در واقع چه کاری کرده ام و تصمیم بگیرم که چه تنظیماتی را نیز باید اعمال کنم.
نگران نباشید، همیشه باید کش و قوص بسیاری به کار خود دهید تا به نتیجه خوب برسید. تصویر 33 نتیجه آخر چرخش سر کاراکتر را نشان می دهد.

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

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

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

موها را فراموش نکنید. من موها را از سه Symbol جدا به وجود آورده ام، بنابراین می شود آنها را به صورت مستقل از هم حرکت داد. در حالی که سر به سمت بیننده حرکت می کند، من موها را به سمت چشم های کاراکتر کج (Skew) کردم و کمی نیز آنها را کوتاه کردم که انگار نوک مو به سمت بیننده حرکت می کند (تصویر 37 را ببینید). این کار در واقع فریب دادن پرسپکتیو است، هر چند کار سختی است. شما در کج کردن و چرخاندن اجزاء محدود هستید. به یاد داشته باشید که وقتی که به صورت ماهرانه عمل کنیم، همین کار کافی و بهتر است.

سپس من به بقیه لایه هایی که تغییرات در آنها انجام داده بودم، Motion Tween را اعمال کردم. اگر شما تا الان به کارهایی که گفته بودم عمل کرده باشید، انیمیشن خود را نمایش دهید.
زیاد بد نشده، اینطور نیست؟ می بینید که سر کاراکتر مانند یک شیء سه بعدی می چرخد. به یاد داشته باشید که بیشتر کاراکتر ها اگر انسان باشند دو گوش دارند. برای این که گوش دوم کاراکتر از سمت راست سر او ظاهر شود، یک لایه زیر تمام لایه هایی که دارید بسازید، گوش فعلی را کپی کنید و در یک فریم کلیدی خالی در بین Motion Tween یعنی تغریبا در فریم 22ی این لایه بچسبانید. سپس گزینه Modify > Transform > Flip Horizontal را انتخاب کنید تا آن را سرو ته کنید.
گوش را در سمت چپ و پشت سر قرار دهید که تقریبا نصف آن بیرون بزند، این تقریبا همان قدری است که باید ببینید (تصویر 38 را ببینید).

یک فریم کلیدی دیگر هم فریم 30 قرار دهید (جایی که همه فریم های کلیدی در آن قرار دارند) همان طور که در شکل 39 نشان داده شده.

به اولین فریم کلیدی گوش دوم بروید و گوش را کاملا در پشت سر قرار دهید. من بعضی از لایه های دیگر را به Outline تغییر داده ام تا بتوانید جای جدید گوش را ببینید، شما نیز همین کار را انجام دهد (تصویر 40 را ببینید).

حالا یک 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 است، شما می توانید این کار را بدین دو طریق انجام دهید:
· بین دو فریم کلیدی راست کلیک کنید و از منوی باز شده گزینه Create Motion Tween را انتخاب کنید.
· تمام لایه ها را با ابزار انتخاب، انتخاب کنید برای این کار کلیک کنید و بکشید (Drag)، در قسمت Property Inspector از منوی Tween‌ گزینه Motion را انتخاب کنید.
به دکمه Edit در قسمت Properties توجه کنید (تصویر 41 را ببینید).

با کلیک روی این دکمه پنجره Custom Ease In/Ease Out باز می شود (تصویر 42 را ببینید).

با پانل جدید Ease In/Ease Out شما می توانید کنترل بیشتری روی Easing نسبت به نسخه های قبلی Flash داشته باشید. پانل Ease In/Ease Out نموداری است که درجه حرکت نسبت به زمان را نشان می دهد. محور افقی فریم ها را نمایش می دهد در حالی که محور عمودی درصد تغییرات روی شیء را نمایش می دهد.
منحنی نمودار، سرعت تغییرات شیء را تعریف می کند. وقتی منحنی افقی است (بدون شیب)، سرعت صفر است و وقتی منحنی عمودی است شما هیچ Easing یا تاخیر روی حرکت شیء تان ندارید.
وقتی شما گزینه Use One Setting for All Properties را انتخاب کنید، منحنی فعلی روی تمام خصوصیات اعمال می شود (موقعیت، چرخش، درجه، رنگ و فیلتر ها) اگر این گزینه را انتخاب نکنید می توانید منحنی جداگانه به هر یک از خصوصیت اعمال کنید، به شرح زیر:
· Position یا موقعیت: تنظیمات Ease را برای موقعیت یک شیء متحرک در صفحه تعیین می کند.
· چرخش یا Rotation: تنظیمات Ease را برای چرخش یک شیء متحرک در صفحه تعیین می کند. برای مثال شما به خوبی می توانید تنظیم کنید که چقدر سریع یا کند سر یک کاراکتر در صفحه باید بچرخد تا با بیننده روبرو شود.
· درجه یا Scale: تنظیمات Ease را برای درجه یک شیء متحرک در صفحه تعیین می کند. برای مثال شما آسانتر می توانید درجه یک شیء را تغییر دهید، بنابراین به نظر میرسد که شیء از بیننده دور می شود و دوباره نزدیک می شود و دوباره دور می شود.
· رنگ یا Color: تنظیمات Ease را برای تحول رنگ یک شیء در صفحه تعیین می کند.
· دکمه های Play و Stop: تنظیمات Ease را برای فیلترهایی که به یک شیء متحرک در صفحه اعمال شده اند، تعیین می کند. برای مثال می توانید تنظیمات Ease را برای سایه ای که در جهت تغییر مسیر منبع نور تغییر مکان می دهد کنترل کنید.
· دکمه Reset: به شما این امکان را می دهد که سرعت منحنی را به به حالت اولیه یعنی به حالت خطی برگردانید.
روی خط مورب کلیک کنید تا یک نقطه کنترل (Control Point) به آن اظافه شود، شما به دقت می توانید حالت حرکت یک شیء را با تغییر مکان دادن این نقاط کنترل کنید.
با استفاده از شاخص های فریم (که با دستگیره های مربع شکل نمایش داده شده اند)، جایی که شیء قرار است Ease In‌ یا Ease Out کند کلیک کنید (تا شتاب بگیرد یا از شتابش کاسته شود). با کلیک کردن روی دستگیره های نقاط کنترل (دسته های مربع)، آن انتخاب شده و نقطه های مماسی در طرفین آن دیده می شود (دایره های توخالی)، شما با ماوس یا کیبرد می توانید به راحتی این نفاط را به جاهای جدید منتقل کنید.
نکته: در حالت عادی نقاط کنترل به خطوط عمودی و افقی قفل می شود (Snap to Grid)، شما می توانید موقتا آن را با نگه داشتن کلید X در حین کشیدن نقاط، خاموش کنید.
کلیک کردن روی منحنی در جایی که هیچ نقطه کنترلی نیست یک نقطه کنترل جدید را در روی منحنی به وجود می آورد، کلیک کردن در یک جای خالی دور از منحنی، نقطه کنترلی که در حال انتخاب بود را از حالت انتخاب در می آورد.
برای این که یک انیمیشن را طوری بسازیم که به آرامی شروع شود و به آرامی نیز تمام شود، منحنی را مانند شکل 43 تغییر دهید. من پیشنهاد می کنم ساختن و ویرایش نقاط کنترل و خطوط مماس را تجربه کنید و انیمیشن خود را با دکمه های Play و Stop موجود در گوشه پایین پانل امتحان کنید. زیاد طول نخواهد کشید که شما حس خوبی نسبت به ارتباط منحنی و تاثیر آن روی انیمیشنتان خواهید داشت.

حالا انیمشن خود را اجرا کنید، توجه کنید چگونه حرکت چرخش سر کاراکتر به نرمی شروع می شود و به نرمی به پایان می رسد. برای این که دوباره سر را به جای اولش برگردانیم، شما فقط کافی است فریم های 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 را از منوی باز شده انتخاب کنید.

به صحنه اصلی برگردید و یک لایه جدید بسازید، Movie Clip‌ ی که همین الان آن را ساخته بودیم را در صفحه قرار دهید، برای این کار از پنجره کتابخانه آن را به درون این لایه جدید بکشید.

تمام لایه های دیگرتان را پاک کنید که شامل فریم های کاراکترتان بود. در حال حاضر Timeline شما باید دارای یک فریم و یک لایه باشد که شامل Symbol انیمیشن تان است.
شما دو جور می توانید سایه بسازید، یک سایه استاندارد که در زیر نمونه قرار می گیرد و کمی با آن فاصله دارد، این افکت بسیار ساده و صاف جلوه می کند و به نظر می رسد سایه روی دیوار یا یک صطح صاف افتاده است و وقتی می خواهیم سایه ای داشته باشیم که روی زمین افتاده این نوع سایه ما را راضی نخواهد کرد. برای دست یابی به یک سایه قانع کننده شما باید چند مرحله کار انجام دهید.
نمونه Movie Clip را دو تا کنید (از آن یک کپی بسازید) و کپی آن را در پشت نمونه اصلی قرار دهید، برای این کار می توانید آن را در یک لایه جداگانه در زیر نمونه اصلی قرار دهید.
نمونه زیری را انتخاب کنید و به سربرگ F+ilter‌ در قسمت Property Inspector بروید. از منوی +، Drop Shadow را انتخاب کنید. سپس Strength را به 45% تغییر دهید و Hide Object را تیک بزنید، با این کار تصویر Movie Clip نامرئی شده و فقط سایه آن دیده می شود. شما می توانید دیگر خصوصیات آن را به دلخواه تغییر دهید، از جمله Quality و ...

برای این که سایه را از حالت صاف بودن و روی دیوار بودن در بیاوریم از ابزار Free Transform استفاده کنید تا نمونه سایه شده را کج کنید، قبل از این که شما این کار را به درستی انجام دهید باید چند بار امتحان کنید و ممکن است چند بار اشتباه کنید. سایه را فشرده و آن را کج کنید تا شکلی شبیه به سایه ای به خود بگیرد که روی زمین افتاده (تصویر 47 را ببینید). ممکن است لازم باشد آن را جابجا کنید تا واقعی بنظر بیاید.

فیلم خود را امتحان کنید و ببینید که چقدر واقعی به نظر میرسد.
وقتی یک انیمیشن حلقه ای (انیمیشنی که دائم تکرار می شود) را با یک انیمیشن حلقه ای دیگر ترکیب کنید، شما به یک نتیجه بهتر و ماهرانه تری خواهید رسید.
انیمیشن mudbubble_boy_dog_flash8.fla یک نمونه از این نوع ترکیب را نشان می دهد. در این نمونه می بینید که سایه چقدر در سه بعدی بودن انیمیشن کمک می کند. این انیمیشن یک سری از Movie Clip است که شامل انیمیشن های حلقه ای سگ و پسر می باشد. من در مقاله بعدی توضیح خواهم داد چگونه یک انیمیشن کوتاه حلقه ای می تواند مدت زیادی به فیلم های شما اضافه کند.
امیدوارم این مقاله مهارت شما را در طراحی و انیمیشن سازی در Flash ارتقاء داده باشد. تکنیک های دیگری نیز در رابطه با انیمیشن سازی در Flash وجود دارد که می توانید به آنها دست یابید، مانند انیمیشن کامل یا Full Animation که منظور همان انیمیشن فریم به فریم می باشد، Shape Tween، و سکانس های تصویری از یک ویدئو یا یک برنامه انیمیشن سه بعدی. همچنین تعدادی Plug-In‌ های عالی از طراحان و انیماتور های دیگر وجود دارد که می تواند در روند کار به شما سرعت بخشد. منتظر مقالات بعدی باشید که تکنیک ها و ابزار های این مقاله در آنها استفاده شده.