5
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

TouchDesigner Vol.063 Intro to POPs ─ 映えるビジュアルづくり with TsumikiRoom のメモ書き

Last updated at Posted at 2025-08-22

cover-bJW05o9p75A1lNrrqsy5tsHaEUYldp3J.png

はじめに

この記事は2025年8月23日に配信されるTDSWのワークショップ用のメモです
配信はこちらでご覧になれます
プロジェクトファイルは → こちら
スクリーンショット 2025-08-22 191857.png
まずはプロジェクトファイルを開きましょう!
20250823_TDSW.toeを開くとこんなかんじ
スクリーンショット 2025-08-22 192125.png
いちばん上にひとつだけある00_Basic(COMP)はPOPsの基礎を学ぶためのネットワークです
下にずらっと並んでいるCOMPは作例です

00_Basic

00_Basic(COMP)を開きます
スクリーンショット 2025-08-22 192828.png
作例に入る前にここで基礎に触れておきましょう

Swizzling

スクリーンショット 2025-08-22 193133.png
Attirbuteを指定するときの書き方がいろいろあります
Math(POP)Output Attribute Scope を見るとそれぞれ書き方が違いますが、どれもTexのAttributeをColorにコピーしていて全く同じ結果になっています

  • Color.rgb
  • Color.i012
  • Color(0) Color(1) Color(2)
  • Color(0,1,2)

単に書き方が違うだけですべて一緒です

Attribute Class(point,vertex,primitive)

スクリーンショット 2025-08-22 194603.png
POPsやSOPsを触っていると Attribute Class(アトリビュートクラス) という言葉がよく出てきます。これは 「どの単位にアトリビュートを持たせるか」を示す概念 です。

  • Point = 各パーティクルごと
    例: 位置 (P)、法線 (N)、カラー (Color)

  • Vertex = 各頂点ごと(面に依存)
    例: UV座標 (Tex)

  • Primitive = 面や線ごと

ちなみに、POPsを触るときはほぼPoint Classが基本 で、UVやテクスチャ絡みで Vertex Class が出てくるくらいです

SOPだとPrimitiveとDetailもよく登場しますね

Primitive Type(Point,Line,Line Strip,Tryangle,Quad)

image.png

Primitive Type とは

「この点の集合をどう解釈して描画するか?」というルールがあります。

このルールが Primitive Type です。

つまり、

  • 点を集めて三角形にするのか?
  • 線にするのか?
  • それとも点のまま描くのか?

といった 描画方法の指定 みたいなものです。

右のDATのtype列をみるとSphereがいくつかのPrimitive Typeで構成されていることがわかります

Primitive Type の代表例

  • triangle / quad = 面を表すプリミティブ
  • linestrip = 線を表すプリミティブ
  • point = 点を表すプリミティブ

Common Attribute(P,N,Tex,Color)

image.png
POPsで最もよく登場するのが以下のアトリビュートです。
パーティクルやジオメトリの基本を扱うときに必ず目にします。

  • P = 位置
  • N = 法線
  • Tex = UV座標
  • Color = 色

Common Attribute(LineWidth,PointScale)

image.png
表示サイズを変えるAttributeです

  • LineWidth = 線の太さ
    → Line Primitive を描画するときの太さを制御する

  • PointScale = 点のサイズ
    → Point Primitiveを描画するときの大きさを制御する

これらは ジオメトリ自体の形を変えるわけではなく、描画時の見た目を調整するための属性 です。
パーティクルを大きく見せたい/線を太く見せたいときに使われます。

Common Attribute(Particle)

image.png

パーティクル固有のAttributeです

Particle POP を使うと、自動的に「パーティクル固有のアトリビュート」が生成されます。
これらはパーティクルの寿命・個体識別・物理挙動などに関わる基本情報です。
image.png

  • PartAge
    パーティクルが生成されてからの経過時間(秒)

  • PartLifeSpan
    そのパーティクルが存在できる合計時間(秒)
    PartAge / PartLifeSpan で寿命の進行度を計算できる

  • PartId
    各パーティクルに割り当てられる一意のID(ユニーク番号)
    → ランダム処理や個別追跡に利用可能

  • PartDrag
    減速率(空気抵抗のような効果)

  • PartMass
    質量
    外力や加速度の計算に影響する

  • PartForce (0/1/2)
    外力ベクトル
    そのフレームで「どんな力が加わったか」を一時的に持つ属性

  • PartVel (0/1/2)
    パーティクルの速度ベクトル
    パーティクルが「現在どんな速さで動いているか」を持つ属性

Creating new Custom Attributes

image.png
POPsには標準で P(位置)や Color(色)など多くのアトリビュートが用意されています。
しかし、演出や制御の幅を広げたいときには 自分で新しいアトリビュートを作る ことができます。

  • Attribute POP = 新しい属性を定義して固定値を与えるもっとも基本的でシンプルな方法
  • Math POP = Math POP に限らず Output Attribute Scope を持っているPOPならどれでもカスタムAttributeを生成できる
    POPの処理結果をどのAttributeに保存するかを Output Attribute Scopeで指定する
  • Math Mix POP = 既存の属性を計算して結果を Result Scope に保存する
  • Math Combine POP = Newタブで新しいAttributeを生成する
  • Field POP = 指定した範囲からの値をWeight Output Attributeで指定したAttributeに渡す

Copy

image.png
Copy POP は、任意のジオメトリを ポイントに複製して配置する ノードです。

基本の仕組み

  • 1つ目の入力 = コピーする形(ジオメトリなど)
  • 2つ目の入力 = コピー先のポイント情報(P, N, Color などのアトリビュートを渡す)
  • 出力 = 各ポイントごとにジオメトリが複製された状態

