（精選）使用Flash骨骼工具制作角色動畫

1、使用Flash骨骼工具制作角色動畫Adobe Flash CS4 專業(yè)版提供了一個全新的骨骼工具，可以很便捷地把符號（Symbol）連接起來，形成父子關系，來實現我們所說的反向運動（Inverse Kinematics）。 整個骨骼結構也可稱之為 骨架（Armature）。你可以把骨架應用于一系列影片剪輯（Movie Clip）符號上，或者是原始向量形狀上，這樣便可以通過在不同的時間把骨架拖到不同的位置來操縱它們。這篇文章介紹了如何使用符合和形狀創(chuàng)建一個基本的骨骼結構，并應用這些技術使一個卡通角色在一個場景中走動。要求如果想要充分理解和掌握這篇文章，你需要如下的軟件和文件：Flash CS4

2、專業(yè)版· 試用 · 購買 示例文件· monkey_files.zip (ZIP, 1.1 MB) 預備知識對Flash的創(chuàng)作界面有基本了解，懂得符號并能夠創(chuàng)建簡單的時間線動畫。你應該清楚Flash繪圖工具的區(qū)別、有效的符號使用，以及文檔管理的最佳實踐（詳見在Flash中設計動畫角色*）。使用Flash骨骼工具制作角色動畫骨骼工具基礎你可以使用骨骼工具來創(chuàng)建影片剪輯的骨架或者是向量形狀的骨架。讓我們開始構建一個符號的基本骨架吧：1. 創(chuàng)建一個新的Flash文檔，并選擇ActionScript 3.0。骨骼工具只和AS 3.0文檔配合使用（見圖1）。圖1： 在“新建

3、文檔”面板中選擇ActionScript 3.0文件2. 在舞臺（Stage）上畫一個對象。在本文范例中，為了讓其簡單，我使用矩形工具創(chuàng)建了一個基本的形狀。 3. 一旦你創(chuàng)建好了形狀以后，把它轉換成一個影片剪輯或者是圖形符號。 4. 你需要更多的對象來創(chuàng)建相連的物體鏈，只需復制剛剛創(chuàng)建符號即可，按住Alt鍵（Windows）或者Option鍵（Mac OS）并把符號拖動到一個新位置上。Flash在你每次點擊拖拽的時候都會復制一個實例。多重復幾次這個過程，來創(chuàng)建相同符號的多個實例（見圖2）。圖2： 水平對齊的同一符號的多個實例5. 把這些對象連接起來創(chuàng)建骨架。在工具面板（見圖3）中選擇骨骼工具（

4、X）。圖3：工具面板中的骨骼工具6. 確定骨架中的父/根符號實例。這個符號實例將會是骨骼的第一段。拖向下一個符號實例來把它們連接起來。當你松開鼠標的時候，在兩個符號實例中間將會出現一條實線來表示骨骼段（見圖4）。圖4： 連接兩個符號實例的骨骼段7. 重復這個過程把第二個符號實例和第三個實例連接起來。通過不斷從一個符號拖向另一個來連接它們，直到所有的符號實例都用骨骼連接起來了（見圖5）。圖5： 連接了所有符號實例的完整骨架8. 接下來的步驟就有趣多了。在工具面板（V）上選擇選取工具，并拖動鏈條中的最后一節(jié)骨骼。通過在舞臺上拖動它，整個骨架都能夠實時控制了（見圖6）。圖6： 為動畫準備好了的完整骨

5、架通過增加IK（反向運動）跨度的幀數就很容易給骨架增加動畫，點擊并拖拽它的邊緣到期望的幀數（見圖7）。把幀指示器指向指向新的幀數，并把骨架拖動到新的位置上。Flash將會在當前幀數上插入一個關鍵幀，并在IK跨度上進行動作的內插。圖7： 增長IK的跨度并將幀指示器指向最后一幀祝賀你！你已經能夠在Flash里面使用骨骼工具創(chuàng)建一個簡單的骨架動畫了。你也可以使用骨骼工具在整個向量形狀內部創(chuàng)建一個骨架。這可是一個讓人激動的創(chuàng)建形狀動畫的方式，在之前的Flash中從未有過。我通常使用這項技術來為動物角色創(chuàng)建搖尾巴動畫。讓我們從一個又高又細的矩形開始吧。你甚至可以使用細部選擇工具（Subselection

