Shader

2026-03-12 | lain

前回錬成したノイズの地形（球体）に「生命の息吹」を与えます。高さ（Height）と傾斜（Slope）に基づいて海や森、雪山を塗り分けるProcedural Biomeの実装と、フレネル反射を用いた大気（Atmosphere）のシミュレーション手法をGLSLで直感的に解説します。

タグ： #Noise#GLSL#WebGL#Math#3D

2026-03-09 | lain

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

カテゴリ： Procedural Shader

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

2026-03-06 | lain

Vertex Shaderでノイズ変形（Displacement）させた立体に、偏微分と外積を用いて「正しい法線」を再計算（捏造）し、破綻した光と影を取り戻す手法を解説します。

カテゴリ： Procedural Shader

タグ： #Noise#GLSL#Three.js#Math#3D

2026-03-02 | lain

Noise 入門シリーズ第23回。直交座標から極座標へ視点を移し、GLSLで「プロシージャルな魔法陣 / ノイズオーラ」を実装。数式の秩序と4Dノイズの混沌を融合させ、円環状の美しいエフェクトを錬成する手法を図解とコードで解説します。

カテゴリ： Procedural Shader

タグ： #Noise#GLSL#WebGL#Polar Coordinates#VFX

2026-01-27 | lain

VR・WebXR・Unity XR で必ず直面するシェーダーの落とし穴を30分で理解する最終回。ステレオレンダリング、透明の破綻、multipass、反射の罠、VR向け軽量化の原則を、Three.js と Unity 両対応で実戦的にまとめた。

タグ： #VR#WebXR#UnityXR#Shader#HLSL#GLSL

2026-01-26 | lain

シェーダー初心者が最短で“作品に使える表現”へ到達する回。sin波で水面、noiseで炎、depthで透明度、Fresnelで発光（リムライト）を、Three.js（GLSL）とUnity（URP/HLSL）で同じ発想のまま実装する。

タグ： #GLSL#HLSL#URP#Water#Noise#Fresnel#Depth

2026-01-25 | lain

Three.js（GLSL）と Unity（HLSL/ShaderLab）を“同じ地図”で理解する比較回。attribute/appdata、varying/v2f、時間、UV、法線、そして model/view/projection 行列対応表まで、移植できる頭を作る。

タグ： #GLSL#HLSL#ShaderLab#URP#Matrix#MVP#Varying#Interpolator

2026-01-24 | lain

Three.js の最小GLSLと同じ体験を Unity（ShaderLab + HLSL）で再現。URPで動く最小Unlitシェーダーを自作し、_Time で頂点波と色変化を確認する。

カテゴリ： Shader Unity

タグ： #HLSL#ShaderLab#URP#_Time#Unlit

2026-01-23 | lain

Three.js の RawShaderMaterial で、最小の Vertex/Fragment シェーダーを書き、頂点を揺らす・色を変えるといった“動かす体験”を通じて GLSL の基礎をつかむ回。

タグ： #GLSL#RawShaderMaterial#VertexShader#FragmentShader#Rendering

カテゴリ：Shader