![[Astro #69] WebXRにおける全方位暗転制御と法線スロープフィルタによるホバリング物理の実装](https://assets.lain-lab.com/images/uploads/astro-69-webxr-sphere-fade-and-slope-filter-hover-physics.webp)
[Astro #69] WebXRにおける全方位暗転制御と法線スロープフィルタによるホバリング物理の実装
WebXR環境におけるNearプレーンカリングとリグ移動に伴う暗転漏れの不具合を内側描画の真球オブジェクトへの置換で解決。さらに移動速度向上に伴う地形起伏でのスタック問題をポリゴン法線を利用したスロープフィルタで解消し、バトルUIの動的拡張と敵の特殊攻撃パラメータの実装を行いました。
ARCHIVE_INDEX / PAGE_1
TOTAL_ITEMS: 648
![[Astro #68] VRコントローラー全ボタン実装・連打防止・マジックバーストエフェクト](https://assets.lain-lab.com/images/uploads/astro-68-vr-controller-rising-edge-and-magic-burst.webp)
[Astro #68] VRコントローラー全ボタン実装・連打防止・マジックバーストエフェクト
VRコントローラーの全ボタン実装、Rising Edge連打防止、吹き出しVR安定化、マジックバーストエフェクトの追加。
![[Astro #67] ステータス画面・Magic.json化・箒モード・ヒールエフェクト一気に実装](https://assets.lain-lab.com/images/uploads/astro-67-status-menu-magic-json-and-broom-mode.webp)
[Astro #67] ステータス画面・Magic.json化・箒モード・ヒールエフェクト一気に実装
ADV/RPGにステータス画面、魔法システムのJSON化、箒に乗る高速移動モード、ヒール魔法のパーティクルエフェクトを実装。
![[Astro #66] ADVManager大規模リファクタリング & IndexedDB全アセットキャッシュ化](https://assets.lain-lab.com/images/uploads/astro-66-advmanager-refactor-and-indexeddb-cache.webp)
[Astro #66] ADVManager大規模リファクタリング & IndexedDB全アセットキャッシュ化
Three.js + WebXR + VRMでADV/RPGを開発する4日目。ADVManager.tsxの責務分離（バトル/セーブを独立コンポーネント化）、ベッドや坂道などのコリジョン関連の積み残しバグを一気に解決、IndexedDBを活用した全アセットキャッシュ化で初回起動以降は無通信動作を実現。AIとのバイブコーディングで30件超の改修を完遂した1日。
![[Astro #65] セーブ・回復システムの完全隔離とVRMアセットのVRAM解放プロトコル](https://assets.lain-lab.com/images/uploads/astro-65-threejs-webxr-save-heal-system-vram-dispose.webp)
[Astro #65] セーブ・回復システムの完全隔離とVRMアセットのVRAM解放プロトコル
React Three FiberおよびWebXR環境において、探索フェーズへのセーブ・回復システムの統合プロセスを解説。useFrame内の進入ガードによるカメラ位置崩壊の防衛、DOMに依存しないRef直結型の決定処理、そしてVRMアセットのdeepDisposeによるキャッシュクリアとHMD位置に同期するY軸ビルボードの実装について記述しています。
![[Astro #64] WebXR Gamepad APIによるVR入力の最適化とJRPGタイムラインにおけるステート・デトックス](https://assets.lain-lab.com/images/uploads/astro-64-webxr-gamepad-vr-input-jrpg-timeline-state-detox.webp)
[Astro #64] WebXR Gamepad APIによるVR入力の最適化とJRPGタイムラインにおけるステート・デトックス
R3F環境下のJRPGバトルシステムにおいて、非同期タイムラインの隙間に生じるステートバグをフラグ制御で一掃。WebXRによるVRコントローラー入力のチャタリング除去ロジックや、マテリアルの加算ブレンディングを用いた画像駆動魔法陣インジェクションなど、コンソールゲーム基準のUI/UX最適化プロトコルを解説します。
React Three Fiberとデータ駆動による3D-ADVシステムの設計と実装仕様
React Three Fiber（R3F）およびThree.jsを用いた3Dアドベンチャー（ADV）探索システムの設計仕様書。ステージ構成、プレイヤー能力値、アバター設定をすべて独立したJSONデータで定義する「データ駆動型設計」を軸に、コンポーネントの責務分離、チラつき（Zファイティング）対策、ピュア3Dによる画面フェード、2次元距離計算に基づく近接吹き出し制御、VRMアニメーション初期化ガード句の実装詳細まで網羅します。
![[Astro #62] Three.js/R3Fで作るVR対応3Dパズルゲームの完成と極限の最適化ハック](https://assets.lain-lab.com/images/uploads/astro-62-r3f-puzzle-game-complete-optimization.webp)
[Astro #62] Three.js/R3Fで作るVR対応3Dパズルゲームの完成と極限の最適化ハック
React Three Fiberを用いたVRパズルゲーム開発の最終フェーズ。コンポーネント自律型のメモリ解放処理や、JSONデータ駆動による動的クレジットスクロール、VR空間での複数VRM配置における軽量化ハックについて解説します。
![[Astro #61] Three.js ぷよぷよ風パズルゲームの実装とReact key地獄](https://assets.lain-lab.com/images/uploads/astro-61-r3f-puzzle-game-noise-block-bug.webp)
[Astro #61] Three.js ぷよぷよ風パズルゲームの実装とReact key地獄
React + Three.jsでぷよぷよ風パズルゲームを実装。お邪魔ブロック（ノイズ）追加後に発生した描画バグの原因を徹底調査。key props、ジオメトリ再利用、グリッドデータのデバッグ手法まで。
![[Astro #60] R3FによるSTGエンディングプロトコルの構築 〜パーティクル収束・クレジットスクロール・接続切断演出の全実装〜](https://assets.lain-lab.com/images/uploads/astro-60-r3f-stg-ending-credit-protocol.webp)
[Astro #60] R3FによるSTGエンディングプロトコルの構築 〜パーティクル収束・クレジットスクロール・接続切断演出の全実装〜
React Three Fiberを用いてSTGのエンディング演出を1から設計・実装した記録。800個のパーティクルが中心へ収束し続けるループアニメーション、R3F上のクレジットスクロール、接続切断（発散）演出、感謝テキストのフェードイン/アウトまで、フェーズ管理と頂点カラー制御を組み合わせたプロトコルの全記録。
![[Astro #59] WebXRにおける入力同期プロトコルのクレンジング 〜量子爆発ボムの実装と多重トランスフォーム競合の完全遮断〜](https://assets.lain-lab.com/images/uploads/astro-59-webxr-input-synchronization-cleansing-bomb-protocol.webp)
[Astro #59] WebXRにおける入力同期プロトコルのクレンジング 〜量子爆発ボムの実装と多重トランスフォーム競合の完全遮断〜
React Three FiberとWebXRを用いた3Dシューティングゲームにおいて、上流のScene、Manager、下流のController間で発生したフラグ競合を解消し、アバター追従型のミニマルHUDと3回制限ボムを完全同期させたリファクタリングの記録。
![[Astro #58] IndexedDBを活用した外部VRMモデルの永続キャッシュと無限クローゼット化の構築](https://assets.lain-lab.com/images/uploads/astro-58-indexeddb-vrm-persistent-cache-closet.webp)
[Astro #58] IndexedDBを活用した外部VRMモデルの永続キャッシュと無限クローゼット化の構築
一時的なBlob URLの死活問題を解決するため、外部からロードしたVRMのバイナリをIndexedDBに直接トラップ。静的なJSONリストとDB内の動的レコードをシームレスに結合し、外部アセットを無限に追加・呼び出し可能にするパイプラインハッキングの記録です。