skeleton dance animation အရိုးေျခာက္ ေအာ္တို ကေနတဲ ့ ပံုေလး

Posted by Zaw lin 0 comments

ဤသင္ခန္းစာကို မေလ႔လာမီ ေရွ႕မွာေရးသားထားေသာ animation သင္ခန္းစာမ်ားကို အရင္ေလ့လာပါရန္ ေရွးဦးစြာ တိုက္တြန္းပါသည္။
CS3 ကိုအသံုးျပဳျပီး animation ျပဳလုပ္တဲ့အခါမွာ animation palette ဟာႏွစ္မ်ိဳး handle လုပ္ႏိုင္ပါတယ္။ Frame animation နဲ႔ Timeline animation တို႔ပဲျဖစ္ပါတယ္၊ အခုေလာေလာဆယ္ေတာ့ Frame animation ကိုပဲအသံုးျပဳပါဦးမယ္၊ ေနာက္သင္ခန္းစာေတြမွပဲ Timeline animation အေၾကာင္းကို ေရးသားေပးပါ့မယ္။
Frame animation ကေတာ့ ေရွ႕ကသင္ခန္းစာေတြမွာေဖာ္ျပခဲ့တဲ့ အတိုင္းလြယ္ကူပါတယ္။ တစ္ခုရွိတာက သူ႔မွာ ImageReady မပါ၀င္ေတာ့ပါဘူး၊ ဒါေပမယ့္ အဲဒီအစား window>animation menu ထည့္ေပးထားပါတယ္၊ ပိုအဆင္ေျပပါတယ္။ ဒီ file ေလးကို download လုပ္ျပီးဖြင့္လိုက္ရင္ေအာက္ပါအတိုင္းျမင္ရပါမယ္။

အရိုးေခါင္းဘယ္ ညာ ၾကည့္ေနတာႏွစ္လံုး လက္ေလးဘက္၊ ေျခေလးဘက္ပါ၀င္ပါမယ္။ layer အေသးစိတ္ကိုေတာ့ layer palette မွာၾကည့္ပါ။ အခုလုပ္မယ့္ animation မွာကေတာ့ ပထမအရိုးေျခာက္ေလးရဲ႔ ေျခ လက္ ေခါင္း ေတြက ေအာက္ပါပံုအတိုင္းေနပါမယ္။

အဲဒီပံုစံအေနအထားအတိုင္း ခုန္ဆြ ခုန္ဆြ သံုးခါလုပ္ျပီး ညာဘက္ကိုသြားမွာပါ (ဤသင္ခန္းစာတြင္ အသံုးျပဳေသာ ဘယ္ ညာ စနစ္မွာ Object ဘက္မွၾကည့္၍ ေျပာေသာစနစ္ကိုသံုးပါမည္) ။ ျပီးရင္ ေအာက္ပါပံုအတိုင္းေျပာင္းသြားျပီး ဘယ္ဘက္ကို ခုန္ဆြ ခုန္ဆြ ျပန္သြားမွာ ျဖစ္ပါတယ္။

ေခါင္းေတြ ေျခ လက္ေတြကို layer တစ္ခုျခင္းစီ ျပဳလုပ္ေပးထားတဲ့ အတြက္ Layer visible ေတြကို on / off ျပဳလုပ္ေပးရင္ ရျပီဆိုတာကို သင္သေဘာေပါက္ေနေလာက္ပါျပီ။ ကဲစလိုက္ရေအာင္။ Window>Animation menu ကိုႏွိပ္ျပီး animation palette ကိုေခၚပါမယ္။

တကယ္လို႔ animation palette ဟာ timeline mode မွာျဖစ္ေနတယ္ဆိုရင္ေတာ့ animation palette မွာပါတဲ့ popup menu (flyout menu) ကေန Frame animation mode ကိုေျပာင္းေပးပါ။

Toolbox ထဲကေန move tool ကို select လုပ္ထားရေအာင္၊ ဒီသင္ခန္းစာတစ္ခုလံုးမွာ Move tool ကိုပဲသံုးသြားမွာပါ။

Layer ေတြအားလံုးကို Link ခ်ိတ္ထားပါတယ္၊ ပံုမွာၾကည့္ပါ။ အဲဒါေၾကာင့္ Move လုပ္တဲ့ အခါ ေခါင္း ေျခ လက္ ကိုယ္လံုး အကုန္လံုး ပါေရြ႕သြားမွာပါ။

အဆင့္ (၁) အေနနဲ႕ frame 1 မွာျမင္ရမယ့္ ေခါင္းေတြ လက္ေတြ ေျခေတြကို ဖြင့္ထားျပီး မလိုတဲ့ အပိုင္းေတြကို layer palette မွာပိတ္ရေအာင္။

