ボーンツールを活用したインタラクションの作成

はじめに

昨年末にリリースされたAdobe® Flash® CS4 Professional（以下Flash CS4）より「ボーンツール」機能が追加されました。

今までは、人間や動物の関節の動きや、歯車やピストンといった複雑な動きなど、複数のオブジェクトが連携するアニメーションを作成するには、ひとつひとつのオブジェクトに対して、個別にアニメーションをつける必要がありました。しかし、この「ボーンツール」を使えば、人間の関節のような、複数のオブジェクトが連動したアニメーションを容易に作成することが可能です。

この記事では、ボーンツールによるボーン（インバースキネマティック）の作成と、IKArmatureクラスを用いたインバースキネマティックの制御の方法について、解説していきます。なお、サンプルにはActionScript 3.0を使用します。

必要ソフトウェア

Adobe® Flash® CS4 Professional

• 体験版
• 購入

ダウンロード

• boneSamples.zip (ZIP,1.2MB)

• シェイプを使ったボーンの例（bone_01_01.fla）
• インスタンスを使ったボーンの例（bone_01_02.fla）
• 腕を動かすアニメーション素材ファイル（bone_02_01.fla）
• 腕を動かすアニメーション完成ファイル（bone_02_02.fla）
• ドラッグできる腕素材ファイル（bone_03_01.fla）
• ドラッグできる腕完成ファイル（bone_03_02.fla）
• カーソルを追いかける腕素材ファイル（bone_04_01.fla）
• カーソルを追いかける腕完成ファイル（bone_04_02.fla）
• のびる骸骨素材ファイル（bone_05_01.fla）
• のびる骸骨完成ファイル（bone_05_02.fla）

ボーン（インバースキネマティック）とは？

ボーンとは複数オブジェクト同士の連携を設定するために、骨と関節を設定することにより、一意のオブジェクトの位置や角度などの情報をもとに、関連するオブジェクトの位置や角度なども自動的に計算し、位置調整を行う機能です。この機能を使うと、例えば手の動きに連動させて、腕や肩の関節を動かすアニメーションを簡単に作成することが可能です。

図00.ボーンを使ったアニメーション

3Dソフトなどで、モデリングされたキャラクターなどにアニメーションをつける際などに、使われることが多く、インバースキネマティック（逆運動学）とも呼ばれます。

今までは、末端の関節の角度や位置を定める方法は、根元の関節から順に計算する必要があり、アニメーションを作成する際には、とても非効率なものでした。その問題を解決する方法として考案されたものが、各関節の位置を末端から逆順に計算していくインバースキネマティックという手法です。

Flashでは、つながったボーン全体を「アーマチュア」、ボーン間を連結する点を「ジョイント」と呼んでいます。

図01.アーマチュアとボーンとジョイント

Flash CS4 のボーンツールでできること

Flash CS4では、主に以下の3つ機能が使えます。

1. シェイプ内へのアーマチュアの作成
2. 複数のシンボル間のボーンの作成
3. 作成したボーンおよびアーマチュアのIKArmatureクラスによる制御

1. シェイプ内へのアーマチュアの作成

図02.シェイプをつなげたボーン

単一のシェイプ内にアーマチュアを作成し、ボーンや各ジョイントの位置に合わせて、シェイプを変形させることができます。（bone_01_01.fla参照）

※ツールバー[選択ツール]を利用してボーンアニメーションを確認いただけます。

2. 複数のシンボル間のボーンの作成

図03.シンボルをつなげたボーン

シンボルを別のシンボルに接続し、複数のシンボルを繋ぐアーマチュアを作成することができます。ボーンや各ジョイントの位置に応じて、各シンボル同士が連動し、位置の変更や回転を行うことが出来ます。（bone_01_02.fla参照）

3. IKArmatureクラスによる制御

作成したボーン、ジョイント、一連のアーマチュアをIKAramatureクラスを用いて、制御することが可能です。

ページ 1 / 5

次のページ

著者について