![[Noise 入門 #52] チューリング・パターン（Reaction-Diffusion） — 数式が描く「生命の模様」](https://assets.lain-lab.com/images/uploads/noise-intro-52-reaction-diffusion.webp)
[Noise 入門 #52] チューリング・パターン（Reaction-Diffusion） — 数式が描く「生命の模様」
Perlin Noiseなどの静的な関数とは異なる、時間経過で成長するReaction-Diffusion（反応拡散系）のアルゴリズム。チューリング・パターンの仕組みと、Ping-Pongバッファを用いたGLSLでの実装概念を直感的にまとめます。
ARCHIVE_INDEX / PAGE_3
TOTAL_ITEMS: 574
![[Astro #04] レスポンシブの深淵と dvh による画面固定](https://assets.lain-lab.com/images/uploads/astro-04-responsive-dvh-fixes.webp)
[Astro #04] レスポンシブの深淵と dvh による画面固定
Astroへの移行中に直面した、モバイル環境特有の表示不具合（アドレスバーの影響や要素の重なり）に対する具体的なCSS解決策と構築のポイントをまとめました。
![[DIY] Logicool G304 ホイール逆走の「完全」修理ログ：物理清掃と接点復活剤の合わせ技](https://assets.lain-lab.com/images/uploads/diy-logicool-g304-wheel-repair-complete.webp)
[DIY] Logicool G304 ホイール逆走の「完全」修理ログ：物理清掃と接点復活剤の合わせ技
Logicool G304のスクロール逆走問題への再挑戦。前回のエアダスター清掃では不十分だった原因を突き止め、楽器用接点復活剤を使用した化学的洗浄による解決策を解説します。
![[Noise 入門 #51] 量子揺らぎ（Quantum Fluctuation）と空間崩壊](https://assets.lain-lab.com/images/uploads/noise-intro-51-quantum-fluctuation.webp)
[Noise 入門 #51] 量子揺らぎ（Quantum Fluctuation）と空間崩壊
Noise入門シリーズ第51回。実装から鑑賞へシフトする第6集スタート。物理法則を無視した再帰的な座標のねじれを用いて、未知のエネルギーの渦や空間崩壊のVFXをThree.jsとShaderで表現するロジックを解説します。
![[Next.js #56] Three.jsで創る無限の箱庭 — キツネと歩くプロシージャル・ワールド](https://assets.lain-lab.com/images/uploads/nextjs-56-infinite-procedural-world.webp)
[Next.js #56] Three.jsで創る無限の箱庭 — キツネと歩くプロシージャル・ワールド
Next.jsとThree.js、GLSL、Web Workersを駆使したプロシージャル生成世界の最終統合。TPSカメラの実装、キツネのGLTFモデルと歩行アニメーションの同期、ノイズベースの衝突判定の安定化手法を詳しく解説します。
![[Noise 入門 #50] 第5集完結 — 終わらない世界を歩く（Procedural Worldの統合）](https://assets.lain-lab.com/images/uploads/noise-intro-50-procedural-world-integration.webp)
[Noise 入門 #50] 第5集完結 — 終わらない世界を歩く（Procedural Worldの統合）
Noise入門シリーズ第50回。第5集「Procedural World編」の完結編として、個別に作成した生成アルゴリズムやShaderをすべて結合し、無限に広がるプロシージャルな箱庭を構築・探索する手法を解説します。
![[Astro #03] Pagefind検索と動的目次（TOC）の実装](https://assets.lain-lab.com/images/uploads/astro-03-toc-pagefind-implementation.webp)
[Astro #03] Pagefind検索と動的目次（TOC）の実装
HugoからAstroへの移行最終局面。全記事のビルドエラーを解消し、クライアントサイド検索と自動目次生成機能を導入した開発記録。
![[Next.js #55] Boids × Flow Field — 10万の鳥が「狂気の空」を舞う](https://assets.lain-lab.com/images/uploads/nextjs-55-procedural-boids-flow-field.webp)
[Next.js #55] Boids × Flow Field — 10万の鳥が「狂気の空」を舞う
穏やかな群れを作るはずが、完成したのは「ドラッグ オン ドラグーン」のような絶望の空でした。GPUの限界に挑む10万羽の描画、翼のしなり（Whip）の数式、そしてGLBモデル本来のテクスチャカラーを維持するシェーダーハックをまとめます。
![[Noise 入門 #49] Boids × Flow Field — 風に乗る「鳥の群れ」を空に放つ](https://assets.lain-lab.com/images/uploads/noise-intro-49-boids-flow-field.webp)
[Noise 入門 #49] Boids × Flow Field — 風に乗る「鳥の群れ」を空に放つ
空間を漂う生命の自律性を定義する「Boids」と、環境の物理的なうねりである「Flow Field（Curl Noise）」を融合。Three.jsとGLSLを用いて、風に流されながらも群れをなして舞う鳥たちを実装するプロシージャルな生態系構築の手法を解説します。
![[Astro #02] 530件の記事移行とトラブル対処：カテゴリー統合とMDXエラー](https://assets.lain-lab.com/images/uploads/astro-02-category-mdx-refinement.webp)
[Astro #02] 530件の記事移行とトラブル対処：カテゴリー統合とMDXエラー
532件の全アーカイブをAstroへ最適化。カテゴリー統合、波括弧のエスケープ、そしてUIのレスポンシブ調整までの全工程。
![[Next.js #54] Procedural Wind & Flow — Three.jsで草木を揺らし、雲を流す実装](https://assets.lain-lab.com/images/uploads/nextjs-54-procedural-wind-flow.webp)
[Next.js #54] Procedural Wind & Flow — Three.jsで草木を揺らし、雲を流す実装
Next.jsとThree.jsを用いたプロシージャルワールド開発。FBMノイズを利用した風のベクトル場を生成し、頂点シェーダーで10万本の植物と雲を動かすVFXテクニックの全貌を解説します。
![[Noise 入門 #48] Wind & Flow — 風向ノイズで草木を揺らす](https://assets.lain-lab.com/images/uploads/noise-intro-48-wind-flow-vertex-shader.webp)
[Noise 入門 #48] Wind & Flow — 風向ノイズで草木を揺らす
InstancedMeshで配置された大量の草木に対し、GLSLのVertex Shaderとノイズ関数を用いて自然な風の揺らぎ（Wind & Flow）を実装する手法。Three.jsのonBeforeCompileを活用したプロシージャルなアニメーションの基礎を直感的に学びます。