အဆင့္ (၂) animation palette ရဲ႔ popup menu ကေန New Frame ယူပါမယ္။ ဒါဆိုေနာက္ထပ္ frame 2 ဆိုျပီး frame အသစ္တစ္ခုေရာက္လာမွာပါ။ အဲဒီမွာ keyboard ကေန Arrow key ေလးေတြကိုအသံုးျပဳျပီး အေပၚတက္ ညာဘက္ေရြ႕လုပ္မွာပါ။ ဒါေၾကာင့္ Up Arrow key ကို ၅ ခါႏွိပ္ျပီး Left Arrow key ကို ၁၀ ခါႏွိပ္ပါ့မယ္။

အဆင့္ (၃) New frame တစ္ခုထပ္ယူပါမယ္။ frame 3 ေပၚလာတဲ့အခါမွာေတာ့ ေအာက္ဆင္း ညာဘက္ကပ္မွာပါ။ Down Arrow key ကို ၅ ခါႏိွပ္ျပီး Left Arrow key ကို ၁၀ ခါႏွိပ္ပါ့မယ့္။

အဆင့္ (၄) မွာေတာ့ အထပ္မွာျပဳလုပ္ခဲ့တဲ့ အတိုင္း new frame ယူျပီ ညာဘက္အေပၚတက္ပါမယ္။

အဆင့္ (၅) new frame ယူျပီး ညာဘက္ေအာက္ျပန္ဆင္းပါမယ္။

အဆင့္ (၆) new frame ယူျပီး ညာဘက္အေပၚျပန္တက္ပါမယ္။

အဆင့္ (၇) new frame ယူျပီး ညာဘက္ေအာက္ျပန္ဆင္းပါမယ္။

အဆင့္ (၈) မွာ ပံုကို new frame ယူျပီး ေအာက္ပါပံုအတိုင္းရေအာင္ layer ေတြကို အဖြင့္ အပိတ္ျပဳလုပ္ပါမယ္။

အဆင့္ (၉) ကေတာ့ new frame ယူျပီး အေပၚခုန္ျပီး ဘယ္ဘက္သြားမွာပါ၊ keyboard ကေန Up Arrow key ကို ၅ ခါႏွိပ္ျပီး Right Arrow key ကို ၁၀ ခါႏွိပ္မွာပါ။

အဆင့္ (၁၀) new frame ယူျပီ ေအာက္ဆင္ ဘယ္ဘက္သြားမွာပါ၊ Down Arrow key ၅ ခါႏိွပ္ျပီး Right Arrow key ၁၀ ခါႏွိပ္ပါမယ္။

အဆင့္ (၁၁) new frame ယူျပီး ဘယ္ဘက္အေပၚတက္ပါမယ္။

အဆင့္ (၁၂) new frame ယူျပီး ဘယ္ဘက္ေအာက္ဆင္းပါမယ္။

အဆင့္ (၁၃) new frame ယူျပီး ဘယ္ဘက္အေပၚတက္ပါမယ္။

အဆင့္ (၁၄) new frame ယူျပီး ဘယ္ဘက္ေအာက္ျပန္ဆင္းပါမယ္။

အဆင့္မ်ားအားလံုးျပီးရင္ frame ၁၄ ခုရပါမယ္ frame 1 နဲ႔ frame 8 ကို frame delay time 0.3 sec ထားျပီး က်န္တဲ့ frame ေတြကိုေတာ့ 0.1 sec ထားပါမယ္။ frame delay time နဲ႔ လႈပ္ရွားမႈမ်ားကိုေတာ့ ေအာက္ပါပံုအတိုင္း အၾကမ္းျပန္ၾကည့္လို႔ရပါတယ္။

အခုဆိုရင္ေတာ့ fram မ်ားအားလံုးတည္ေဆာက္ျပီးသြားပါျပီ၊ File>Save for web & devices ကိုႏွိပ္ပါမယ္။ အဲဒီေနာက္မွာေတာ့ ေပၚလာတဲ့ Dialog box မွာ ေအာက္ပါ setting ေတြအတိုင္းေရြးျပီး Save button ကိုႏွိပ္လိုက္ပါ။

ေပၚလာတဲ့ dialog box မွာ File ေနရာေရြး နံမည္ေပးျပီး save လိုက္ရင္ ေအာက္ပါအတိုင္း animated gif တစ္ခုကိုရရွိျပီျဖစ္ပါတယ္။

အကယ္၍ အဆင့္မ်ားျပဳလုပ္ရ အခက္အခဲရွိပါက ဒီ file ေလးကို download လုပ္ျပီး ေလ႔လာႏိုင္ပါတယ္။ မိမိကိုယ္ပိုင္ idea မ်ားႏွင့္ စမ္းသပ္ၾကည့္ပါလို႔ တိုက္တြန္းပါတယ္။ ေနာက္ထပ္ျပီး timeline animation သင္ခန္းစာကိုလဲ ေဖာ္ျပေပးပါဦးမယ္။

၀န္ခံခ်က္>>တစ္ဆင့္ကူးယူေဖၚျပသည္။