シェーダーSFワールド

リアルタイム・レイマーチングをライブで検証する構成の、シェーダー主体のSFランディングページを作成します。このページではテクスチャ、メッシュ、アセットを一切使わず、4つの宇宙シーンをすべてフラグメントシェーダーの数式で計算し、訪問者のスクロールに合わせて連続的にクロスフェードさせます。シーン1「特異点」では、降着円盤を伴うブラックホールを描きます。測地線に沿って光を約200ステップ積分することで、円盤の遠側が上部へ回り込み、相対論的ドップラービーミングによって片側が明るく見えるようにします。シーン2「星雲」では、4オクターブのfBm密度場を、手前から奥へ向かう約44回の単一散乱サンプルで照らします。シーン3「潮汐」では、8オクターブの干渉波からなる海面ハイトフィールドを二分法で求め、32層のオーロラ空をフレネル反射させます。シーン4「ファーストライト」では、リッジド・マルチフラクタル地形を夜明けの地平線まで球面トレーシングします。各章には詩的な見出しを1つと、技術パラメータの短いリスト（サンプル数、積分ステップ）を組み合わせます。左側のレールでは進行状況の塗りつぶしで章を追跡し、隅のHUDには現在のシーン、レンダーバッファ、フレームレート、スクロール量を表示します。上部バーには「WebGPU · リアルタイム」と表示します。等幅書体、黒白を基調にオレンジを1色だけアクセントにした配色、フィルムグレインのオーバーレイを採用します。スクロール連動のトランジションは、WebGPU対応ブラウザで実際に滑らかに動作する必要があります。 スクロール連動のクロスフェード構造は維持したまま、4つの宇宙を春夏秋冬の森に置き換えます。季節ごとに固有の配色とパーティクル（花びら、ホタル、落ち葉、雪）を設定し、コピーも自然をテーマに書き換えます。 

リアルタイム・レイマーチングをライブで検証する構成の、シェーダー主体のSFランディングページを作成します。このページではテクスチャ、メッシュ、アセットを一切使わず、4つの宇宙シーンをすべてフラグメントシェーダーの数式で計算し、訪問者のスクロールに合わせて連続的にクロスフェードさせます。シーン1「特異点」では、降着円盤を伴うブラックホールを描きます。測地線に沿って光を約200ステップ積分することで、円盤の遠側が上部へ回り込み、相対論的ドップラービーミングによって片側が明るく見えるようにします。シーン2「星雲」では、4オクターブのfBm密度場を、手前から奥へ向かう約44回の単一散乱サンプルで照らします。シーン3「潮汐」では、8オクターブの干渉波からなる海面ハイトフィールドを二分法で求め、32層のオーロラ空をフレネル反射させます。シーン4「ファーストライト」では、リッジド・マルチフラクタル地形を夜明けの地平線まで球面トレーシングします。各章には詩的な見出しを1つと、技術パラメータの短いリスト（サンプル数、積分ステップ）を組み合わせます。左側のレールでは進行状況の塗りつぶしで章を追跡し、隅のHUDには現在のシーン、レンダーバッファ、フレームレート、スクロール量を表示します。上部バーには「WebGPU · リアルタイム」と表示します。等幅書体、黒白を基調にオレンジを1色だけアクセントにした配色、フィルムグレインのオーバーレイを採用します。スクロール連動のトランジションは、WebGPU対応ブラウザで実際に滑らかに動作する必要があります。 モバイル向けのパフォーマンス最適化を追加します。幅が768px未満の場合はパーティクル数とレンダリング解像度を下げ、最も負荷の高いボリューメトリックライティングを無効にします。また、訪問者が自分で切り替えられる「高パフォーマンスモード」のトグルを表示します。