このページはSpriteStudio Ver.6.0を対象にしています。
SpriteStudio Ver.6.1のメッシュ・ボーン機能の使い方は以下のページをご覧ください。
SpriteStudio Ver.6に実装されるメッシュ・ボーン機能は、３DCGソフトウェアのようにすべてのパーツをメッシュとボーンで構成する必要がなく、必要なパーツのみ柔らかい動きを実現できるようになっています。髪の毛や布などの柔らかい動きを表現するのに最適です。
SpriteStudio独特の制御になっており、そのため、３DCGソフトウェアの操作などと異なる部分があります。
※従来の３DCGソフト型のボーンも予定しておりますが、Ver.6.1以降の実装になります
目次
事前準備
互換性を確認する
メッシュ・ボーン機能を使用するためには「プロジェクト設定」の「互換性」でメッシュ・ボーン機能を有効にする必要があります。
メッシュパーツ用のセルマップを準備
メッシュパーツに使用するセルマップは、2の累乗のサイズにする必要があります。
（セルとして切り出す際は２の累乗にする必要はありません）
メッシュパーツは、通常パーツと同じように「セル」を使用します。
ただし、メッシュの切り出しを行う際、メッシュの範囲(UV)を設定する際に、隣接するセルの画像が表示されてしまいます。
参照イメージとなるテクスチャ画像を作成する際はご注意ください。
セットアップデータについて
アニメーションデータの中の「セットアップデータ（Setup）」でメッシュ・ボーンを配置します。セットアップデータはssaeにつき一つ存在し、ssae内の全アニメーションデータと情報を共有します。
セットアップデータが複数存在することはありません。
プロジェクトウィンドウの「Setup」を選択することで、セットアップデータを編集することができます。
レイアウトウィンドウの「Animation」「Setup」の文字をクリックすることで、アニメーションデータとセットアップデータの編集を瞬時に切り替えることができます。
「Animation」時にクリックするとセットアップデータの編集に、「Setup」の時にクリックするとアニメーションデータの編集に切り替わります。
| アニメーションデータ編集時 | セットアップデータ編集時 |
 |
 |
メッシュパーツを作成する
メッシュパーツ対応のセルを作成する
メッシュ編集はセットアップデータで行います。
メッシュパーツは、従来のセルマップをそのまま使用します。
ただし、セルの切り出し位置に隣接して画像が存在した場合、メッシュ編集時の範囲設定によっては、隣接画像が表示されてしまうので注意が必要です。
セルリストウィンドウでメッシュパーツ対応のメッシュセルを作成することができます。
|
「セットアップデータ」に切り替えます。 セルリストのツールボタン |
 |
|
メッシュセルにしたいセルを選択し、コンテキストメニューを開きます。 メッシュ化するセルを「通常パーツ」と「メッシュパーツ」両方で使用したい場合、セルを複製してください。 |
 |
|
「メッシュ編集ウィンドウ」が開きます。 |
|
|
セルリスト上で、(メッシュ)と名称についているセルが「メッシュセル」です。 メッシュを選択してコンテキストメニューを開くと「メッシュ編集」「メッシュ化解除」が有効になります。 |
 |
で切り替えることが可能です。メッシュ編集ウィンドウでメッシュ分割を行う
メッシュ編集ウィンドウでメッシュの分割を行います。
メッシュは三角形になるように分割するときれいに動かすことができます。
| 左クリックで頂点を打ち、アウトラインを作成します。 |  |
|
マントのしわなど、動きを制御したい場所に対して必要に応じて分割点を打ちます。 |
 |
|
「メッシュ確認」をクリックすると、頂点・分割点に応じてどのようにメッシュが作成されているか確認することができます。 必要に応じて頂点・分割点の追加、削除を繰り返し、メッシュ分割を行ってください。 |
 |
メッシュ編集ウィンドウでの操作
メッシュ編集ウィンドウではメッシュを作成・編集することができます。
主な操作方法は以下の通りです。
機能の詳細につきましては「メッシュ編集ウィンドウ」のページをご覧ください。
| 左クリック |
「頂点」か「分割点」を打ちます。頂点を元に、アウトラインを構成します。 「左クリックでポイントを作成」を有効にし、プルダウンボックスでどちらを作成するか設定することができます。
|
| 右クリック | コンテキストメニューを開きます。 |
| ドラッグ |
設定に応じて、機能が変化します。
|
| 頂点・分割点の削除 |
「削除」機能を使用して、頂点、分割点をまとめて削除することができます。
|
| メッシュ確認 | 頂点、分割点を元に、メッシュ分割された状態が確認できます。 |
|
編集を終了 |
ウィンドウを閉じる際に、「変更を保存しますか？」とダイアログが出るので、「はい」を選択して終了してください。 |
メッシュパーツとボーンパーツをレイアウトする
この項目の操作はセットアップデータ上で行います。
ジョイントパーツを配置する
メッシュ・ボーンパーツは、セットアップデータ上に配置を行います。
まずはジョイントパーツを配置します。
ジョイントパーツの配置方法は２パターンあります。
メッシュパーツを配置する
セルリストからメッシュパーツをレイアウトに配置すると、メッシュパーツの中央を基準にして自動的にジョイントパーツを追加します。
|
セルリストで作成したメッシュセルをレイアウトウィンドウに配置します。 |
 |