6、 tool，快捷鍵A）把一段變得更窄來做成尾巴的樣子（見圖8）。圖8： 使用矩陣工具和細部選擇工具創(chuàng)建的向量圖形1. 選擇骨骼工具（X）。從尾巴的底部（根）開始，在形狀內部點擊并向上拖拽，來創(chuàng)建根骨骼（見圖9）。在向形狀中畫第一根骨骼的時候，Flash會把轉換為一個IK形狀對象。圖9： 添加了根骨骼后的基本尾巴形狀2. 繼續(xù)向上一個接一個地創(chuàng)建骨骼，這樣它們可以頭尾相連起來。我推薦骨骼逐漸的長度逐漸變短，這樣越到尾部關節(jié)會越多。這樣就能創(chuàng)建出更切合實際的動作來。當完成了向尾巴添加骨骼的過程后，它應該看起來如圖10一般。圖10： 完成后的形狀骨架3. 使用選取工具（V），拖動位于鏈條頂端的最后一

7、根骨骼（在尾部的最根部）。因為非常直的尾巴看起來并不自然，因此我們把骨架放置成了類似S形，如圖11所示。圖11： 骨架的初始位置4. 在IK跨度中添加新的幀，在時間線（Timeline）中點擊后面的幀數并按F5（插入關鍵幀），或者將IK跨度的邊緣拖到右邊。你想要創(chuàng)建一個無縫動畫的話，就需要讓第一幀和最后一幀相同才行。 5. 把幀指示器（播放指示器）放到跨度的最后一幀上，按F6插入一個關鍵幀。這樣在IK跨度的最后會插入一個關鍵幀，在關鍵幀中包含了相同的骨架位置（見圖12）。圖12： 用于創(chuàng)建無縫循環(huán)的頭尾關鍵幀相同的IK跨度6. 將幀指示器放在IK跨度的中間，并將骨架放在新的位置上，如圖13所示

8、。圖13： IK骨架在跨度中點的新位置7. 為了讓尾部擺動更加真實，需要給尾巴加上輔助動作。因為尾部的動作是從根部通過根骨骼發(fā)起的，尾巴的尾端只是對根骨骼的一個延遲的反作用。為了能創(chuàng)建這樣的動畫，把幀指示器放在第一幀初始位置后的幾幀之后，并操縱骨架讓尾部朝著根骨骼相反的方向彎曲（見圖14）。圖14： 在輔助位置上的IK骨架8. 別忘了在IK跨度中點之后也加上輔助動作（見圖15）。圖15： 在IK跨度中點后的IK骨架輔助位置播放動畫后你會發(fā)現，尾巴上的關節(jié)越多，在添加了輔助動作后就越自然。現在進一步地給它加上緩和。如果不加上的話，動畫就會看起來很機械化。 1. 把幀指示器放在IK跨度的頭兩個關鍵

9、幀中間。在屬性面板中，使用緩和（Ease）彈出菜單選擇緩和的類型。 2. 選好了緩和以后，可以通過點擊字符出現的滑動條調整緩和的強度。緩和將會影響兩個關鍵幀之間的動作。 你可以應用不同類型的緩和，并給每個動作使用不同的緩和強度，使用幀指示器放置在每組關鍵幀的中間，選擇不同的緩和預設值，并調整它們每個的強度（如圖16）。圖16： 在屬性面板中選擇一種預設的緩和并調整它的強度將骨架應用于卡通角色現在你已經使用Flash中的骨骼工具創(chuàng)建了兩個不同的IK骨架，接下來就可以將這些技術結合起來為卡通角色創(chuàng)建行走動作循環(huán)。這個示例中設計的角色是一只表情陰郁的猴子。所有他身體的部分都已經分解成不同圖層的符號（

10、見圖17）。圖17： 用于創(chuàng)建動畫的猴子角色小貼士： 請將你的Flash文檔設置為ActionScript 3和24fps。下一步就是如何應用骨架了。憑直覺可能認為用一個骨架將所有身體部分連接在一起就可以了。不過我發(fā)現這并不是最好的方法，因為這樣需要一個非常復雜的骨架而導致難以操作。我更傾向于為胳膊和腿部單獨創(chuàng)建更小的骨架。腿部動畫 腿部是由3單獨個符號組成（見圖18）。圖18： 腿部組成具體想法是這樣的，將所有的腿部符號放到一個圖形符號中：1. 選中這3個符號，然后按F8（轉換為符號），命名為leg_armature。雙擊這個符號進入編輯狀態(tài)。 2. 選中骨骼工具（X）并連接這3個腿部對象，

