Spine のメッシュは、画像に頂点を置いて、画像を曲げたりゆがめたりできるようにする仕組みです。
頂点をボーンに結び付ける（ウェイトを付ける）と、ボーンを動かすだけで画像がなめらかに変形します。
- メッシュにする：リージョンアタッチメントのプロパティで「Mesh」にチェック →「Edit Mesh」
- 頂点を置く：「Trace」で外周を自動で作り、「Generate」で内側に頂点を足す
- ウェイトを付ける：Weights ビューで「Bind」→ ボーンを選ぶ →「Auto」
- 整える：「Smooth」でならし、「Prune」で細かいウェイトを消す
2026年10月3日、現行の公式ガイドとspine-runtimes 4.3のソースを照合しました。
Unity・Spineエディタでの操作再現は含まず、画面の英語名と版ごとの差を分けて説明します。
ここで紹介する機能は Spine Professional だけで使え、Spine Essential では使えません。
Spine のエディタでの再現は含まず、画面の名前は英語版の表記です。
メッシュを作る
- 画像のリージョンアタッチメントを選ぶ
- ツリーのプロパティで「Mesh」にチェックを入れる
- 「Edit Mesh」を押して編集モードに入る
メッシュにした直後は、四隅の4つの頂点だけです。
外周を作る（Trace）
「Trace」は、画像の透明でない部分の輪郭から、外周の頂点を自動で置きます。
| Trace の設定 | 働き |
|---|---|
| Detail | 頂点の数 |
| Concavity | へこんだ部分に頂点を置く優先度 |
| Refinement | 形を整えるためにかける手間 |
| Alpha threshold | この透明度より薄い画素は無視する |
| Padding | 画像と外周の間のすき間 |
内側に頂点を足す（Generate）
「Generate」は、変形に効く位置に頂点を足します。
何度でも押せて、押すたびに、今ある頂点を残したまま頂点が増えます。
公式ガイドは、関節など大事な場所だけ手で頂点を置き、残りを Generate で埋める使い方を紹介しています。
編集モードの道具
| 道具 | 働き |
|---|---|
| Modify | 今ある頂点を動かす |
| Create | クリックで頂点を足す・ドラッグで辺を足す |
| Delete | クリックで頂点や辺を消す |
| Reset（編集モード内） | 頂点を全部消して、四隅の4つに戻す |
外周の辺は水色、自分で引いた内側の辺はオレンジ、自動で計算される辺は灰色の破線（「Triangles」をオンにすると見える）で表示されます。
頂点は少なめに
公式ガイドは、頂点は1つごとに毎フレーム計算がかかるので、数を最小限にするよう勧めています。
ウェイトがあると、影響するボーンの数だけ計算が増え、100頂点に2本のボーンなら200回の計算になると説明されています。
ウェイトを付ける
- Weights ビューを開き、メッシュを選ぶ
- 「Bind」を押して、結び付けるボーンをクリックする
- 「Bind」をもう一度押す（スペースキーか Esc でも抜けられる）
初めて結んだときは、ウェイトが自動で計算されます。
Bind は、メッシュを先に選んでも、ボーンを先に選んでもかまいません。
Weights ビューのボタン
| ボタン | 働き |
|---|---|
| Auto | ウェイトを計算し直す。頂点やボーンを選んでいれば、その分だけやり直す |
| Smooth | 選んだ頂点のウェイトを、隣の頂点と平均する。押すほど広がる |
| Prune | 小さいウェイトを消す。Bones で1頂点あたりの最大本数、Threshold で消す値を決める |
| Weld | 複数のメッシュのウェイトをそろえ、同じように変形させる |
| Swap | 一覧で選んだ2本のボーンのウェイトを入れ替える |
| Lock（錠前） | ほかのボーンを直しても、そのボーンのウェイトを変えない |
| Update bindings | 今の頂点の位置で、ボーンに結び直す |
Auto は、頂点とボーンの単純な距離ではなく、メッシュの形を考えて重みを付けます。
手で直したウェイトを残したまま一部だけやり直したいときは、その頂点だけ選んで Auto を押します。
Update bindings が要るとき
結んだあとにボーンを動かし、その状態でウェイトを直すと、頂点がずれることがあります。
「Update bindings」で今の位置に結び直すと、このずれを防げます。
ブラシで塗る
Weights tool で、頂点のウェイトを直接決めたり、ブラシで塗ったりできます。
| モード | 働き |
|---|---|
| Direct | 上下のドラッグか Weight のスライダーで、値を正確に決める |
| Brushes の Add | 選んだボーンのウェイトを足す |
| Brushes の Remove | 選んだボーンのウェイトを引く |
| Brushes の Replace | 決めた値にする |
ブラシの設定は、Strength（与える最大のウェイト）、Size（大きさ）、Feather（ウェイトが弱まっていく範囲）です。
ウェイトの割合は、「Pies」で頂点ごとの円グラフ、「Overlay」でボーンの色の塗り分けとして確かめられます。
デフォームキーは控えめに
メッシュの頂点の位置は、アニメーションのキー（デフォームキー）にもできます。
ただし公式は、変形はほぼウェイトで行い、デフォームキーは避けるか最小限にするよう勧めています。
Spine の最初の設定は、Spineの使い方で紹介しています。
2本のボーンで曲がり方を比較する
下の練習ZIPには、自作の透明背景画像mesh-practice-input.png（320×160）を入れています。
左側が青、右側が橙の帯で、画像の中央を関節の位置として使います。
これはSpineの出力画面ではなく練習用の入力データです。
元プロジェクトを複製し、画像を中央に置きます。
左側の中央から画像中央へ親ボーン、中央から右側の中央へ子ボーンを作ります。
メッシュは四隅に加え、中央の関節付近の上端・下端にも頂点を置き、2本へBindします。
Animateモードで子を曲げ、左端・関節・右端の動きを比較します。
まずAutoの結果を保存し、関節付近の頂点だけを選んでSmoothを試します。
元のAutoと、調整後の同じ角度を比べます。
| 症状 | 観察するもの | 次の操作 |
|---|---|---|
| 関節で帯が潰れる | 頂点位置と両ボーンのウェイト | 関節周辺の頂点だけを確認 |
| 片側が動かない | Bind対象とPiesの割合 | 意図したボーンの影響を確認 |
| Prune後に形が変わる | プレビューと除去本数 | 適用前の値へ戻して比較 |
| ウェイト変更で頂点がずれる | ボーン移動後のバインド位置 | Update bindingsが必要な状況かを確認 |
調整を戻すときの違い
Undoで直前の調整を戻すか、保存したAuto時点の複製へ戻します。
Edit MeshのResetは頂点を四隅へ戻す操作で、ウェイト調整の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「Meshes」「Weights」（2026年9月29日に確認）。
