Tank(戦車)

この戦車プロジェクトはSpineのパスやトランスフォーム・コンストレイントを使用して、戦車の無限軌道やホイールなどの機械的なコンポーネントを迅速・簡単にアニメーションさせる方法をご紹介します。この戦車の例はSpineのtint black(ティントブラック)機能を使用して大規模で低コストな爆発エフェクトを作成します。

戦車のトレッド(キャタピラ)

セットアップ

tank-rootボーンは同名のパス・アッタッチメントを含むtreads-pathというスロットを含んでいます。このパス・アッタッチメントはtreads-pathパス・コンストレイントのターゲットになっています。

このパス・コンストレイントはtread～tread36ボーンを動かします。このセットアップにより、パス・コンストレイントのPosition(位置)値をキーイングするだけで、アニメ―ション中にトレッドをパスに沿って動かすことができます。

treadボーンがパスに沿って正しく回転することを確認するためにMix(ミックス)のRotate(回転)をTangent(接線) の代りにChain(チェーン)に設定することを除いては、全てのパス・コンストレイトのプロパティにデフォルトを使用しています。

treadsパスを選択すると、このパス自体が多くのボーンにウェイト付けされていることがWeightsビューで分かります。

パスを変形するために、これらのボーンをトランスフォームすることができます。下のGIFでは、 tread-gravity1ボーンがY軸上で動いており、パスがこれに従って変形されています。

各トレッドの幾つかのパーツはホイールの手前に描画されており、同じトレッドの他のパーツはホイールの後ろに描画されています。1つのトレッドのスロットとアタッチメント設定は以下のようになっています。

treadスロットはホイールの前に描画され、tread-inside1およびtread-inside2スロットはホイールの後ろに描画されています。これはスケルトンのDraw Order(表示順序)内の関連スロットの位置により定義されます。

アニメ―ション

Animate(アニメ化)モードでdriveアニメーションを再生すると、トレッドがホイールの回転とともに動いているのが分かります。これはドープシートで見られる通り、パス・コンストレイントのPosition(位置)プロパティをキーにして実行しています:

戦車が岩の上を走行すると、岩の形状をフォローしてトレッドのチェーンが変形します。これはパスがウェイト付けされたボーンのトランスフォームをキーイングすることで行なわれます:

ホイール

ホイールリムの上部が内側のホイール上部に影を落としています。ホイールが回転してもこの効果を得るには、影を実際のホイールから分離されています。以下はとあるホイールのセットアップです:

wheel-mid-root1ボーンはwheel-mid-overlayスロットを含み、このスロットはホイールのシャドウ部分を代表するアタッチメントを含んでいます。実際のホイール上部にシャドウを描画する時、理想的な影の効果を得るために、このスロットのBlending Mode(ブレンドモード)をMultiply(乗算) に設定します。

実際のホイールはwheel-mid-root1ボーンの子であるwheel-mid1ボーンに含まれています。wheel-mid-root1はシャドウを未回転のままにしてトランスレートするだけです。ホイールを回転するにはwheel-mid1ボーンを回転します。

wheel-mid1ボーンを選択してこれを回転すると、下側の残りホイールも回転します。これはトランスフォーム・コンストレイントにより制御されます:

トランスフォーム・コンストレイントwheel-mid1-transform はwheel-mid1ボーンの回転に基づいてwheel-mid2およびwheel-mid4ボーンを回転させます。これにより、wheel-mid1ボーンの回転のみにキーを作成するだけでOKになります。トランスフォーム・コンストレイントは他のボーンを確実に追従させてくれます。

ホイールの回転を不均一にするためには、トランスフォーム・コンストレイントのRotate(回転)のオフセットを93に設定します。他のホイールはwheel-mid1と同じ速度で回転するため、Rotate(回転)のミックス値は100に設定します。

このトランスフォーム・コンストレイントは他のホイールを動かすこともできます。しかし、これにより全てのホイールが同じように回転するため、均一的な動作になります。代わりにwheel-mid2-transformおよびwheel-mid3-transformのトランスフォーム・コンストレイントに見られるように、異なる回転オフセットを持つトランスフォーム・コンストレイントを幾つか設定します。

他の2セットのホイール、wheel-small-*とwheel-big-*には小ホイールは大ホイールより速く回転する必要があることを考慮して同様の設定を持たせます。

爆発エフェクト

戦車プロジェクトにはshootというアニメーションがあります:

このエフェクトを従来のフレーム・バイ・フレームアニメーションの手法で作成すると、大量のテクスチャ容量が必要になってしまい、特に携帯ゲームにおいては好ましくありません。ここでは、それぞれが爆発のフレームを示す複数の大きなイメージを使用する代わりに、smoke-puff01-bg、smoke-puff01-fg、smoke-puff02-fg、smoke-puff03-fg、smoke-puff04-fgという5枚の小さな画像を各種smoke*ボーン上に複製して使用しています。

これらの画像はSpineのティントブラック機能を使用するためにグレースケールになっていることにご注意ください。以下は、ドープシートでshootアニメーションをスクラブするにつれてsmoke-puff1-fgスロットの表示内容とカラーが変化する様子です。

煙の形状は様々な形状のアタッチメントの表示をキーにすることで変化していますが、これは本質的に従来のフレーム・バイ・フレームアニメーションのミキシングと同様です。ティントブラックが煙の色の変化に使用されています。

ドープシートの中でタイムラインをゆっくりスクラブすると、より多くの煙の形状が現れます。このセットアップは説得力のある爆発エフェクトを作成するために、トランスレーション、回転、スケール、タイミングにバリエーションを与えたsmoke-puff1-fgに使用されるものと似ています。

smoke-glowボーンはメッシュアタッチメントとスロットを持ち、爆発効果に少し強度を増し、煙の一番熱い部分を明るくするために、スロットのBlending(ブレンド)がAdditive(加算)に設定されています。