11、以上部的腿符號作為這個骨架中的根骨骼。完成后的骨架應該是只包括兩塊骨骼，就像圖19所示。圖19： 通過兩塊骨骼連接在一起的腿部組件接下來就是約束每塊骨骼的節(jié)點旋轉。這會限制每塊骨骼關節(jié)的旋轉范圍以避免選轉到解剖學上來說不合理的位置。3. 直接點擊選中一塊骨骼。屬性面板將更新并彈出關節(jié)（Joint）菜單：旋轉和X/Y的平移選項。 4. 在關節(jié)部分：旋轉（Joint:Rotation）選項中，選擇約束（Constrain），使用點擊文字出現的滑動條調整旋轉所需的角度范圍（見圖20）。圖20： 經過旋轉約束調整的根骨骼你可能會想一并調整根骨骼的速度。速度影響的是被操縱時的反應。速度的值越低就相當于給

12、骨骼越高的負重，這樣相對值高的骨骼反應就要遲緩些。我喜歡將速度的值設得稍微低點，因為這樣整個骨架的效果就更自然些（見圖21）。圖21： 通過調整速度增加每個骨骼的負重由于三個對象只用了2塊骨骼，所以鏈條中的最后一個對象更難控制些。因為它沒有一個專用的骨骼去進行動作的約束。有個土辦法可以解決這個問題，那就是在骨架中增加一個額外的對象。這個對象本身是什么都可以，因為最終不會將其發(fā)布到SWF文件中。我個人習慣使用的是橢圓工具（O）繪制的紅色圓點（見圖22）。圖22： 額外增加一個對象，這樣腳部就有了自己專用的骨骼5. Flash不允許添加對象到IK位置圖層，所以需要創(chuàng)建一個新的圖層暫時存放這個對象。

13、 6. 一旦這個對象被放置到靠近骨架鏈條末端的部分，選擇骨骼工具（X）并從當前骨架的末端拖到新對象上。Flash CS4會自動將該對象移至骨架圖層，這樣它就變成這個骨骼鏈的一部分了（見圖23）。圖23： 增加額外骨骼后的腿部骨架7. 現在就要開始行走動作循環(huán)的動畫部分了。選擇視圖 > 標尺（View > Rulers），打開文檔的標尺視圖，然后經過工作區(qū)拖拽標尺畫出一條水平指示線。沿著鞋子的底部邊緣放置這條水平線。這將保證行走路線是完全水平的。別忘了選擇視圖 > 向導 > 鎖定向導（View > Guides > Lock Guides）確保動畫過程中向導水

14、平線不會被意外移除。 8. 我喜歡從最前面的位置開始腿部動畫，然后再逐步往后。一共大約15幀，將幀指示器設置在中點上，就這個示例而言，也就是第8幀。 9. 將運動鞋沿著水平線拖到右邊，同時確保鞋子底部邊緣與水平線完全對齊。 要養(yǎng)成頻繁回放動畫的習慣，在早期階段這種做法可以暴露腿部動畫的問題。腳步是以弧線行進的，這是因為骨架并不是沿著x或y軸移動，這導致行進過程中鞋子會越過水平線（見圖24）。圖24： 骨架超出了水平線修復的方法是，在每一幀里都設置幀指示器，選中鞋子符號，使用方向鍵微移直到底部邊緣與水平線對齊。 10. 在后續(xù)的幀中設置幀指示器并按類似的姿勢操作這個骨架（見圖25）。圖25： 腿

