holodepth

Three.js · Işık ve materyaller · Ortam

Environment & HDRI: sahnenin dolaylı ışık mühendisliği

Gerçekçilik yalnızca sahneye koyduğun ışık objelerinden değil; çevreden gelen yansıma ve dolaylı aydınlatmadan da üretilir.

Modern 3B web sahnelerinde ortam haritası (environment) ve HDRI, objelerin sahne ile fiziksel bir bağ kurmasını sağlar; “havada asılı” hissini azaltır, PBR materyallerin doğru çalışması için sıklıkla şart sayılır.

Bağlam: Işığın doğası, Materyal girişi, Gölge performansı, Doku temelleri (bir sonraki modül adımı).

HDRI ve IBL (Image Based Lighting)

HDRI (High Dynamic Range Imaging), klasik bir JPEG/PNG dokusundan farklı olarak parlaklık bilgisini geniş bir aralıkta taşır.

Doğrudan ışık değildir

HDRI, tek başına doğrudan (direct) bir ışık kaynağı değildir. Sahneye IBL üzerinden şunları taşır:

  • Dolaylı aydınlatma (ortam / ambiyans)
  • Yansıma bilgisi (specular reflection)
Dinamik aralık: LDR ve HDRI
Biçim Parlaklık aralığı Not
LDR (JPEG / PNG) Sınırlı (ör. 0–255) Tek tip “orta gri” gökyüzü; parlak güneş körlüğü
HDRI (.hdr / .exr) Çok geniş Güneş gibi parlak bölgeler ile derin gölgeler aynı haritada

Dolaylı IBL ile doğrudan gölge aynı iş değildir

Ortam haritası dolaylı dolgu ve yansıma verir; zeminde keskin kontur gölgesi için yine de yönsel / spot / nokta ışığı ve shadow map pass’leri gerekir (Gölge girişi, Pass maliyeti). İkisi birbirinin yerine geçmez; HDRI «stüdyo / gökyüzü refleksiyonu», gölgeler «ışık engeli» katmanıdır.

Hafif dolgu ihtiyacı için düşük yoğunluklu HemisphereLight veya Ambient yeterli olabilir; metal ve cam sınıfında ise ortam haritası sıklıkla zorunludur — bkz. PBR içgörü.

Three.js ve PMREM pipeline

Three.js, yüklenen HDRI dokusunu doğrudan piksel piksel örneklemez; önce işlenir.

PMREM (Prefiltered Mipmapped Radiance Environment Map)

Ortam radyansı kabaca şu adımlardan geçer:

  • Farklı roughness seviyeleri için önceden filtrelenir.
  • Mipmap benzeri katmanlar oluşturulur.
  • GPU dostu, örnekleme dostu bir temsil elde edilir.

Sonuç: Çalışma anında daha hızlı ve stabil yansımalar; PBR için daha pürüzsüz sonuçlar.

Maliyet davranışı

PMREM üretimi yükleme anında maliyetlidir; hazırlandıktan sonra çalışma zamanı (runtime) tarafı genelde daha ucuzdır. Kısaca: yükleme pahalı → render daha ucuz.

PMREM, görüntü zincirinin bir aşamasıdır

Ortam hazırlandıktan sonra son görünüm; ton eşlemesi, pozlama ve piksel başına örnekleme ayarlarıyla aynı hatta okunur (Renderer · kritik parametreler). Bu sayfa ortam verisini anlatır; kare başına ek maliyet çoğunlukla materyal karmaşıklığı ve ışık sayısından gelir — PMREM üretimi ise tipik olarak yük / yeniden üretim anına yakındır.

PBR materyaller ve ortam etkileşimi

Ortam haritası, PBR (Physically Based Rendering) akışında yansıma ve dolaylı ışık için referans verisidir.

Metalness

Metal yüzeyler ortamı doğrudan yansıtır. Ortam yoksa metal yüzeyler çoğu zaman karanlık / ölü görünür.

Roughness (pürüzlülük)

Roughness arttıkça yansıma daha geniş açıdan örneklenir; detay yumuşar ve görsel olarak bulanıklaşır. Bu, yüzeyin mikro ölçekte ışığı farklı yönlere dağıtmasının sonucudur.

Kritik içgörü

HDRI / ortam haritası olmadan PBR materyaller eksik kalır; özellikle metal ve cam sınıfı yüzeylerde fark belirgindir.

Roughness ve doku örnekleme

