本記事では、ちびキャラの骨入れからセットアップ（リギング）まで、過去の制作例を解説します。掲載画面のSpineの版は特定できておらず、数値はこの素材向けの設定例です。別の素材では、親子関係やウェイトを確認して調整してください。
前回はSpineのコンストレイントのうち「パスコンストレイント」を使ってセットアップしましたが、今回は「トランスフォームコンストレイント」と「IKコンストレイント」の2つを使用します。
こんな感じリグを組んでみました。
[Spine]参考＆前提条件
下記の記事にあるチュートリアルの項目で紹介した、CGWORLDのモデルデータを参考にしています。
なお、Spineの基本的な操作方法を習得している前提で解説を進めます。
この制作例はメッシュとトランスフォームコンストレイントを使うため、Spine Professionalが必要です。
4.3のEssentialでIKが使えても、このリグ全体を同じ手順で作れるわけではありません。
作業前に元のプロジェクトを別名保存し、制約を追加する前の状態へ戻れるようにします。
初めて操作する方は、まず下記の記事をご確認ください。
[Spine]下絵（テンプレート）の準備
下絵は次の目的で使用します。
※Photoshopからの書き出し時に一緒に出力することも可能です。
今回は手動で画像を追加する手順で進めます。
- 元絵とずれてないか確認するため
- 骨の位置のあたりとして
骨を配置するアタリとして使用します。
ファイル名は「template」とします。
背景を透明にしたPNG形式で保存します。
下絵画像「template」をrootボーンへドラッグ＆ドロップします。
親階層にスロットが自動生成されます。
下絵のアタッチメントを選択し、トランスレートツールで位置を合わせます。
位置を合わせたら、誤操作を防ぐために「選択」をOFFにして下絵をロックします。
作業しやすいよう、必要に応じてカラーの透明度（不透明度）を調整します。
作業しやすい不透明度に調整します。完成データを書き出す前に、下絵が表示対象に残っていないか確認してください。
骨を作成するには、ビューパネル下部の「作成」ツールを選択し、ドラッグ＆ドロップで配置していきます。
基本の骨の作成
この制作例では、基本の骨を16本作ります。本数は素材の分割と動かしたい部位によって変わります。
- 股間 ➡ 腰 ➡ 首元 ➡ 顎（4箇所）
- 肩 ➡ 肘 ➡ 手首（左右で6箇所）
- 足の付け根 ➡ ひざ ➡ 足首（左右で6箇所）
※腕の骨の位置はテンプレート画像を参考に配置しています。
リグ用の骨の作成
※下記画像のピンク部分
制御用（リグ用）の骨を追加で作成します（計10箇所）。
- 前髪
- 横髪
- 後ろ髪
- 顔の前方
- 顔の中央
- 顔の後方
- 左右の肩（×2）
- 左右の股（×2）
骨の微調整
セットアップモードで補正（Compensate）の「ボーン」と「イメージ」を使い、子ボーンや画像の配置を保ちながら調整します。
補正の対象を確認してから動かします。ウェイト付きメッシュは複数の骨の影響を受けるため、調整後の形状も確認してください。
トランスレートツールや回転ツールを使って、骨の位置と角度を整えます。
- 回転角を整数にそろえるのは管理上の工夫であり、リグの動作条件ではありません。元絵に合う角度を優先します。
- 位置：骨の先端と次の骨の根本のリングが重なるように調整しましょう
- 骨の長さ：骨を選択しツリーパネルの下「長さ」の値を変更します。
データ整理
ここで一度ツリー階層とデータを整理します。
まずは下記画像を参考に、親子階層の整理と骨の名前付けを行います。
※ツリーパネルの矢印アイコンを右クリックすると、すべての階層を一括展開できます。
- 腰（body）
- 胸（body_upper）
- 鎖骨中央（body_neck）
- 頭（head）
- 肩（armOuter,armInner）
- 肘（armOuter_lower,armInner_lower）
- 手首（armOuter_hand,armInner_hand）
- 足の付け根（legOuter,legInner）
- ひざ（legOuter_lower,legInner_lower）
- 足首（legOuter_foot,legInner_foot）
- 前髪（head_hairOuter）
- 横髪（head_hairInner）
- 後髪（head_back）
- 追加した肩の骨（armOuter_shoulder,armInner_shoulder）
- 追加した足の骨（legOuter_hip,legInner_hip）
- 追加した顔の前方の骨（head_Controller）
- 追加した顔の中央の骨（head_face）
- 追加した顔の後方の骨（head_Controller_sub）
骨の色分けとアイコン変更
識別しやすいように骨へ色を設定します。
骨を選択し、プロパティの「カラー」で色を調整します。
また、追加したリグ用の骨はアイコンを変更しておきます。
- 腕と足の付け根は■のアイコンに
- 他は十字のアイコンに
設定が完了すると下記のような表示になります。
[Spine]ちびキャラのセットアップ（リギング）
各アタッチメントを骨にバインドし、ウェイトを調整していきます。
パーツのメッシュ化
パーツのアタッチメント（画像）を選択し、ツリービュー下部の「メッシュ」にチェックを入れて「メッシュ編集」をクリックします。
「作成」ツールで頂点を配置し、「変更」ツールで位置を調整します。
また、頂点を配置する際にドラッグ＆ドロップするとオレンジ色のエッジを作成できます。
エッジを指定することで、意図したメッシュの分割ラインを維持できます。
※今回はすべてのアタッチメントをメッシュ化します（計10箇所）。
肘や膝には曲がりを支える頂点とエッジを配置します。この例では関節付近を3重程度に分割していますが、必要な分割数は形状と曲げる角度によります。
パーツのバインド
メッシュと骨を関連付けるバインド作業を行います。
画面上部メニューの「ビュー」から「ウェイト」パネルを表示します。
メッシュを選択した状態でウェイトパネルの「バインド」を押し、連動させたい骨を選択します。
各メッシュに必要な骨をすべてバインドしていきます（計10箇所）。
骨を選び終えたら、もう一度Bindを押すか、SpaceまたはEscでバインドモードを終了します。
初回のBindではウェイトが自動計算されるため、その結果から各部位を調整してください。
対応する骨の組み合わせは次のとおりです。
- 前髪➡head, head_hairOuter
- 横髪➡head, head_hairInner
- 後髪➡head, head_back
- 顔のパーツ➡head, head_face, head_Controller_sub
- 顔➡head, head_Controller, head_Controller_sub
- Inner側の腕➡armInner, armInner_lower, armInner_hand。Outer側はそれぞれOuterの骨を使います。
- Inner側の足➡legInner, legInner_lower, legInner_foot。Outer側はそれぞれOuterの骨を使います。
- 体➡胴体、肩、腰のうち、実際に体のメッシュを変形させる骨を選びます。下記の7本は制作例の本数であり、名前だけで自動的に決まるものではありません。
パーツのウェイト調整
- 前髪➡head_hairOuterを中心に割り当てる
- 横髪➡head_hairInnerを中心に割り当てる
- 後髪➡head_backを中心に割り当てる
- 顔のパーツ➡head_face一色
- 顔➡head一色
- 腕➡上腕・前腕・手の影響範囲を分け、関節付近で滑らかにつなぐ。全頂点を3本に均等配分する意味ではありません。
- 足➡太もも・すね・足先の影響範囲を分け、関節付近を調整する
- 体➡7本の骨を影響範囲を考えて塗り分け
ウェイトの調整方法は4種類あります。
部位に応じて使い分け、各骨の影響範囲を設定していきます。
- ダイレクト➡骨を選択して上下にドラッグして値を直接調整
- 追加➡値分、影響度を追加する
- 取り除く➡値分、影響度を削る
- 置換➡指定した値に置き換えられる。0にして消す時に便利
※ウェイトパネルの「オーバーレイ」と「選択済み」にチェックを入れると、影響範囲が色分けされて見やすくなります。
※この段階では大まかな割り当てで問題ありません。
最終的な仕上がりは、テストアニメーションを再生しながら微調整します。
確認は複製したプロジェクトで行い、腕・脚・顔を1部位ずつ動かします。
曲げる前後の形と他部位への影響を比べ、意図しない変形が出たら直前の調整か保存済みの複製へ戻します。
かかとのIKコンストレイントの設定
2ボーンIKのターゲット「IK_legOuter」を動かし、太ももとすねで足先の位置を制御します。曲がる向きはBendで確認します。
- Outer側の足の骨「legOuter」を選択
- ツリービュー＞新規＞IKコンストレインを選択
- 作成時に制約対象の「legOuter」をクリックすると、その先端に別のターゲット骨が新規作成されます。legOuter自体をターゲットとして使うわけではありません。
- コンストレイントと新しいターゲット骨を「IK_legOuter」として識別します。公式IKガイドのとおり、ターゲットは制約対象の子孫には置けません。
- IKコンストレイントの設定で、ParentをlegOuter、Childをその直接の子であるlegOuter_lower、Targetを別の骨IK_legOuterにします。ターゲット骨の子としてすねを付け替える操作ではありません。
- ターゲット骨IK_legOuterを足首の位置へ調整し、Bendの向きと足の曲がり方を確認します。
つま先のIKコンストレイントの設定
コントローラー「IK_footOuter」の位置を動かすと、つま先が連動して回転する仕組みです。
- 「legOuter_foot」を選択
- 新規＞IKコンストレインを選択
- 作成時に制約対象のlegOuter_footをクリックし、その先端に新しいターゲット骨を作成します。足の骨自身をターゲットにする意味ではありません。
- コンストレイン名は「IK_footOuter」
- 階層を整えます。作成した「IK_footOuter」の骨の下に「IK_legOuter」をドラッグ＆ドロップ
- 最後にrootの下にある「IK_footOuter」と子の「IK_legOuter」の位置を微調整
- 「IK_legOuter」の位置を動かせば、膝が曲がり
- 「IK_footOuter」を移動すると、その子に置いた「IK_legOuter」も移動します。つま先の向きだけでなく、脚全体の位置と曲がりも確認します。
同様の手順をもう片方の足にも行い、同じIK設定を適用します。
顔のトランスフォームコンストレイント
「head_Controller」を移動させると、顔のパーツが立体的に回り込む仕組みです。
- 顔パーツ「head_face」を選択して、トランスフォームコンストレイン
- ターゲットは「head_Controller」を選択
- この制作例ではミックス値を4としています。公式Transform constraintsガイドで、Local／World、Relative、各ミックスの対象を確認してください。リンクスライダーは複数の値を連動させるため、移動だけを調整したい場合はリンクを外します。
- Match（一致）は現在の配置に合わせてオフセットを設定する機能です。元に戻す操作ではありません。対象のミックスを0にして骨を意図した位置に置き、Matchでオフセットを設定してからミックスを戻して確認します。
以上の設定により、「head_Controller」を動かした際に顔の各パーツが追従します。
他の頭部パーツもhead_Controllerをターゲットにします。下表は過去の制作例の値であり、同じ数値だけで動きが再現するとは限りません。骨の親子関係、Local／World、Relativeとウェイトを合わせて調整します。
| 項目 | コンストレイント名 | ミックスの値 |
|---|---|---|
| 顔のパーツ | cons_head_face | 4 |
| 横髪 | cons_head_hairInner | 2.5 |
| 前髪 | coms_head_hairOuter | 3 |
| 後ろ髪 | cons_head_back | -1 |
| 顔の後方のコントローラー | cons_head_subController | -100 |
肩のコンストレイント
armOuterの移動に肩の補助骨を追従させ、ウェイトを通して体の形を変えます。移動ミックスだけでターゲットの移動量が回転角へ変換されるわけではありません。
- 「armInner_shoulder」を選択してトランスフォーム・コンストレイント
- ターゲットは「armInner」
- 移動（Translate）のミックスを調整します。過去の制作例では100を使用しています。
- 同様にarmOuter_shoulderを対象、armOuterをターゲットに設定します。過去の移動ミックスの例は150です。数値の表示単位と適用空間を確認し、小さい動きから試します。
さらに両肩を連動させる設定を行います。
- 「armInner」を選択
- ターゲットを「armOuter」
- 生成されたコンストレインのオプションのローカルにチェック
- ミックスのトランスレートを-40
- ミックスを0にして基準の配置を決め、Matchでオフセットを設定した後にミックスを戻し、追従方向を確認します。
以上で「armOuter」を左右に動かした際、「armInner」も連動して体の傾きを調整できるようになります。
腰のコンストレイント
足の骨の移動に腰の補助骨を追従させ、ウェイトで腰周りの形を変えます。移動ミックスは回転への変換設定ではありません。
- 「legOuter_hip」を選択してトランスフォーム・コンストレイント
- ターゲットは「legOuter」
- ミックスのトランスレートは140
- 続いて「legInner_hip」を選択してトランスフォーム・コンストレイント
- ターゲットは「legInner」
- ミックスのトランスレートは140
両足が連動する設定を行います。
- 「legInner」を選択してトランスフォーム・コンストレイント
- ターゲットは「legOuter」
- 生成されたコンストレインのオプションのローカルにチェック
- 過去の移動ミックスの例は-65です。ミックスを0にして基準の配置を決め、Matchでオフセットを設定してから戻します。ずれが残る場合は連打せず、適用空間、Relative、親子関係、他の制約を確認します。
以上でちびキャラのリグ構造が完成しました。
あとはアニメーションさせて、違和感のある場所はウェイトを再調整しましょう！
[おまけ]メッシュ編集しないで関節を曲げる場合
メッシュ編集を行わずに画像の回転だけで関節を曲げる方法も解説します。
設定手順は以上です。
メッシュ変形が不要な部位は、画像を骨に付けて回転させる構成にできます。実際の処理負荷は頂点数、ウェイトの影響数、描画条件などでも変わるため、対象端末で測定します。
ちびキャラのようなシンプルな形状であれば、メッシュ変形を使わず回転のみで曲げる構成も有効です。
つなぎ目がずれる場合は、セットアップモードで補正の対象を確認して骨の回転軸を調整し、曲げた状態でも隙間が出ないか確かめます。
重なりで隠したい部分は、ツリービューの目アイコンまたは階層展開アイコンから右クリックで階層下すべて非表示に切り替えられます。
3DCGのほかの記事は、まとめからご覧いただけます。
Spineとは何かはこちらです。
Spineの記事は、ほかにもあります。
ちびキャラ作成！骨入れからセットアップまでまとめ
この例では全パーツをメッシュ化し、IKとトランスフォームコンストレイントを組み合わせました。実装時は不要な頂点やウェイトの影響を減らし、対象端末で処理負荷を確認してください。
各部位を連動させると、操作する骨を減らせる場合があります。作りたい動きに合わせ、制約で動かす部分と直接キーを付ける部分を決めます。
よくある質問：Spineでちびキャラの骨入れとセットアップをするときのチェックリスト
この記事では、Spineで何を作りますか？
ちびキャラの骨入れから、セットアップ(リギング)までを作ります。今回は、「トランスフォームコンストレイント」と「IKコンストレイント」の2つを使います(前回は、パスコンストレイントを使いました)。Spineの基本的な操作方法を習得している前提で解説しています。
下絵(テンプレート)は、どう使いますか？
関節部分に赤を入れた下絵を用意し、骨を配置するアタリとして使います。ファイル名は「template」とし、背景を透明にしたPNG形式で保存して、rootボーンへドラッグ&ドロップします。親階層に、スロットが自動生成されます。
メッシュは、どう作りますか？
パーツのアタッチメント(画像)を選択し、ツリービュー下部の「メッシュ」にチェックを入れて、「メッシュ編集」をクリックします。「作成」ツールで頂点を配置し、「変更」ツールで位置を調整します。頂点を配置する際に、ドラッグ&ドロップすると、オレンジ色のエッジを作成でき、意図したメッシュの分割ラインを維持できます。この記事では、すべてのアタッチメント(計10箇所)をメッシュ化します。
関節をきれいに曲げるコツは？
関節の形と曲げる角度に合わせて頂点とエッジを追加し、ウェイトを滑らかにつなぎます。3重程度の分割はこの素材での例で、すべての素材に共通する条件ではありません。
ウェイトは、どう付けますか？
画面上部メニューの「ビュー」から、「ウェイト」パネルを表示します。メッシュを選択した状態で、「バインド」を押し、連動させたい骨を選択します。ウェイトパネルの「オーバーレイ」と「選択済み」にチェックを入れると、影響範囲が色分けされて見やすくなります。この段階では、大まかな割り当てで問題ありません。
トランスフォームコンストレイントで、顔のパーツが動いてしまいます。
Matchは元に戻すボタンではなく、現在の配置からオフセットを設定する機能です。ミックスを0にして基準の配置を整え、Match後にミックスを戻します。ずれが残る場合はLocal／World、Relative、親子関係と他の制約を確認してください。表の数値は過去の素材向けの例です。
メッシュを使わずに、関節を曲げる方法はありますか？
あります。関節ごとに画像を分割して対応する骨に付け、回転させます。つなぎ目と回転軸を調整してください。メッシュを使わないことだけで処理速度は決まらないため、対象端末で確認します。
この記事の画面は、今のSpineでも同じですか？
画面は過去の制作例です。使用版は特定できていないため、現在のメニュー名や設定項目は公式ユーザーガイドで確認してください。今回、アプリ上でこのリグを再現した検証は行っていません。
2026年10月26日にMesh attachments、Weights viewと本文の公式制約ガイドを再照合しました。
既存28画像は過去の制作例のまま保持しており、掲載版の特定と現行版でのリグ再現は未完です。