15、部移回到前進位置的動作序列11. 腿部動畫完成后，必須將骨架鏈尾部的額外對象隱藏掉。打開庫面板（Control+L或Command+L），找到骨架鏈尾部的符號。雙擊該符號，然后右擊包含該對象的圖層，將其轉換為向導圖層。這樣額外的對象就不會包括在發(fā)布的文件中了（見圖26）。圖26： 將該圖層轉換成向導圖層以將其從發(fā)布文件中剔除完成后的腿部動畫應該如圖27所示（鼠標在按鈕上懸停播放） 圖27： 完成后的腿部動畫（鼠標在按鈕上懸停播放）12. 因為腿部動畫是嵌在一個符號里的，很容易拷貝粘貼直接用做第二條腿的動畫。這樣就不需要在設計另一條腿的動畫，可以節(jié)省大量的時間。只需拷貝腿部符號并將其粘

16、貼到骨盆圖層下面的新圖層中。 13. 你可以稍微調整一下亮度，讓第二條腿看起來更靠里面。選擇該實例，在屬性面板的顏色效果下拉菜單中選擇亮度，拖動滑動條到負值的位置，稍微加深陰影效果。 14. 為了確保第二條腿在不同幀進入行走循環(huán)以避免與另一條腿同步動作，最好是在動畫的中點開始啟動。在循環(huán)彈出菜單的骨架域中填入8即可實現此效果（見圖28）。圖28： 調整亮度以及第二條腿行走循環(huán)的起點15. 復制的腿要比原腿高幾個像素，這樣看起來兩腿就有距離。你可以沿著x軸將后腿往上移一點兒，建議超過身體的3/4即可（見圖29）。圖29： 完成腿部骨架的猴子角色手臂動畫 接下來的步驟是為角色的手臂加上骨架。這和給

17、腿部加上動畫跟相似：給符號填上骨架和動畫，這樣就可以復制到其他的手臂上來節(jié)省時間。手臂和腿部一樣，由三個單獨的部分組成：上臂、下臂和手（見圖30）。圖30： 手臂可以分成三個能用骨骼工具連接起來的符號如果你想控制手部，就像在腿部骨骼上控制腳一樣的話，在鏈條的尾部使用一個額外的對象，這樣你就能添加第三根骨骼（見圖31）。圖31： 完成后的角色手臂裝配腿部骨架有15幀長。因此，你最好把手臂動畫也設定為相同的長度，這樣它們才會完美地協(xié)調。 1. 在開始動畫之前，在第一幀上設定初始位置。我推薦手臂的開始位置向前一些。另外，這也是分別選擇每個骨骼并調整旋轉約束的好時機（見圖32）。圖32： 為手臂骨架中

18、每個骨骼調整關節(jié)旋轉約束2. 將幀指示器放在15幀上并按F6。這樣會在最后一幀插入一個關鍵幀，來幫助我們創(chuàng)建無縫循環(huán)。 3. 將幀指示器放在跨度的中間，也就是8幀附近，然后調整骨骼，手臂就在一個近似的位置（見圖33）。圖33： IK跨度中點的手臂位置完成了手臂動畫之后，應該看上去如圖34所示（鼠標在按鈕上懸停播放）。 圖34： 完成手臂動畫（鼠標在按鈕上懸停播放）4. 和腿部相似，將手臂符號通過嵌套動畫和角色的身體關聯起來。 5. 復制粘貼手臂符號到一個位于身體下面的新的層上，調整它的位置和明暗度，就如同你之前在后腿上做的事情一樣（見圖35）。 圖35： 完成手臂骨架后的猴子角色尾部

19、動畫 猴子尾巴的動畫是使用形狀骨架來創(chuàng)建的，創(chuàng)建形狀則是使用筆刷工具（B）。圖36展示了尚未添加骨架時的向量形狀。圖36： 使用筆刷工具繪制的尾部形狀圖37展示了添加了骨架后的尾部。值得注意的是，根骨骼是最長的一根，離尾巴尖越近，骨骼就越短。這意味著尾巴尖的部分關節(jié)更多，這看上去也更自然。圖37： 帶有完整骨架的尾部形狀尾部動畫不需要很復雜，你只需要加入一些基本的動作，讓它看起來有生氣即可，不要讓它一直拖在角色的后面。1. 第一步是決定尾部動畫要有多少幀。因為手臂和腿部的動畫都是15幀，可以讓尾部動畫的幀數是15的倍數，這樣你就能在所有的符號之間創(chuàng)建一個平滑的無縫循環(huán)。將尾部的IK跨度調整為6

