おもちゃラボ

Unityで遊びを作っていきます

Spriterを使ってボーンアニメーションする

前回の記事(Spriterを使ってスプライトアニメーションを作る - おもちゃラボ)では、Spriterを作って簡単なアニメーションを作る方法を説明しました。前回はアニメーションを付ける際、各パーツそれぞれを動かしてポーズをつけていましたが、それではちょっとめんどくさいですよね。そこで今回はボーンというものを使って、より簡単にキャラクタにポーズを付ける方法を説明したいと思います。

ボーンとは

ボーン(骨)とはその名の通り骨格のことで、キャラクタにボーンを入れることで、各パーツが動ける範囲を限定することができます。下図では赤い三角形がボーンを表しており、上腕部と前腕部、手首にそれぞれボーンをいれいます。このボーンを操作することで、各パーツの可動範囲を矢印の範囲に限定してキャラクタにポーズをつけることができます。

f:id:nn_hokuson:20140331194344j:plain

Spriterでのボーンの入れ方

では、Spriterでボーンアニメーションを作る方法を説明していきます。まずは前回と同様Spriterを起動しFile→New Projectからパーツを保存したフォルダを指定して、Spriterに各パーツを読み込みます。
f:id:nn_hokuson:20140326230710j:plain

各パーツがロードできたら、右カラムから作業領域に使用するパーツをドラッグ&ドロップしていきます。今回は、複雑な動きはしないので、胴体、右腕、左腕、頭部、ネギ、の5つのパーツを使用しました。もっと複雑な動きをさせたいのであれば、更に髪の毛パーツとか右左足パーツとかに細かく分けていくと良いでしょう。
f:id:nn_hokuson:20140326230714j:plain

パーツの前後関係を変更したい場合は左カラムのZ-orderパネルで修正します。前後関係を変更したいパーツをドラッグ&ドロップし正しい前後関係になるように修正してください。
f:id:nn_hokuson:20140326230721j:plain

さて下準備が整ったところで、いよいよボーンを入れていきます!ボーンを入れるにはAltキーを押しながらマウスをドラッグしてください。すると、ドラッグを開始した座標から現在のマウス座標に向かってボーンが描画されます。まずは背骨から入れていくのがやりやすいと思うので、腰から首に向かってボーンを入れてください。
f:id:nn_hokuson:20140326230734j:plain

次に腕のボーンを入れます。背骨のボーンがオレンジ色になっていることを確認してから、肩から手首に向かってボーンを入れます。これによって背骨が親ボーン、腕が子ボーンとして関連付けられます。今回は複雑な動きをさせないので、腕は一本のボーンしか入れていませんが、曲げたい部分の数に応じてボーンの数は調整してください。
f:id:nn_hokuson:20140326230740j:plain

同様にして頭部と右腕にも、それぞれボーンを入れてください。ボーンを入れる際には、一度背骨のボーンをクリックしてオレンジ色にしてから、頭部と腕のボーンを作成してください。これで背骨がそれぞれのボーンの親になります。
f:id:nn_hokuson:20140326230745j:plain

ネギにボーンを入れるときは右腕のボーンをハイライトしてから、ネギのボーンを配置してください。これで右腕とネギのボーンに親子関係が作成されます。
f:id:nn_hokuson:20140326230750j:plain

必要なボーンを入れることが出来たら、次はボーンとパーツを関連付けていきます。これは「特定のボーンを動かした時にどのパーツを動かすか?」の影響範囲を決めるものです。影響範囲と書きましたが、Spriterは2Dのみを扱うので(3Dだともっとややこしい場合もある)、実際にはどのボーンとどのパーツを関連付けるかを決める作業になります。まずは背骨のボーンを選択し、その状態でbボタンを押します。するとパーツのテクスチャが半透明になるので、関連付けたいパーツをクリックして下さい。これで、背骨のボーンと胴体パーツが関連付けられました。同様に他のボーンもパーツと関連付けて下さい。
f:id:nn_hokuson:20140326230755j:plain

全てのボーンが関連付けたれたら、背骨のボーンを選択して左右振ってみてください。正しく設定できていたらキャラクタも背骨の動きと合わせて動くと思います。
f:id:nn_hokuson:20140326230759j:plain

では折角なので、定番(?)のネギ振りアニメーションを作ってみましょう。まずはタイムラインのカーソルが0フレーム目にあることを確認してから、右腕のボーンを操作してネギを振り上げた状態にして下さい。
f:id:nn_hokuson:20140326230803j:plain

次に、タイムラインのカーソルを500フレーム目まで移動し、右腕のボーンを振り下ろしたポーズを付けて下さい。ループボタンにチェックが入っていることを確認してから再生ボタンを押して見てください。無事ネギは振れたでしょうか?
f:id:nn_hokuson:20140326230808j:plain

まとめ

今回はSpriterを使ってボーンアニメーションをする方法を説明しました。前回も書きましたが、このSpriterというソフト、めっちゃ使いやすいソフトなのに、日本で全然浸透していないのでちょっと普及の意味も込めて、わかりやすく説明してみたつもりです。参考になれば幸いです。

参考文献

「人を描くのって楽しいね!」

ゲームは作りたいんだけど、キャラクタとかうまく書けないし・・・という方必見!ペラペラ君という丸と四角形からなる簡単なモデルから丁寧に書き方を教えてくれます。ペラペラ君だけでも色々なポーズが載っていて、これを一つ一つ描き写していくことで、人を描くときのバランス感覚が養われます!繰り返し練習すれば、どんどん上手くなっていくのが実感できる、良い参考書です。ペラペラ君→ゴムゴム君とだんだん肉付けして最後にはちゃんと人型のキャラクタをかけるようになります(ただ、作例にはえっ?っていうデッサンもチラホラ載っているので注意。笑)


 
 

「スーパーマンガデッサン―作画のための考えるデッサン」

言わずと知れたマンガデッサンの名著。簡単なキャラクタの描き方から筋肉や骨格の話まで非常に充実した内容です。また、作例がたくさん載っていて、それぞれのキャラクタが物凄く生き生きしています。このキャラクタたちを見ているだけでも十分価値はあると思いますが、キャラクタを描き上げる過程まで丁寧に説明してくれていて至れり尽くせり!!上の「人を描くのって楽しいね!」のステップアップ用にももってこいの一冊だと思います。


スーパーマンガデッサン―作画のための考えるデッサン
林 晃 松本 剛彦 森田 和明
グラフィック社
売り上げランキング: 6,598