この記事では、RaymarchingとGLSLシェーダーを使って3Dシーンを作成する方法を詳細に説明します。レイマーチングと符号付き距離関数（SDF）といった基本的な概念から始まり、単純な形状の作成、SDF演算子（minやsmoothminなど）を用いた形状の組み合わせによる複雑なシーンの作成方法を段階的に解説します。照明モデル、ソフトシャドウ、無限に繰り返すシーンの作成、ノイズ導関数を使ったリアルな地形の生成といった高度なトピックも網羅しています。最後に、無限に広がる火星風景という素晴らしい例を通して、著者の創作過程と洞察を共有します。
続きを読む
この記事では、ポストプロセッシングとボリュームレイマーチングを組み合わせることで、React Three Fiberでリアルなボリュームライティング効果を作成する方法を詳しく説明します。著者によって、座標系の変換、スクリーン空間からの3Dレイの再構築、パフォーマンス最適化のための深度バッファの使用方法が綿密に解説されています。SDFを使用した光のシェーピング、シャドウマッピング、光の散乱などの高度なテクニックも網羅されており、影と霧の効果を持つダイナミックなボリュームライティング効果が実現します。アーチや宇宙空間のシーンなど、複数のデモでこのテクニックが紹介され、マルチライトソースや全方向シャドウイングについても探求されています。
続きを読む
この記事では、著者が2024年にシェーダー技術を学び、ポストプロセス処理に適用した経験について詳しく説明しています。@samdapeや@hahajohnxなどのアーティストの作品にインスピレーションを得て、複雑なピクセルパターン、錯視効果、インタラクティブなポストプロセス効果を作成しました。記事では、ピクセル化、SDFと閾値行列を使用したパターンの作成、LEDパネル、織物、レゴブロック、フロストガラスなどの効果を実現する技術の詳細を説明し、コードスニペットとデモを提供しています。
続きを読む
著者は数ヶ月かけて個人ウェブサイトを構築し、シェーダーとWebGLのスキルを披露するために3D作品を取り入れました。この記事では、3Dシーンの視覚効果を高める上でポストプロセッシングが果たす重要な役割、特にレトロな効果の作成に焦点を当てて深く掘り下げています。様々なディザリング技術（ホワイトノイズ、オーダード、ブルノイズ）を網羅し、シェーダーを使った実装方法を説明しています。さらに、カスタムパレットを可能にするカラー量子化技術についても詳細に説明しています。記事は、ピクセル化とCRTモニターのエミュレーションを組み合わせた、見事なレトロな3Dウェブサイト効果で締めくくられています。
続きを読む