holodepth

Three.js · Kamera Sistemi

Optik Göz: Dijital Perspektif ve İz Düşüm

Three.js evreninde kamera, sadece basit bir "bakış açısı" (viewpoint) değildir; 3D uzaydaki devasa koordinat verisini eşzamanlı olarak toplayan, kırpma işlemlerini gerçekleştiren ve tüm bu karmaşık matematiksel uzayı son kullanıcının ekranındaki iki boyutlu düzleme aktaran optik bir iz düşüm (projection) dönüştürücüsüdür.

Dijital sahneleri gerçekçi bir derinlikle yönetebilmek için, sanal bir merceğin (lens) fiziksel dünyadaki ışık kırılmalarını ve perspektif oluşumunu nasıl simüle ettiğini kavramak, Three.js'in matematiksel temelini anlamanın ilk adımıdır.

Fiziksel Kameranın Optik Anatomisi

Gerçek dünyada bir kamera, sahneden gelen ışık huzmelerini mercekler aracılığıyla kırıp bir odak düzleminde (sensör veya film) toplayan karmaşık bir optik sistemdir. Three.js'teki sanal kameralar fiziksel bir cama veya mekanik parçalara sahip olmasalar da, dijital dünyayı anlamlandırmak için kullanılan teknik kavramlar doğrudan klasik fotoğrafçılık terminolojisine dayanır.

Aşağıdaki temel kavramlar, sanal kameranızın matematiksel işleyişini gerçek hayattaki optik prensiplerle bağdaştırmanıza yardımcı olacaktır (matris ve görüş hacmi -frustum- detayları bir sonraki başlıkta ele alınacaktır):

  • Mercek (Lens): Işığın doğrultusunu değiştirerek belirli bir odak düzleminde toplanmasını sağlayan optik bileşendir. Sanal dünyada merceğin odak uzaklığı, sahnenin ne kadarının görüş alanına (FOV - Field of View) gireceğini belirler. Geniş açılı bir mercek sahneyi geniş bir perspektifle kapsarken, uzun odak uzaklığına sahip bir telefoto mercek sahneyi daraltarak objeleri birbirine daha yakınmış gibi gösterir.
    Not: Fiziksel merceklerdeki renk sapması veya köşe kararması gibi optik kusurlar, varsayılan sanal kamera sisteminde matematiksel olarak bulunmaz; bunlar ancak özel "post-processing" efektleri ile sonradan simüle edilir.
  • Odaklama (Focus): Işığın sensör düzleminde mükemmel bir netlikte kesiştiği noktadır. Fiziksel optikte, odak mesafesinin dışında kalan nesneler sensör üzerinde bulanıklaşır; bu da arka planın estetik bir şekilde "yumuşamasına" (bokeh) yol açar. Three.js'te ise kamera her şeyi varsayılan olarak kusursuz netlikte çizer. Alan derinliğini veya arka plan bulanıklığını elde etmek için ayrı bir "odak derinliği" algoritması (Depth of Field) tanımlamanız gerekir.
  • Yakınlaştırma (Optik vs. Dijital Zoom):
    • Optik Yakınlaştırma (Optical Zoom): Mercek grubunun fiziksel olarak yer değiştirmesiyle odak uzaklığının değişmesidir. Sensör, sahneyi daha dar bir açıdan ama orijinal çözünürlük verisiyle (hiçbir veri kaybı olmadan) yakalar; görüntü kalitesi her zaman en üst seviyededir.
    • Dijital Yakınlaştırma (Digital Zoom): Görüntünün merkezindeki piksel verisinin "kırpılıp" (crop) yazılımsal olarak büyütülmesidir. Görüntü ekranda yakınlaşmış gibi görünür ancak piksel başına düşen gerçek bilgi azaldığı için görüntü kalitesi düşer, pikseller belirginleşir (yumuşaklık kaybı).

Three.js ve Bilgisayar Grafiğinde Kamera

Dijital sahnelerde kamera, fiziksel bir optik mercekten ziyade matematiksel bir gözlemci rolü üstlenir. Bir kamerayı sahneye yerleştirmek sahnede fiziksel bir değişiklik yapmaz; sadece mevcut dünya verisinin hangi açıyla ve hangi kurallarla 2 boyutlu bir ekrana yansıtılacağını belirler.

Bu dönüşüm süreci, iki temel matrisin birleşiminden oluşur:

  • View Matrix (Bakış Matrisi): Kameranın 3D uzaydaki konumunu (position) ve hangi yöne baktığını (lookAt) temsil eder. Dünyadaki tüm nesneleri, kamerayı merkez alacak şekilde yeniden hizalar.
  • Projection Matrix (İz Düşüm Matrisi): 3D nesnelerin ekranın düzlemine nasıl aktarılacağını tanımlar. Perspektif (uzaklaştıkça küçülme) veya Ortografik (boyut bağımsız izometrik) kuralların uygulandığı yer burasıdır.

Bu iki matrisin birleşimi, dünya uzayındaki (x, y, z) noktalarını, ekranınızdaki piksellere (x, y) dönüştüren "klip uzayına" (clip space) taşıyan çekirdek mekanizmadır.
renderer.render(scene, camera) komutunu her çağırdığınızda, Three.js her bir nesne için bu hesaplamayı yaparak "bu nokta ekranda nereye düşer?" sorusunu yanıtlar.

