いまさらIKアニメーション
IKアニメーションとは?
IKはInverse Kinematicsの略で、日本語で言うと逆運動学。
そう言われてもよく分からないだろうが、要は多関節キャラが作りやすいアニメーションの仕組みのことだ。
パーツや塗りの中に骨(bone)を通して、骨格があるかのように動かそう、というわけ。
こ…これがあればランブルフィッシュとか作れちゃうの! すごい!! ちちびんたリカだって作れちゃうんだ!!
とまー結構面白そうに思えるかもしれない。
でも残念ながら、Flash CS4で導入されたこの機能、2014年現在の最新版であるFlash CCでは削除されているのだ。とほほーん。
今から手を出そうという人もいないと思うけど、面白そうな機能であること自体に違いはないし、金払った機能は使っておきたいという貧乏性で、ちょっと手を出してみよう、というわけ。
まずは、基本から
アドビのサイトをチェック。Adobe Flash Professional * (Flash Professional CC では非推奨)インバーネスキネマティックを読む。
よく見たら、このページのメインタイトル、誤字じゃないかインバーネスじゃなくてインバースね。いきなり、Adobeのやる気がしれる。
骨アイコンを選択して、関節から関節へとドラッグして骨を配置していく。
ムービークリップにくっ付けていく場合、各ムービークリップの変形点が関節となるので、一旦テキトーにムービークリップを繋いだあと、変形ツールを使って、変形点やパーツの位置を細かく修正していく。
この時、デフォルト描画設定の「変形点を自動設定」のチェックは外しておく。自動設定は大雑把すぎるので。
この骨の設定がかなり難しい。
関節が変形点になるということは、パーツ毎に関節はひとつしか持てないというわけで、細かく指定しようとすると、パーツも細かくわけるか、透明のダミーパーツを置くことになる。
めんどい。
で、骨を設定したパーツはひとつのレイヤーにまとめられ、IKアーマチュアレイヤーとなり、IK ボーンを設定したオブジェクトしか置けなくなる。
そのレイヤーは特別なプロパティバネルも用意され、IKアーマチュア(IKArmature)の設定ができる。
各ボーン毎の設定もプロパティバネルがあるので、角度の制限やバネ機能とかを設定していけば一丁上がり。
なんとも後付けの機能って感じの仕様です。プラグインかなんかで付け足したかのよう、というか内部的には丸っきりプラグインなのではなかろうか。
だからCCで容易に機能を外すことができたんだろう。
基本機能が精選されることは良いことだと思いますが、IKをオプションとして後から出すことも考えていて欲しいものです。
基本機能部分を安くクラウドで提供して、プラグインで商売するというのが、ありそうなビジネスモデルです。
さて閑話休題。
この時、レイヤーのプロパティで、種類が「オーサリング時」と「実行時」から選べる。
オーサリング時は、トゥイーンのパーツアニメの要領で、アニメーョンを設定していける。複数のパーツを1レイヤーで扱えるから便利。
私はとにかくレイヤーが増えると何やっているか分からなくなってしまうので有り難い。
特にIKオブジェクトにする必要がないものまでIKアーマチュアレイヤーにして動かしたくなりそうだ。
そして実行時を選ぶと、パブリッシュするだけでドラッグでパーツを動かせる状態になる。ピン留め関節の厚紙人形のようで、とても楽しい。
ボーンの根元はデフォルトでは固定なので全体の移動はできないが、根元のジョイントX移動・Y移動を有効にすると移動できる。
あとシェイプにも骨を入れることができるので、蛇っぽいものも比較的簡単に作れる。
IKのシェイプトゥイーンみたいなもんですな。ただし、使いどころは結構難しい気がする。
結局アニメーションは一コマずつ手で動きを付けた方がいい動きになるだろうし、なんだかんだで早くできる気がする。
実際に使ってみた
そんなわけで「オーサリング時」を使ったアニメーションで、姫さまダッシュ!というゲームを作った。
なお、ほとんど同じに見える姫さま右往左往は、普通のパーツアニメで一コマずつ動かして作っている。
姫さまダッシュ!も結局一コマずつ動かしているので、ほとんど手間の軽減になってない。それどころかパーツを色々動かしているうちにちょっとずつズレてくるので、ほぼ変形ツールで自然な位置に再配置している。
あと炎のシェイプにボーン設定してアニメーションさせてるんですけど、小さすぎてわかんねーしパターンすくねーし、描いた方か断然早かったろうな。
とまぁ……IK使う意味あったんですかね。
最終的に、フツーのパーツアニメの手法とほぼ同じになっちゃったんで、Flash CCでインポートしてもほぼ確実に同じ動きが再現されることでしょう。
使い方が上手くなったら、もーちょっと省力化できるかもしれないけど、現在絶賛廃止中の機能にあんまり習熟するのもアレな感じだしなぁ…
ActionScriptでIK
ActionScriptでの解説はAdobe Flash Platform * インバースキネマティックの操作を読めばいいっぽい。
IK関連はfl.ikパッケージにまとめられていて、以下のようなクラスで構成されている。
- IKManager : IKの管理コンテナ
- IKArmature : IK木構造全体
- IKBone : IKの単位
- IKJoint : IKの関節
- IKMover : IKの動きの制御
- IKEvent : IKで発生するイベント
IKはDisplayObjectContainerの子オブジェクトではなくて、専用のIKManagerで管理されている。
figureAというアーマチュアをオーサリングツールで設定しておいた場合、取り出しはこう。
var ika:IKArmature = IKManager.getArmatureByName( "figureA" );
うーん、実に後付けっぽい雰囲気。
そして、スクリプトでアーマチュアは生成できない…えー、まーじーでー、意味わからん。Adobeお前は何を言っているんだ?!
…でまぁ、これじゃ付ける意味なかったな、と気付くのに3年かかってるわけですかねAdobeさんは。
それから、IKJointを得るのに識別子から一発で得る方法が用意されてなくて、ルートからツリーを辿るか、IKBoneの方はgetBoneByName()って関数があるので、まずIKBoneを取り出してそのtailJointプロパティからIKJointを得る、という事になるみたい。
…えー、うそーん、XMLのE4Xとコンパチな指定方法用意するぐらいしてくださいよー。
さらに、IKJointのrotationプロパティが読み取り専用で値を代入できない。
アニメーションさせるには、IKJointからIKMoverを作って、そこにpoint指定するという、大変遠回りな方法を取る必要がある。
ボーンを設定しているムービークリップのrotationを直接動かすと、ボーンのつながりを無視して、その場で回転するのでIKである意味ない。
メンドクセー!
addChild()みたいな関数で、アーマチュアを設定することもできないので、IKArmatureを取って別のキャラに適用するとかもできない。
多関節キャラを動かして、そのポーズを保存する、ということがかなり困難な作りになってます。
例えば、ポーズ設定用の素体を動かすと、群衆が全て同じポーズをする、なんてインタラクションを作るのが、ポーズのコピーみたいなノリではできないということ。
…オーサリング時にはポーズのコピーができるのに!!
一応、IKJointのpositionを保存しておけば、ある程度再現できますが、IKMoverは座標を指定して、そこに近づくように動かすという機能なので、途中のオブジェクト配置が再現される保証はありません。
ムービークリップの位置や回転も記録しておかないと、完全再現するのは無理っぽい。
メンドクセー!!!
後、IKJointは設定しているムービークリップにインスタンス名が必要らしく、IKアニメーションを作ったら、勝手に名前を設定しちゃう。
挙げ句に、定義されてない識別子です的な警告を出してくる…、うへぇ、作りが荒いなぁ。
…ということで、スクリプトでIKしたいなら、自前でクラス作った方がマシなレベルなので、Flashのボーンツールは盛大にコケたのでありました。
まとめ
正直なところ、IKMoverの仕組み自体がよく分からなかった。
トゥイーンのためのクラスのような、そうでもないような…結局これ何? なんでこんな仕様になってんの??? という感じ。
どーも、微妙に動いてないような気がする。ローカルで動かすと動いて、ブラウザだと動かない部分があるなー。
ゲーム的にはさほど大事な部分ではないといえばないんだけど、なんでただのアニメーションの挙動に違いが出るかなー、よくわからん。 こっちの理解不足な感じがする。
今から手を出す物好きもいないと思いますが、あんまり役に立たない機能だなー、というのが最終的な印象。
私は折角そこそこ勉強したので、省力化できそうなところには使って行こうかと思ってます。…一生そんな機会がこない可能性もありますが。
今日はここまで。