!!
#Alien(エイリアン)
このエイリアンのプロジェクトでは、古典的なフレーム・バイ・フレーム(コマ撮り)アニメーションの手法をSpineが提供する最先端のアニメーションツールと組み合わせる方法をご紹介します。このプロジェクトでは、ほんの数枚のフレーム・バイ・フレームの画像が手描きで用意されており、それらをSpineの[メッシュ変形](/spine-meshes#変形)とスムーズな補間でアニメーションを補っています。`death`アニメーションではこれらのテクニックを、破裂する頭、飛び出す目、緑色の粘液の飛散など複数箇所で使用しています。また、顎を離すために[トランスフォーム・コンストレイント](/spine-transform-constraints)が使用されています。
エイリアンはこちらの[Super Spineboy](https://github.com/EsotericSoftware/spine-superspineboy)のデモゲームのアクションで見ることができます。デモの中では、バラエティを持たせるために多少異なる色で表現されています。また4種類の強度を持つエイリアンに4種類のサイズが使用されています。一番大きいエイリアンが死ぬと、破裂して小さなエイリアンが飛び出します。
## 頭の破裂
### セットアップ
頭は`head`と`burst-bg`という2つのスロットを含む`head`と呼ばれる単一のボーンによりモデルされています。
`head`[スロット](/spine-basic-concepts#スロット)は4つのアタッチメント、`head`、`burst01`、`burst02`、`burst03-fg`を含んでいます。これらのアタッチメントは異なるイメージを指す[メッシュ](/spine-meshes)アタッチメントです。`head`アタッチメントは全てのアニメーションで使用されており、デフォルトの「破裂前の」状態のエイリアンの頭になっています。`burst01`、`burst02`、`burst03-fg`アタッチメントは頭の破裂用の3つのフレームです。これらは`head`アタッチメントとともに古典的なフレーム・バイ・フレームアニメーションのキーフレームを構成しています。
`burst-bg`スロット内の`burst03-bg`アタッチメントは、少し大きい緑色の飛散する粘液をアニメーションに追加します。
また、目、顎、緑色の飛散する粘液はheadボーン階層の一部になっていないことにご注意ください。これらはアニメーションプロセスを容易にするために別で保管されています。これはそれぞれのスロットの[表示順序](/spine-slots#表示順序)にも反映されています。
### アニメーション
頭が破裂する部分の`death`アニメーションを構成する[タイムライン](/spine-dopesheet#タイムライン)は、上記の`ANIMATE(アニメ化)`モードの[ドープシート](/spine-dopesheet)に表示されています。headスロット(`Attach(アタッチ): head`)のタイムラインには、`head`スロット内の全ての[アタッチメントの切り替え](/spine-keys#スロットアタッチメント)のキーがあります。アニメーションはスロット内にある`head`アタッチメントから開始し、その後`burst01`、`burst02`、`burst03-fg`アタッチメントに切り替わっています。これらのキーは古典的なフレーム・バイ・フレームアニメーションに似ています。フレーム`39`には、`burst03-bg`アタッチメントがキーされ、頭の破裂の後ろに緑の粘液が追加されて表示されています。
このフレーム・バイ・フレームアニメーションは、変形(Deform)のタイムラインにみられる通り、メッシュアタッチメントに変形を加えることでさらに面白いものにしています。
## 顎と目
### セットアップ
顎のボーン(`metaljaw`)と目(`eye-root`)は`head`ボーンを親とせず、スケルトンの`root`ボーンを親としています。これにより独立した動きが可能になり、`death`アニメーションで顎と目を頭から分離しやすくなります。
顎と目のボーンは[トランスフォーム・コンストレイント](/spine-transform-constraints)を使用して頭のボーンをフォローするようになっています。トランスフォーム・コンストレイントのオフセットとミックス値はデフォルトで顎と目が頭のボーンの動きをフォローするように設定されており、通常の親子関係のように動作します。
`death`アニメーションで顎と目が頭のボーンを追従する必要がなくなる時に、これらのトランスフォーム・コンストレイントの[ミックス](/spine-transform-constraints#ミックス)値を`0`に設定して、制約されたボーンが自身のトランスフォームをもとに自由に動けるようにしています。
### アニメーション
`death`アニメーションで顎と目を頭から分離するためには、トランスフォーム・コンストレイントのミックスをキーにして、トランスフォーム・コンストレイントからボーンのトランスフォームへの影響を減らします。ミックスは`Transform(トランスフォーム): eye-root`、`Transform(トランスフォーム): jaw`、`Transform(トランスフォーム): eye`タイムラインでアニメーションされています。