Domain Warping

[Next.js #38] Interactive Storm on Sphere Planet — マウスで台風を錬成する Three.js / GLSL 実装

2026-03-14 | lain

Next.js / Three.js / GLSL で球体惑星の雲へ局所的な干渉を加え、マウス操作で巨大な台風を発生させるインタラクションを実装します。Raycasterで取得した球面座標をもとに、FBM雲・Curl Noise・接線方向の渦ベクトルを合成し、台風の目まで持つ気象表現へ発展させます。

カテゴリ： Next.js

タグ： #Next.js#Three.js#GLSL#Shader#Procedural#Noise#FBM#Curl Noise#Raycaster#Domain Warping

[Next.js #31] Touching Noise Field — Three.js × GLSLで“触れるノイズ場”を作る

2026-03-10 | lain

Three.jsとGLSLを使い、Raycasterで取得したマウス位置をもとに局所的なDomain Warpingを発生させる“触れるノイズ場”を実装。PlaneGeometry上の頂点変形と色設計を組み合わせ、鑑賞するノイズから体験するノイズへ発展させる。

カテゴリ： Next.js

タグ： #Next.js#Three.js#GLSL#Shader#Raycaster#Domain Warping#Noise#Interactive Art#WebGL

[Noise 入門 #30] 第3集完結 — 全てを束ねる「Procedural Universe」（プロシージャルな宇宙の錬成）

2026-03-09 | lain

第3集「Shader実践編」の最終回。これまでに学んだFBM、Domain Warping、極座標、GPGPUの全知識を統合し、ブラウザ上に100万の星々と星雲が渦巻く「プロシージャルな宇宙」をGLSLで錬成します。

カテゴリ： Procedural Shader

タグ： #Noise#GLSL#FBM#Domain Warping#GPGPU#Three.js#Generative Art

[Noise 入門 #06] Domain Warping — 座標をねじると世界が壊れる

2026-02-13 | lain

Domain Warping は“ノイズの入力座標そのものを歪ませる”技術。FBMと組み合わせることで、渦・煙・雲・ブラックホールのような自然構造を生み出せる。本記事では図解と数式で直感的に理解する。

カテゴリ： Procedural

タグ： #Noise#Domain Warping#FBM#Perlin#Shader#Three.js#WebGL

[Noise 入門 #51] 量子揺らぎ（Quantum Fluctuation）と空間崩壊

2026-03-30 | lain

Noise入門第6集【神領域】開幕。高周波な4D Simplex Noiseと極限の多重Domain Warpingを掛け合わせ、空間が沸騰し次元が歪む「量子揺らぎ」のエフェクトをGLSLで解剖・鑑賞します。