Spine のメッシュは、画像に頂点を置いて、画像を曲げたりゆがめたりできるようにする仕組みです。
頂点をボーンに結び付ける(ウェイトを付ける)と、ボーンを動かして画像を変形できます。
- メッシュにする:リージョンアタッチメントのプロパティで「Mesh」にチェック →「Edit Mesh」
- 頂点を置く:「Trace」で外周を自動で作り、「Generate」で内側に頂点を足す
- ウェイトを付ける:Weights ビューで「Bind」→ ボーンを選ぶ →「Auto」
- 整える:「Smooth」でならし、「Prune」で細かいウェイトを消す
2026年10月23日に公式のMesh attachmentsとWeights viewを再照合しました。
練習手順は資料に基づくもので、今回の実機操作結果ではありません。
Unity・Spineエディタでの操作再現は含まず、画面の英語名と版ごとの差を分けて説明します。
ここで紹介する機能は Spine Professional だけで使え、Spine Essential では使えません。
以下はSpine 4.3向けの練習手順です。
ウェイトは各頂点に対するボーンの影響度で、リージョンアタッチメントは変形用の頂点を持たない画像のことです。
メッシュを作る
- 画像のリージョンアタッチメントを選ぶ
- ツリーのプロパティで「Mesh」にチェックを入れる
- 「Edit Mesh」を押して編集モードに入る
メッシュにした直後は、四隅の4つの頂点だけです。
外周を作る(Trace)
「Trace」は、画像の透明でない部分の輪郭から、外周の頂点を自動で置きます。
実行すると既存ウェイトとデフォームキーが削除されるため、作成済みデータでは先に複製を保存します。
| Trace の設定 | 働き |
|---|---|
| Detail | 頂点の数 |
| Concavity | へこんだ部分に頂点を置く優先度 |
| Refinement | 形を整えるためにかける手間 |
| Alpha threshold | この透明度より薄い画素は無視する |
| Padding | 画像と外周の間のすき間 |
内側に頂点を足す(Generate)
「Generate」は、変形に効く位置に頂点を足します。
既存頂点の位置を保ったまま追加できます。
ただし公式ガイドでは、GenerateとTraceは既存ウェイトとデフォームキーを削除すると説明されています。
バインドやアニメーションを作った後に実行する場合は、先にコピーを保存してください。
公式ガイドは、関節など大事な場所だけ手で頂点を置き、残りを Generate で埋める使い方を紹介しています。
編集モードの道具
| 道具 | 働き |
|---|---|
| Modify | 今ある頂点を動かす |
| Create | クリックで頂点を足す・ドラッグで辺を足す |
| Delete | クリックで頂点や辺を消す |
| Reset(編集モード内) | 四隅の4頂点へ戻し、既存ウェイトとデフォームキーも削除する |
外周の辺は水色、自分で引いた内側の辺はオレンジ、自動で計算される辺は灰色の破線(「Triangles」をオンにすると見える)で表示されます。
頂点は少なめに
公式ガイドは、頂点は1つごとに毎フレーム計算がかかるので、数を最小限にするよう勧めています。
ウェイトがあると、影響するボーンの数だけ計算が増え、100頂点に2本のボーンなら200回の計算になると説明されています。
ウェイトを付ける
- Weights ビューを開き、メッシュを選ぶ
- 「Bind」を押して、結び付けるボーンをクリックする
- 「Bind」をもう一度押す(スペースキーか Esc でも抜けられる)
初めて結んだときは、ウェイトが自動で計算されます。
Bind は、メッシュを先に選んでも、ボーンを先に選んでもかまいません。
Weights ビューのボタン
| ボタン | 働き |
|---|---|
| Auto | ウェイトを計算し直す。頂点やボーンを選んでいれば、その分だけやり直す |
| Smooth | 外周辺や手動の内側辺でつながる隣接頂点と平均する。未選択なら全頂点が対象 |
| Prune | 小さいウェイトを消す。Bones で1頂点あたりの最大本数、Threshold で消す値を決める |
| Weld | メッシュ間のウェイトをそろえる。対象同士が共通の2本以上のボーンへBindされていることが条件 |
| Swap | 一覧で選んだ2本のボーンのウェイトを入れ替える |
| Lock(錠前) | ほかのボーンを直しても、そのボーンのウェイトを変えない |
| Update bindings | 今の頂点の位置で、ボーンに結び直す |
Auto は、頂点とボーンの単純な距離ではなく、メッシュの形を考えて重みを付けます。
手で直したウェイトを残したまま一部だけやり直したいときは、その頂点だけ選んで Auto を押します。
ボーン一覧にも選択が残っている場合は、そのボーンだけがAutoの計算対象になります。
意図せず一部しか変わらない場合は、頂点とボーンの両方の選択状態を確認してください。
Update bindings が要るとき
結んだあとにボーンを動かし、その状態でウェイトを直すと、頂点がずれることがあります。
現在の形を保ったままウェイトを調整したい場合は、Update bindingsで現在位置を新しいバインド位置にできます。
古いバインド位置は置き換わるため、意図した変形まで変わらないかコピーでポーズを比較してください。
ブラシで塗る
Weights tool で、頂点のウェイトを直接決めたり、ブラシで塗ったりできます。
| モード | 働き |
|---|---|
| Direct | 上下のドラッグか Weight のスライダーで、値を正確に決める |
| Brushes の Add | 選んだボーンのウェイトを足す |
| Brushes の Remove | 選んだボーンのウェイトを引く |
| Brushes の Replace | 決めた値にする |
ブラシの設定は、Strength(与える最大のウェイト)、Size(大きさ)、Feather(ウェイトが弱まっていく範囲)です。
ウェイトの割合は、「Pies」で頂点ごとの円グラフ、「Overlay」でボーンの色の塗り分けとして確かめられます。
ブラシを使う前に、影響度を変更するボーンを選びます。
頂点を選択していればブラシはその頂点だけに作用し、未選択なら全頂点が対象です。
ウェイトの合計は100%に調整され、あるボーンを増やすと他のボーンの分が減ります。
1本のボーンが100%を持つ頂点では、そのボーンの値を引くだけでは減らせません。
別のバインド済みボーンを選んで影響度を足し、割合が分配されるかを確認します。
デフォームキーは控えめに
メッシュの頂点の位置は、アニメーションのキー(デフォームキー)にもできます。
ただし公式は、変形はほぼウェイトで行い、デフォームキーは避けるか最小限にするよう勧めています。
Spine の最初の設定は、Spineの使い方で紹介しています。
2本のボーンで曲がり方を比較する
下の練習ZIPには、自作の透明背景画像mesh-practice-input.png(320×160)を入れています。
左側が青、右側が橙の帯で、画像の中央を関節の位置として使います。
これはSpineの出力画面ではなく練習用の入力データです。
元プロジェクトを複製し、画像を中央に置きます。
左側の中央から画像中央へ親ボーン、中央から右側の中央へ子ボーンを作ります。
メッシュは四隅に加え、中央の関節付近の上端・下端にも頂点を置き、2本へBindします。
練習用のアニメーションでAnimateモードへ切り替え、Auto Keyをオフにします。
子ボーンを曲げ、左端・関節・右端の動きを比較してください。
未キーの試し曲げは、タイムライン上をクリックすると元のポーズへ戻ります。
既存のアニメーションにキーがある場合は、その時刻のポーズが反映されるので、キーのない練習用データで試します。
まずAutoの結果を保存し、関節付近の頂点だけを選んでSmoothを試します。
元のAutoと、調整後の同じ角度を比べます。
| 症状 | 観察するもの | 次の操作 |
|---|---|---|
| 関節で帯が潰れる | 頂点位置と両ボーンのウェイト | 関節周辺の頂点だけを確認 |
| 片側が動かない | Bind対象とPiesの割合 | 意図したボーンの影響を確認 |
| Prune後に形が変わる | プレビューと除去本数 | 適用前の値へ戻して比較 |
| ウェイト変更で頂点がずれる | ボーン移動後のバインド位置 | Update bindingsが必要な状況かを確認 |
調整を戻すときの違い
Undoで直前の調整を戻すか、保存したAuto時点の複製へ戻します。
Edit Mesh内のResetは四隅へ戻すとともにウェイトとデフォームキーを削除します。
ツリープロパティのResetはUVに合わせて変形を解除する別の操作ですが、こちらもウェイトとデフォームキーを削除します。
どちらも調整のUndoには使いません。
Update bindingsも以前のバインド位置を復元する操作ではありません。
練習ファイルと確認済みの範囲
2本のC#例は参照・名前・待ち時間の異常系をローカルのテストダブルで検査し、4.3のAPI宣言を一次資料で照合しました。
実際のSpine/Unityコンパイル・描画・スキン・書き出し・変形は未検証です。
コードは4.3用です。
練習の完了は、それぞれ本文の表示・再生・復元を実環境で確認して判断します。
まとめ
- 「Mesh」にチェック →「Edit Mesh」でメッシュを編集する
- Trace で外周、Generate で内側の頂点。頂点は少なめに
- Weights ビューの Bind でボーンと結び、Auto で計算する
- Smooth・Prune・Update bindings で整える
参考:Esoteric SoftwareのMesh attachments、Weights view(2026年10月23日確認)。
実機の再現や画面確認は未実施です。
操作条件はウェイト配分と変形の試し方を含め、2026年10月26日に公式資料を再照合しました。
今回はSpineの実機で変形・キー・Undoを再現していません。