Kamera Anatomisi ve Yetenekleri

  • Object3D Soy Ağacı: Three.js'teki tüm kameralar, bir mesh veya ışık ile aynı Object3D altyapısını paylaşır. Bu nedenle .position, .rotation ve .lookAt() gibi dönüşüm komutları kameralar için de geçerlidir. Kamerayı sahnede bir nesne gibi ağaca ekleyebilir veya bağımsız bırakıp sadece render anında referans verebilirsiniz.
  • Görüş Hacmi (Frustum): Gerçek bir sensörün aksine sanal kamera, Frustum adı verilen, piramit şeklinde kesik bir görüş hacmine sahiptir. near (en yakın) ve far (en uzak) düzlemleriyle sınırlanan bu hacmin dışında kalan nesneler, işlemciyi yormamak adına "ayıklanır" (culling). Buna Frustum Culling denir; nesne görüş alanı dışındaysa render edilmez, böylece yüksek performans sağlanır.
  • Katmanlama (Layers): Kamera ve nesneler arasında bir filtreleme mekanizmasıdır. Nesneleri farklı layers (katmanlar) üzerine atayarak, belirli bir kameranın sadece UI katmanını, diğerinin ise sadece ana sahne katmanını görmesini sağlayabilirsiniz.

Gerçek Kamera vs. Sanal Kamera: Kusursuzluk Paradoksu

Dijital Three.js kameraları, matematiksel bir doğrulukla çalıştıkları için "kusursuzdur". Ancak bu aşırı kusursuzluk, insan gözünün fiziksel dünyadan alışık olduğu o doğal "kusurları" barındırmadığı için, sahnelerinizin bazen gerçeklikten uzak ve "yapay" görünmesine neden olabilir.

Optik Özellik Gerçek Kamera (Fiziksel) Sanal Kamera (Three.js)
Görüntü Bozulması (Distortion) Mercek yapısı nedeniyle kenarlarda doğal bükülmeler ve sapmalar yaşanır. Matematiksel olarak çizgiler dümdüzdür. Bozulma efekti için özel bir Shader yazılmalıdır.
Alan Derinliği (DOF) Odak noktası dışındaki her şey mercek fiziği gereği doğal olarak bulanıktır. Tüm sahne varsayılan olarak jilet gibi nettir. Bulanıklık Post-Processing ile eklenir.
Işık Patlaması (Lens Flare) Parlak ışıklar cam yüzeylerde sekerek yansımalar ve patlamalar oluşturur. Sahnenin doğal bir parçası değildir; sadece görsel bir efekt katmanı olarak sonradan eklenir.
Görüş Açısı (Focal Length) Mercek değiştikçe odak uzaklığı fiziksel olarak güncellenir. Sadece FOV (Field of View) değerini değiştirerek sanal bir zoom efekti yaratılır.

Teknik kavramlar: zoom ve netlik

Aşağıdaki üç parametre çoğunlukla PerspectiveCamera kurulumunda verilir; projection matrisinin sayısal girdileridir. Optik zoom veya mercek değiştirmek gibi fiziksel bir işlem değildir; değerleri kodda güncellersiniz. Ayrıntılı API ve örnekler PerspectiveCamera sayfasında.

  • FOV (Field of View - Görüş Alanı): Kameranın dikey açı cinsinden "ne kadar geniş" bir sahneyi içine sığdırdığını tanımlar. Derece bazlı bir değerdir; genellikle 50 ile 75 derece arası insan gözüne en yakın doğal hissi verir.
    Mantıksal Etki: FOV değerini azalttıkça sanki bir telefoto lens ile bakıyormuşsunuz gibi görüş daralır ve nesneler ekranda büyür. Bu aslında fiziksel bir mercek değişimi değil, yazılımsal bir "dijital yakınlaştırma" (dijital zoom) etkisidir. Çok geniş FOV değerleri "balık gözü" etkisi yaratarak sahneyi bozar, çok dar değerler ise perspektifi düzleştirerek tele-fotoğraf hissi verir.
  • Aspect Ratio (En-Boy Oranı): Çizim alanının genişliğinin yüksekliğine oranıdır. Projection matrisi, bu orana bakarak 3D uzaydaki bir dairenin ekrana basıldığında "elips" olmamasını (daire kalmasını) sağlar.
    Uygulama: Canvas boyutunuzu belirleyen renderer.setSize() ile kameranızın aspect değerini mutlaka eşitlemelisiniz. Eğer pencere yeniden boyutlandırıldığında (resize) bu oran güncellenmezse, sahneniz orantısız bir şekilde basık veya dikey olarak uzamış görünür.
  • Near & Far (Kırpma Düzlemleri): Gerçek dünyada bir yıldızın ışığını görebilirsiniz, ancak dijital GPU'larda derinlik verisi (Z-buffer) sınırlı bir hassasiyete sahiptir. Kırpma düzlemleri, kameranın "şu mesafeden sonrasını ve öncesini çizme" komutudur.
    Performans ve Titreme: Near (en yakın) düzlemini gereğinden çok küçük (örn: 0.0001) yapmak, Far düzlemini ise gereksiz büyük yapmak, GPU'nun derinlik ayrım kabiliyetini bozar. Bu durum z-fighting denilen, üst üste binen yüzeylerin (yüzey titremesi) birbirine girip titremesine neden olur. Her zaman sahnenizin boyutlarına uygun, "mümkün olan en dar aralığı" seçmek en profesyonel yaklaşımdır.

Holodepth notu: Neden her şey net?

Gerçek hayatta gözümüz tek bir noktaya odaklanır. Three.js kamerasında varsayılan olarak her şey (yakın veya uzak) aynı netliktedir. Bu, bilgisayarın pikselleri çizerken derinlik farkı gözetmeksizin hepsini aynı netlik algoritmasıyla işlemesinden kaynaklanır. Eğer "sinematik" bir hava istiyorsan, depth of field (alan derinliği) efektlerini öğrenmen gerekecektir.