[Next.js #19] Next.js + R3F: 初心に帰るシャドウマップ実装とLevaでのパラメータ可視化
2026-02-17 | lain
影が出ない・切れるといった「あるある」を防ぐために。Levaを使ってDirectional LightのShadow Camera範囲を可視化し、最適な設定を探るプロセスをまとめました。
「AIと人が、共に学び、創る場所」
学びと再出発の旅路へ。
2026-02-17 | lain
影が出ない・切れるといった「あるある」を防ぐために。Levaを使ってDirectional LightのShadow Camera範囲を可視化し、最適な設定を探るプロセスをまとめました。
2026-02-17 | lain
Noise 入門シリーズ第10回。空(雲)から視点を地上へ戻し、ノイズを用いて3Dの地形(Terrain)を生成します。ハイトマップの原理、Ridge Noiseによる山脈の形成、そしてバイオームによる色付けまでを解説。
2026-02-17 | lain
WebGPU環境でMMD(PMX)を動かそうとして沼にハマり、最適化フォーマット「BPMX」と「無限ループバグ」を攻略して15秒の壁を突破するまでの技術ログ。
2026-02-17 | lain
最新のWebGPU対応を見据えたBabylon.js開発環境をVite + TypeScriptで構築し、最初の3Dシーンを表示するまでの完全ガイド。
2026-02-16 | lain
Next.js + R3F 実装連載第18回。Three.js公式のWaterシェーダーによる海面表現と、レイマーチングを用いたボリューメトリックな雲を組み合わせ、リアルな自然環境を構築します。
2026-02-16 | lain
平面(Surface)の世界から体積(Volume)の世界へ。これまでの知識(FBM、Warping、Curl)を総動員し、レイマーチングを用いて「中に入って飛べる雲」を数学的に彫り出す方法を解説します。
2026-02-15 | lain
ノイズは単なる「ザラザラした模様」ではない。適切な数学(Curl演算子)を通すことで、それは「流体」へと進化する。重たい物理演算を使わずに、煙や水流のような「圧縮されない滑らかな動き」を作る Curl Noise のアルゴリズムと実装を解説。
2026-02-15 | lain
配列データの管理から物理ベースの設計へ。R3Fでドラッグ操作、角丸の高級マテリアル、そして動的なグループ化を用いたルービックキューブの実装プロセスを解説します。
2026-02-14 | lain
React Three Fiberで複数のGLTFモデルを横スライド切替できる3Dビューアを実装。モデルの自動センタリング、スケール正規化、Box3による接地処理、lerpによるスムーズ移動、ドラッグ操作の仕組みまで整理する。