Joint SOP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

記事更新の通知はXでアナウンス٩(๑❛ᴗ❛๑)
→ @maru6o6をフォロー

概要 📖 – 円を繋いで関節を作る

Joint SOPは、入力された複数の円プリミティブ間に中間円を補間してジョイント形状を生成する SOPです。Smooth Path / Smooth Twist で連続的な変形を作り、Skin SOP との組み合わせで Bone 階層に追従するキャラクターリグの関節区間を構築できます。

主な用途 🎯

キャラクター用ジョイント形状の生成 (Bone 階層の関節区間ジオメトリ)
Skin SOP との連携でスキニング元ジオメトリを提供
複数の円プリミティブ間を滑らかに補間して連続変形
骨格デフォーメーション用のジオメトリ供給
Smooth Twist で X / Y 軸の整列を連続化した有機的関節形状

データフロー 🔄

入力: 2 つ以上の円プリミティブ
 ↓
Joint Page (Divisions / Orient Circles / Smooth Path / LR Scale 等の設定)
 ↓
出力: 中間円が補間されたジョイント形状

Tips

初心者の方は、以下日本語書籍も手元にあると安心です。

リンク

まる。

実際の案件事例まで踏み込んで紹介されていて、効率よくスキルアップするなら必携の二冊です！

パラメータ解説 ⚙️

Joint Page 🦴

グループ選択 🎯

Group .group 🔖
– Group (グループ) — 入力グループがある場合、ここで指定したグループ名のプリミティブだけに作用させる
– パターンマッチング (* や [1-10] 等) も使用可能

分割数と端の保持 🔢

Divisions .divs 📏
– Divisions (分割数) — 入力円のペアごとに挿入する中間円の本数を指定
– 値を増やすほど滑らかな補間が得られるが、ポイント数も増える

Preserve First Input .preserve1 🔚
– Preserve First Input (最初の入力を保持) — 入力された最初の円プリミティブを出力にそのまま残す
– オフにすると最初の円が中間補間に置き換えられる

Preserve Last Input .preserve2 🔚
– Preserve Last Input (最後の入力を保持) — 入力された最後の円プリミティブを出力にそのまま残す
– 端点が二重に重なる事態を避けたい場合はオフにする

形状制御オプション 🎛️

Orient Circles .orient 🧭
– Orient Circles (円の向き調整) — 入力円の法線が逆を向いている場合に自動で反転させ、短い側で接続するよう補正する
– オフにすると法線方向によっては「遠回り」した不自然な関節形状になる場合がある

Smooth Path .smoothpath 🌊
– Smooth Path (滑らかな経路) — オフだと中間円を直線補間、オンだと円の中心を通る区分的 Bezier 曲線上に配置
– 入力円が 3 つ以上で連続関節を作る際に必須

Smooth Twist .smoothtwist 🌀
– Smooth Twist (滑らかなねじれ) — 中間円の X / Y 軸の整列を区分的 Bezier で連続化する
– Smooth Path と併用することで多関節構造でもねじれが破綻しない

Align Major Axes .majoraxes 📐
– Align Major Axes (長軸を揃える) — 最初の円の最大軸と最後の円の最大軸を揃えるよう中間円を回転させる
– オフだと両端の X 軸同士を揃える挙動になる

Minimum Twist .mintwist ↩️
– Minimum Twist (最小ねじれ) — 中間円の回転がどちらの向きにも半回転を超えないよう制限する
– 骨格レイアウトには見た目が整うが、後段でスキニングする場合の連続性に注意

形状調整パラメータ 🔧

LR Scale .lrscale 🔁
– LR Scale (左右スケール) — Smooth Path で生成される曲線の形状を、L (左) / R (右) 側それぞれでスケールして変化させる
– 左右の概念については Align SOP の解説を参照

LR Offset .lroffset ↔️
– LR Offset (左右オフセット) — 入力円間の距離を上書きし、ジョイント全体の伸縮や非対称な形状を作る
– 大きな値を入れると関節区間が伸び、負値で逆方向へ食い込む

実践アイデア 💡

Example 1: 関節形状を表面化 🦾

Circle SOP × 2 → Merge SOP → Joint SOP → Skin SOP → Geometry COMP

2 つの Circle SOP で関節の両端断面を作り、Merge SOP で統合してから Joint SOP に流し、Skin SOP で表面メッシュ化する最小構成。キャラクターの肘や膝の関節区間プロトタイプとして使えます。

Circle SOP を 2 個配置し、Transform SOP で関節の両端位置 (例: 肩位置と肘位置) に移動
Merge SOP で 2 つの Circle SOP を 1 つの SOP に統合
Joint SOP に接続し Divisions を 5 程度に設定して中間円を生成
下流に Skin SOP を接続して表面メッシュ化
Geometry COMP に渡して Render TOP で確認

Example 2: 多関節を滑らかに 🌊

Circle SOP × 3 → Merge SOP → Joint SOP (Smooth Path=on, Smooth Twist=on) → Skin SOP