20、0幀。 2. 現在把幀指示器放在最后一幀上并按F6。這樣會在尾部動畫中插入第二個關鍵幀，該幀和第一幀相同，這樣就確保了循環(huán)是無縫的。 3. 將幀選擇器指向第15幀，拖動鏈條的最后一根骨骼來操縱尾部骨架（見圖38）。圖38： 操縱尾部骨骼4. 不要忘記為尾部骨架增加輔助動作，圖39展示了四個我在尾部動畫中用到的主要位置。 圖39： 四個尾部骨架關鍵位置行走動作循環(huán)動畫到了這個階段，你已經有了足夠的東西來為角色創(chuàng)建一個行走動作循環(huán)了。最后的技術是把整個角色嵌套到一個符號中去。這樣做的好處是，可以在舞臺中重新放置角色、縮放、旋轉以及創(chuàng)建運動動畫。1. 選擇整個角色并按F鍵（轉換為符號），為符號起名字

21、，并在類型的下拉框中選擇圖形（Graphic），點擊OK（見圖40）。圖40： 轉換為符號對話框2. 在時間線上增加一個新層，打開庫面板（Control+L或者Command+L）并將一個新的符號實例拖到舞臺上。 3. 右擊符號并在彈出菜單中選擇創(chuàng)建運動動畫（見圖41）。 圖41： 在右擊彈出菜單中選擇創(chuàng)建運動動畫Flash CS4專業(yè)版的動作模型會將新的運動動畫應用于包含符號的層上。因為這種運動動畫是基于對象的，所以你不再需要在時間線上手工插入關鍵幀。把播放指示器放在新的一幀上并在舞臺上放置符號。Flash會自動為你創(chuàng)建適合的關鍵幀并提供一個樣條插值路徑供你編輯以滿足你的特定需求。圖42展示

22、了最終的行走動作循環(huán)動畫。Flash的骨骼工具制作皮影動畫技巧出處：網頁教學  時間：2011-04-21  人氣：1438我要提問我來說兩句核心提示：Flash CS4的骨骼工具制作皮影動畫技巧教程。本例將使用Flash CS4新增的“骨骼工具”來創(chuàng)建反向運動，該工具可以在短時間里制作出復雜而自然的動畫效果，這種制作方式很適合運用在皮影動畫中。本例思路導入素材，然后分割好圖形的各部分元素。使用“骨骼工具”為老人添加好骨骼，然后為老人制作出行走動畫。使用“骨骼工具”為小狗添加好骨骼，然后為小狗制作出跳躍動畫。Part 1 分割圖形（1）按Ctrl+R組合

23、鍵導入素材/皮影.ai文件，如圖6-1所示。圖6-1 導入素材（2）將老人的各肢體轉換為影片剪輯，因為皮影戲的角色只做平面運動，然后將角色的關節(jié)簡化為10段6個連接點，如圖6-2所示。圖6-2 連接點（3）按連接點切割好人物的各部分，然后每個部分轉換為影片剪輯，如圖6-3所示。圖6-3 切割素材（4）將各部分的影片剪輯放置好，然后選中所有元件，再將其轉換為影片剪輯（名稱為“老人”），如圖6-4所示。Part 2 制作老人行走動畫（1）單擊“工具箱”中的“骨骼工具”按鈕 ，然后在左手上創(chuàng)建好骨骼，如圖6-5所示。圖6-5 創(chuàng)建左手骨骼技巧提示：使用“骨骼工具”連接兩個軸點時，要注意關節(jié)的活動部分

24、，可以配合“選擇工具”和Ctrl健來進行調整。（2）采用相同的方法創(chuàng)建出頭部、身體、左手、右手、左腳與右腳的骨骼，如圖6-6所示。圖6-6 創(chuàng)建其他骨骼（3）人物的行走動畫使用35幀完成，因此在各圖層的第35幀插入幀，如圖6-7所示。圖6-7 插入幀（4）調整好第10幀、18幀和第27幀上的動作，使角色在原地行走，然后創(chuàng)建出“擔子”在行走時起伏運動的傳統(tǒng)補間動畫，如圖6-8所示。圖6-8 調整行走動作（5）返回到主場景，然后創(chuàng)建出“老人”影片剪輯的補間動畫，使其向前移動一段距離，如圖6-9所示。圖6-9創(chuàng)建補間動畫（6）按Ctrl+Enter組合鍵發(fā)布動畫，效果如圖6-10所示。圖6-10 行