フレームコントロールウィンドウからジョイントパーツを追加する
フレームコントロールウィンドウの「ジョイントパーツを追加」からジョイントパーツのみを追加することも可能です。
追加したジョイントパーツの子にメッシュパーツを追加することで、ジョイントパーツにメッシュパーツを関連付けすることができます。
|
フレームコントロールウィンドウから「ジョイントパーツを追加 |
 |
| ジョイントパーツの子に属するようにメッシュセルをドラッグドロップすると、そのジョイントパーツに対してメッシュパーツが関連付けされます。 |
|
 |
」をクリックすると、ジョイントパーツを追加することができます。
ボーンパーツを配置する
ジョイントパーツに対して、ボーンパーツを配置します。
セットアップデータで追加を行います。
なお、先にボーンパーツを配置してから、メッシュパーツを配置することも可能です。
|
ボーンの追加方法は２種類あります。
|
 |
| ボーンは通常の親子関係の他、ジョイントパーツから二股、三股と分けて配置することも可能です。 |  |
ボーンパーツの先端に違う絵を登録する場合
1つのジョイントパーツに複数のメッシュパーツを子パーツとして配置することはできません。
ただし、ボーンパーツの先にジョイントパーツを設定することで、先端に異なるメッシュパーツを設定することが可能です。
| ボーンパーツの子パーツとして、新たにジョイントパーツを作成します。 |  |
|
メッシュパーツを新たなジョイントパーツの子パーツにし、新規にボーンツリーを作成することで、ボーンの先にさらにメッシュ・ボーンパーツを配置することができます。
|
 |
ウェイトを調整する
メッシュパーツとボーンパーツを配置が完了したあとは、メッシュパーツがボーンパーツの影響をどのように受けて変化するか、ウェイトを調整する必要があります。
レイアウトウィンドウで 「ウェイト表示」をクリックすると、現在のウェイトの状況を表示することができます。 |
 |
|
|
ジョイント・ボーンパーツを色分けする
レイアウトウィンドウのジョイント・ボーンパーツは、フレームコントロールウィンドウのカラーラベルを設定することで変更が可能です。
|
フレームコントロールで色を変更したいボーンパーツを選択し、右クリックをしてコンテキストメニューを開きます。 「カラーラベル指定」で任意の色を設定します。 |
 |
| カラーラベルを指定したパーツの色が、指定した色に変化します。 |  |
その他、セットアップデータで配置可能なパーツ
いずれのパーツも、セットアップデータ上で、ボーンパーツの子パーツとして設定することができます。
ボーンポイントパーツ
ボーンパーツの子供として配置する、座標取得を行うためのパーツになります。
ボーンパーツの動きに連動しますので、プログラムから特定の位置を取得する場合などに使用してください。
フレームコントロールウィンドウのパーツ選択領域のコンテキストメニューから追加できます。
コンストレイントパーツ
ボーンパーツのアニメーションを組む際に、ボーンパーツの動きに指定された拘束を与えるパーツになります。
フレームコントロールウィンドウのパーツ選択領域のコンテキストメニューから追加できます。
ボーンにアニメーション付けをする
アニメーションの編集はアニメーションデータ上で行います。
セットアップデータで追加・設定したボーンパーツは、通常パーツと同様の方法でアニメーションを設定することが可能です。
セットアップデータ上でZ回転値を設定しても、アニメーションデータ上ではZ回転値が設定されていません。
見え方を同じにするには、セットアップデータ上のZ回転値を、アニメーションデータ上でも同様の値をZ軸回転のアトリビュートに入力する必要があります。
メッシュ・ボーン機能の使用例
メッシュ・ボーン機能をどのように使用するかの作例を紹介します。使い方によって、さまざまな表現を実現することが可能です。
また、動画ページに実際にメッシュ・ボーン機能を使用したアニメーションを掲載しております。こちらも是非ご覧ください。
- 動画 – 作例
SpriteStudioで作成した動画作品のご紹介
髪の毛やマントなどをたなびかせたい時に
キャラクターの髪の毛の揺れや、旗やマントといった布がたなびく表現を簡単に作成することができます。
脚の動きや棒のしなり、蛇など
棒や蛇のような、関節の無い棒状のものをしならせる、くねらせるアニメーションを簡単に作成できます。
また、今までは足を関節ごとにパーツ分けをしていましたが、メッシュ・ボーン機能を使用し、ボーンを人間の骨に見立てることで、間接でパーツを分けなくても足の動きを作成することができます。
作例「てのひらの冒険」
こちらの作品は、従来のSpriteStudioの機能と、Ver.6で追加されたメッシュ・ボーン機能、マスク機能をうまく組み合わせて作成されたアニメーションです。
髪の毛や布のアニメーションはもちろんですが「1枚の絵を立体的に動かす」といった、メッシュ・ボーン機能の様々な表現方法と、SpriteStudio Ver.6の可能性をご確認いただけます。
詳しい解説は下記ページをご覧ください。
関連ページ
- メッシュ化できませんというセルをメッシュ化したい
「パーツから参照されているセルはメッシュ化できません」と表示されるセルへの対応方法を解説しています。
メッシュ・ボーン機能に関連するウィンドウ
メッシュ・ボーン機能を使用する際に関連するウィンドウの機能解説ページです。