[Next.js #11] FBM地形を削って“動く湖”を作る:反射・雲ドーム・水シェーダーの完全統合
2026-02-10 | lain
FBMノイズで生成した地形を“くぼませて湖を作る”実装を解説。水面のFBM波シェーダー、雲ドーム、Reflector鏡面エフェクト、プレイヤー移動まで統合した“ひとつの世界”をR3Fで構築する。
「AIと人が、共に学び、創る場所」
学びと再出発の旅路へ。
2026-02-10 | lain
FBMノイズで生成した地形を“くぼませて湖を作る”実装を解説。水面のFBM波シェーダー、雲ドーム、Reflector鏡面エフェクト、プレイヤー移動まで統合した“ひとつの世界”をR3Fで構築する。
2026-02-10 | lain
Perlin・Simplex・FBM すべてに共通する“ノイズの設計パラメータ”を体系的に理解する回。周波数・振幅・オクターブ・ラキュナリティ・ゲインの5要素を押さえることで、ノイズの世界が一気に読み解けるようになる。
2026-02-09 | lain
Perlin・Simplex に共通する“ノイズの根本数学”。グリッド、勾配ベクトル、内積、補間、frequency・amplitude の基礎を徹底的に整理する回。
2026-02-09 | lain
R3F × GLSL で FBM ノイズを使った “動く雲の SkyDome” を実装し、地形に続いて空を生成する方法を解説します。
2026-02-08 | lain
R3F(React Three Fiber) 上で FBM ノイズ地形を生成し、Raycaster で地面の高さを取得してプレイヤーを自然に追従させる。地形生成(頂点Z変形・法線再計算・標高カラー)から、WASD移動+atan2回転、hit安全処理とLERP補間までを最小構成でまとめる。
2026-02-08 | lain
ゲーム開発・CG制作で使われる“ノイズ”の正体を、ランダムとの違いから基礎レベルで理解する。Perlin/Simplex 以前に知るべき核となる概念を解説。
2026-02-08 | lain
VRM・BVH・PMX を Next.js(App Router) + React Three Fiber で扱う際の互換性、使用すべきバージョン、正しいローダー構成、そして避けるべき組み合わせを整理する技術ドキュメント。
2026-02-07 | lain
Three.jsを理解している前提で、R3FでglTF/VRMを扱うための本質だけをまとめる。Three.jsとR3Fの思想の違い、glTF読込みの仕組み、VRM特有の落とし穴、モデルビューアー設計の基礎を効率的に整理する。
2026-02-06 | lain
Next.js で DOM・2D Canvas・3D Canvas(R3F)を3層構造で扱うための設計パターンを解説します。ゲームUIやインタラクティブな Web 表現に必須となる多段キャンバス構造の実装方法をまとめました。