25、走動畫Part 3 制作小狗跳躍動畫（1）使用“骨骼工具”為小狗添加骨骼，小狗的骨骼和老人的骨骼不同，小狗只使用一副骨骼，如圖6-11所示。圖6-11 創(chuàng)建骨骼技巧提示：小狗的右前腳和右后腳在身體的背面，被身體擋住了，所以不能直接關聯對象，如圖6-180所示，這時可以將右腳拉出來關聯骨骼后，然后按住Ctrl鍵的同時使用“選擇工具”將其放回原位，如圖6-13所示。圖6-12禁止關聯對象圖6-13關聯調整對象（2）調整小狗跳躍的各種姿勢，如圖6-14所示。圖6-14 調整跳躍姿勢（3）按Ctrl+Enter組合鍵發(fā)布動畫，效果如圖6-15所示。圖6-15跳躍動畫（4）返回到主場景，然后為小狗添加補

26、間動畫，如圖6-16所示。圖6-16創(chuàng)建補間動畫（5）按Ctrl+Enter組合鍵發(fā)布動畫。引用 【Flash】FlashCS4制作骨骼動畫 WingOfStar 的 【Flash】FlashCS4制作骨骼動畫FlashCS4新增了骨骼和綁定的功能。相對傳統(tǒng)的動作繪制，此功能提供了便捷的操作途徑?！咀⒁馐马棥渴紫任覀円私釬lash骨骼工具使用的注意事項：1. 只能對元件（元件內部可嵌套組、元件、圖形）和Flash繪制的圖形進行骨骼添加；2. 不能對組以及組中的物體（包括元件和圖形）進行骨骼添加3. 骨骼鏈只能在元件之間或者所選圖形內進行繪制4. 當將物

27、體進行骨骼連接后，相應的物體將會轉移至“骨架層”中，且其變形軸心將成為骨骼的關節(jié)點5. 骨架層中不能進行圖形繪制及粘貼6. 綁定工具僅對圖形中的骨骼鏈起作用【骨骼的用途】制作機械類轉動，使用元件+骨骼的形式；制作生物類關節(jié)，使用圖形+骨骼的形式。當你在操作過程中出現問題，請再回頭看看以上的注意事項?！竟趋赖木窒蕖抗趋篮喕嗽鹊脑短追绞剑鋵Α皥D形”的控制尤為突出。但畢竟是首次添加的功能，其應用上還有很多局限，僅能進行簡單的動作設置，如尾巴擺動、關節(jié)的平面轉動，較復雜圖形的動作綁定還不能勝任（Flash終究還是矢量2D動畫軟件的范疇）。在盡量避免視覺錯位的情況下，我們

28、使用骨骼輔助還是能完成人物一些常見的形體動作的。元件的骨骼連接操作較為簡單，而圖形則需要注意矢量控制點在骨骼上的分配類似于3D軟件中的骨骼蒙皮權重。進行骨骼設置時，骨骼以所選圖形邊緣的點作為控制點，在這些點包裹的區(qū)域內可存在其他元素（包括使用“墨水瓶”工具生成的外輪廓線）；如果未在所選圖形區(qū)域進行骨骼繪制，則僅能對單一色塊的圖形進行骨骼添加。骨骼工具不能直接控制線條。 應用范例【機械骨骼】1. 開啟FlashCS4，在工作區(qū)中繪制幾個基本圖形。2. 旋轉動畫組件進行元件轉換（快捷鍵：F8），并設置好圖層的順序，組合成動畫需要的物體。3. 選擇骨骼工具，按關節(jié)的位置順序，從根骨骼開始繪制骨骼鏈。*骨骼在元件上的關節(jié)點與元件的變形軸心點有關，因此可使用任意變形工具（快捷鍵Q）對骨骼的關節(jié)點進行設置；如果你在繪制骨骼時關節(jié)點設置不正確，可以進行修正。4. 動畫調試。將光標移動到相應幀序號，插入關鍵幀（快捷鍵F5）；使用選擇工具（快捷鍵V），對骨骼進行拖動。*對元件進行骨骼連接后，所有外部元件會被添加到新的骨架層，骨架層不能繪