Roughness arttıkça yansıma daha geniş açıdan örneklenir; bu düşünce doku temellerindeki filtre / mip fikriyle aynı ailedendir — fakat burada konu yüzey parametresi ile PMREM’in birlikte ürettiği ön filtreli ortam temsilidir, tek bir albedo dokusu değildir.

Tone mapping: HDR → ekran

HDR verisi, tipik ekranın gösterebileceği aralıktan geniştir. Bu yüzden tone mapping neredeyse her zaman gereklidir.

Aşırı pozlama (overexposure)

Tone mapping yoksa veya uyumsuzsa sahne aşırı parlak görünebilir; renk dengesi bozulur, yüksek ışıkta detay kaybolur.

ACESFilmic (önerilen)

Çoğu modern Three.js projesinde varsayılan tercih olarak ACESFilmic tone mapping kullanılır: daha doğal kontrast, dengeli highlight rolloff, sinematik bir görünüm.

HDR ile gölge tonu aynı problem değildir

Aşırı parlaklık genelde HDR + pozlama + tone mapping düzleminde çözülür; gölgede görülen acne veya sızıntı ise harita ve bias düzlemindedir (Bias & Shadow Acne). İki sınıf artefakti aynı sürgüyle düzeltmeye çalışmak çoğu zaman döngü üretir — önce hangi katmanda bozulduğunu ayırın.

Environment ve background (kritik ayrım)

  • scene.background → Yalnızca görünen arka plan (gökyüzü / stüdyo rengi / doku).
  • scene.environmentAydınlatma ve yansıma kaynağı olarak kullanılan ortam haritası.

Pratik: Çoğu üretim sahnesinde ikisini birlikte tutmak veya yalnızca environment ile “stüdyo” hissi vermek yaygındır; ihtiyaca göre arka planı gizleyip yalnızca yansıma/ışığı kullanmak da mümkündür.

Arka plan doku sözleşmesi

scene.background için kullanılan equirectangular veya küp görselleri, yükleme ve bellek sözleşmesi olarak yine doku dosyalarıdır; örnekleme ve sıkıştırma tarafını doku temelleri sayfasıyla ilişkilendirin. scene.environment ise aydınlatma için PMREM’e giden yolu açar — ikisi aynı nesne olmak zorunda değildir.

Performans ve optimizasyon

Çözünürlük

1K–2K çoğu web sahnesi için yeterlidir; 4K+ görsel kazanç sıklıkla sınırlı, VRAM maliyeti ise belirgindir. HDRI büyük bir dokudur — çözünürlük seçimini bilinçli yap.

Environment intensity

Dolaylı ışığın gücünü ölçekler; çok yükseltmek sahneyi yıkanmış / düz gösterebilir.

// Örnek — sahne ortamının parlaklık ölçeği (Three.js sürümüne göre API adı değişebilir)
scene.environmentIntensity = 1.0;

PMREM ve yükleme stratejisi

HDRI yüklenince PMREM üretilir; bu yüzden gecikmeli yükleme (lazy loading) ve net bir yükleme ekranı kullanmak mantıklıdır.

Gölge maliyeti ile ortam maliyeti dik açıdır

HDRI çözünürlüğü ve PMREM üretimi bellek ve yükleme baskısı taşır; gölge üreten her ışık ise ekstra render pass taşır (Gölge hiyerarşisi). Birini düşürürken diğerini unutmayın — profil raporunda ikisi ayrı satır olarak görünür.

HoloDepth notu ve checklist

HoloDepth içgörüsü

Gölgenin davranışı arkasındaki gölge kamerasından geliyorsa, materyalin gerçekçiliği de büyük ölçüde arkasındaki PMREM / ortam verisinden gelir. Yansımalar donuksa veya metal yüzeyler “ölü” görünüyorsa önce şunları kontrol et: tone mapping, environmentIntensity, doğru ortam ataması — çözünürlüğü büyütmeden önce.

Checklist

  • HDRI yüklendi ve PMREM hatasız üretildi mi?
  • ACESFilmic tone mapping aktif mi?
  • HDRI çözünürlüğü (1K–2K) sahne için uygun mu?
  • scene.environment doğru atanıyor mu?
  • environmentIntensity dengeli mi?

Sıradaki modül: doku hattı

Ortam ve PBR köprüsünü kurduktan sonra, yüzeylere bağlanan albedo / normal / metal-rough dokuları için Texture temelleri sayfasına geçmek doğal devamdır; materyal API ayrıntıları için Materyal girişini el altında tutun.