ただし、Copy POPは 2つ目の入力に流したからといって勝手に全部のAttributeが引き継がれるわけじゃありません
Copy POPTemplateタブとTemplate Attributeタブで指定しないとそのAttributeは反映されないので注意!

Lookup Channel/Texture

image.png
Lookup 系のPOPは、外部のCHOPやTOPの値を参照してPOPのAttributeに渡す ためのOPです。

Lookup Texture POP

  • TOP(画像)のピクセルを参照してPOPアトリビュートにマッピングする

Lookup Channel POP

  • CHOPチャンネルの値をPOPアトリビュートにマッピングする

Generators

image.png
POPを動かすには、まず発生源として「元になるジオメトリ(点群やライン)」が必要です。
その一番シンプルな方法が Generators 系 POP を使うことです。
特によく使うものをいくつかピックアップしました。

主なGenerators

  • Grid POP
    → 格子状の点群を生成

  • PointGen POP
    → 球や立方体などに一様分布したポイントを生成

  • Sprinkle POP
    → 入力ジオメトリの中にランダムで点をばらまく

  • Point POP
    → 指定した数だけ単純な「点」を生成する

  • PointFileIn POP
    → 外部ファイル(例: .ply, .xyz)から点群を読み込む

特徴

  • POPネットワークの出発点として「空間に点を置く」役割
  • SOPから持ち込む代わりに、POP内で直接ジオメトリを作れる
  • 粒子表現だけでなく、ラインやメッシュの骨組みを作ることも可能

to POP

image.png
Generators 系が「POP内で新しくポイントやラインを生成する」のに対して、
to POP 系は「外部データをPOPのポイントとして取り込む」ためのOP です。

  • TOP to POP
    → 画像のピクセルをPOPに変換(例: 映像を点群にする)
  • CHOP to POP
    → CHOPのチャンネルをPOPに変換(例: オーディオ波形をLine Stripにする)

Generators系との違い

  • Generators 系 = POPの中で直接「点やラインを生成」する(空間に素を置く)
  • to POP 系 = SOP/TOP/CHOPなど「外から来たデータをPOPに変換」する

POPだけで完結できる

TouchDesignerでは SOP を使ってジオメトリを作り、それを POP に流し込むこともできます。
ただし、実際には POPの Generators 系 や to POP 系 を使えば、SOPを経由せずに直接ポイント群を用意できる 場面が多いです。

作例のメモ書き

ここで力尽きたので残りは本当にメモ書きだけ残しておきます
あとで再編集して更新予定です

01_TOPtoPOP

  • 3つあるけど基本的に同じ方式で作っている
  • MovieをTOPtoPOPで変換している
  • RotのAttributeを正しく指定してCopyに渡してTemplateタブで継承する

02_Banana

  • 01_TOPtoPOPの読み込み部分を MovieFileInTOP から PointFileInPOP に変えているだけ
  • Point数のリサンプルは Delete POP で行う
  • Quantize POP で座標のレイアウトを揃える

03_Earth

  • Lookup Texture POPでTOPの画像を読み込み、Tex(UVマッピング)でSphereに色付け
  • Transform POPで回転させ、Trail POPで線を引く(重くなりがちなので Point数・Trail Length・Trail Increment に注意)
  • Line Metrics POP の Line Strip タブ → Distance from End Normalized にチェック → DistEndNorm というAttributeを作成
  • Math Combine POPで DistEndNorm を使い、線が終点に行くほど細くなるように設定

04_ScanLine

  • TOPを使って動画をRGBに分け、それぞれのカラーのLine Stripを作る
  • 各色の濃淡を LineWidth にコピーしつつ、各色で Line Strip を塗りつぶす
  • Line MATでレンダリングすると Line の太さで濃淡が表現される

05_3Dnoise

  • Noise POP の Outputタブ → Noise で PointScale を指定すると新規Attributeとして追加される
  • Limit POPで PointScale を ZigZag にする
  • POPtoTOP の POP Dimension で確認すると、輪切りになった3Dテクスチャができて面白い
  • Lookup Texture POPで PointScale をもとに色を指定

06_Convert

  • TOPでHeightMap的なものを作る
  • HeightMapを Lookup Texture POP で Grid POP に高さとして渡す
  • Quad / Line Strip / Rectangle のコピー3種類で描画

07_Field_color

  • Gridで配列されたポイントに対して 0〜3 までのランダムな値のAttributeを設定
  • Randomを Quantize → Round で 0,1,2,3 の int にする
  • Attribute POPで Rot と PointScale を設定(値はすべて0)
  • P / Rot / PointScale にそれぞれ Noise を設定
  • Random Attribute ごとにポイントを分け、それぞれ別の形状をコピー
  • Field POPで色を指定して塗り分け

08_Field_scale

  • attribute_Color_PointScale で Color と PointScale を作り、ノイズで動く Field POP を作る
  • Copy後に Noise POPで Noise というPoint Attributeを作る
  • Noise と P を足して、Noiseでポイント全体がうねるようにする
  • その際 Noise と Weight を掛け算し、Weight が大きいところほど強く歪むようにする

09_Field_sphere

  • ColoID(int) の領域で色のIDを設定
  • Field と P を掛け算することで、パーティクルを球の表面にとどめている

これ、本当はcross productで作ろうと思ったんですが、掛けただけでそれっぽくなってしまったのでそのままにしました
Weightの外に移動しようとするポイントが掛け算で無効化されつつ、PartVelで移動するので結果的に境界線周辺にとどまっているようです
内側に向かう引力が働いていますが、Weightが中央から外へラープしているので中心点以外では急激に減衰してしまい境界線付近にとどまってしまっています
予想した挙動ではないけれど、TouchDesignerだとまぁこういうこともたまに起こるよね、という例として残しました

5
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?