3 つ以上の Circle SOP を並べて指や脊椎のような多関節構造を作り、Smooth Path / Smooth Twist を有効にして Bezier 補間でつなぐ例。曲線的な関節を持つ生物的なキャラクターパーツに向きます。

Circle SOP を 3 個以上配置し、Transform SOP で関節ごとの位置と向きを設定
Merge SOP で全ての円を 1 つの SOP に統合
Joint SOP の Smooth Path と Smooth Twist をオンに設定
Divisions を増やして中間円の密度を上げる (例: 8)
Orient Circles をオンにして円の向きを自動補正
Skin SOP で表面化し、関節全体が滑らかに連結していることを確認

Example 3: 関節の形を調整 🔧

Circle SOP × 2 → Merge SOP → Joint SOP (LR Scale / LR Offset 調整) → Skin SOP

Joint SOP の LR Scale と LR Offset を変化させて、対称な円補間から左右非対称な「ひざ裏」「肘内側」のように膨らみを持つ関節形状を作る例。

基本構成 (Circle SOP × 2 → Merge SOP → Joint SOP) を組む
LR Offset を正方向に増やして関節区間を伸ばす
LR Scale の左右値を非対称に設定し片側だけ膨らませる
Orient Circles オフ時のみ Scale 値の符号 (正負) が効くため、必要に応じて切替
Skin SOP で表面化して左右非対称な関節シルエットを確認

Info CHOP情報 📊

Joint SOP は Info CHOP による詳細情報取得に対応しています。

ジオメトリ統計 📐

num_points: この SOP に含まれるポイント数
num_prims: この SOP に含まれるプリミティブ数
num_particles: この SOP に含まれるパーティクル数

GPU 転送タイミング 🎮

last_vbo_update_time: 別スレッドで SOP の CPU データを GPU 上のジオメトリデータに更新するのにかかった時間 (フレーム時間外)
last_meta_vbo_update_time: 別スレッドで metaball や NURBS のようなメタサーフェスジオメトリデータを GPU に更新するのにかかった時間 (フレーム時間外)

汎用オペレータ情報 🔄

total_cooks: プロセス開始以降にこのオペレータがクックされた合計回数
cook_time: 直近のクック所要時間 (ミリ秒)
cook_frame: このオペレータが最後にクックされたフレーム番号
warnings: このオペレータの警告数
errors: このオペレータのエラー数

クック統計 ⏱️

total_cooks: total_cooks — プロセス開始以降にこのオペレータがクックされた合計回数
cook_time: cook_time — 直近のクック所要時間 (ミリ秒)
cook_frame: cook_frame — このオペレータが最後にクックされたフレーム番号

トラブルシューティング ⚠️

よくある問題と解決策 🔧

❌ Problem: ジョイント形状が捻れる / 反転する
✅ Solution:

Orient Circles をオンにして円の法線方向を自動補正する
Align Major Axes をオンにして最初と最後の円の長軸を揃える
Minimum Twist をオンにして半回転を超えない補間に切り替える

❌ Problem: 中間の円が直線的すぎる / 角張る
✅ Solution:

Smooth Path をオンにして区分的 Bezier 曲線補間に切り替える
Smooth Twist をオンにして X / Y 軸の整列も連続化する
Divisions の値を増やして中間円の密度を上げる

❌ Problem: 関節形状が長すぎる / 短すぎる
✅ Solution:

LR Offset で円間の距離を上書きして関節区間の長さを調整
LR Scale で Smooth Path の曲線形状を左右に伸縮させる
入力 Circle SOP の位置を Transform SOP で見直す

❌ Problem: Skin SOP で表面化したときに端部が二重になる / 穴が空く
✅ Solution:

Preserve First Input / Preserve Last Input をオフにして入力円が二重にカウントされる事態を回避する
入力 Circle SOP の Order (頂点数) が全て同じになっているか確認する
Merge SOP での円の入力順がジョイントの並び順と一致しているか確認する

参考資料 📚

その他 🔗

公式リソース 📖

この記事はLLMと共に内容を執筆、更新しています。
最新バージョンとの項目差異など、情報の不一致を見つけた心優しい方はXもしくはInsta、メールなどよりサイト管理者までご連絡ください😎

まる。

お仕事のご依頼はDM又はメールにて。
━━━━━━━━━━━━━━━━━
Python/Touchdesigner/M5Stackをこよなく愛すフルスタックエンジニア。
専門は生理心理学、趣味はヨガやサウナ、EMS電気風呂などヘルスケア全般。
脳波や筋電、心拍を中心とした生体情報のセンシング＆インタラクティブアートづくりがライフワーク。

普段はワントゥーテンという会社で空間演出エンジニアをしています。
リファラル採用お繋ぎできますので、我こそはという尖った方は経歴と希望職種添えてDMください(エンジニア以外、営業職等もOK)。
ご飯行きましょう。

↓日常垢
Instagram：＠malmal0v0