Kısa cevap: evet, mümkün. Modern tarayıcılar WebGL sayesinde 3D sahneleri eklenti olmadan çizebiliyor. Biz 55 yapı, 27 karakter ve 1,76 milyon üçgenden oluşan bir ortaçağ kasabasını bir web sayfasına koyduk; ziyaretçi sayfayı kaydırdıkça kamera sokakların içinde ilerliyor, karakterlerin ve ejderhanın etrafında dönüyor. Video değil: her kare ziyaretçinin cihazında o anda çiziliyor. Bu yazıda işin nasıl yapıldığını, hangi sayıların ölçüldüğünü ve nerede hata yaptığımızı anlatıyoruz.
1. Ham sahne web'e doğrudan konmaz
Sahne Blender'da kuruldu ve ilk web çıktısı 494,3 MB idi. Bu boyut bir web sayfası için kullanılamaz. Üç adımda düşürdük:
- Doku çözünürlüğü 1024 piksele indirildi. Kamera hiçbir dokuya 4K'lık detayı görecek kadar yaklaşmıyor; fazlası indirme süresine gidiyordu.
- Dokular WebP'ye çevrildi. Aynı görsel kalite, belirgin şekilde küçük dosya.
- Geometri Draco ile sıkıştırıldı. Üçgen verisi tarayıcıda açılıyor, ağdan sıkıştırılmış geçiyor.
Sonuç 54,7 MB. Yaklaşık dokuzda bir. Kadrajda fark edilen bir kalite kaybı yok.
Buradaki asıl ders
Dosyayı şişiren şey çoğu zaman doku çözünürlüğü değil, doku sayısıdır. Bizim sahnemizde 400'den fazla ayrı doku var. Bunları tek bir atlas dosyasında birleştirmek daha da küçültürdü; biz bu turda yapmadık ve bunu açıkça yazıyoruz, çünkü "yapılabilirdi ama yapılmadı" bilgisi de bir sonraki projede işe yarıyor.
2. Kamera güzergâhını elle çizmeyin
İlk sürümde kamera yolunu on kontrol noktasıyla elle çizdik. İyi göründü. Sonra ölçtük:
- Eğri beş ayrı yapının içinden geçiyordu; turun yaklaşık %14'ü bir binanın içindeydi.
- Yolun %38,8'i bir duvara 3 metreden yakındı.
- Son bacak, ortanca hızın 5,3 katı hızdaydı; kamera oraya geldiğinde fırlıyordu.
Tarayıcıda açıp baktığımızda tablo netti: anlatı kartı "Melek Heykeli" yazarken kamera bir evin karanlık iç mekânında duruyordu.
İkinci sürümde yolu hesaplattık. Sahnenin 165 çarpışma kutusundan bir boşluk haritası çıkardık ve A* algoritmasıyla sokaklardan geçen bir güzergâh bulduk. Üretici betik, bina içinden geçen tek bir örnek bulursa dosyayı yazmıyor. Şu anki güzergâh 799 metre, 25 durak, 6057 örnek ve sıfır bina teması.
Kasaba çok sıkışık çıktı
Ölçüm bir şeyi daha gösterdi: sokaklar 1 ila 3 metre genişliğinde. İlk denemede kameraya 2,9 metrelik bir emniyet payı vermiştik ve demirci aralığı, kuzey ara geçitleri, doğu sokağı tamamen ulaşılmaz kaldı. Kamera bir nokta olduğu için 1,2 metre yeterli; payı düşürünce sokak ağının tamamı gezilebilir oldu. Doğru sayı, tahmin değil ölçüm sonucu.
3. Tempoyu tarayıcıda değil, veride çözün
Kamera hızının tutarlı olması gerekiyordu. Klasik yaklaşım, tarayıcıda yay uzunluğu hesaplayıp hızı normalize etmektir; bu hem karmaşık hem de her karede maliyetli. Biz tempoyu veriye pişirdik: kamera yolu, zamanda eşit aralıklı 6057 örnek olarak üretiliyor. İki örnek arası mesafe doğrudan hızı veriyor; bir durakta beklemek ise aynı noktada çok sayıda örnek demek. Tarayıcı sadece dizide yürüyor. Hız sıçraması yok, ek hesap yok.
4. Sahneyi canlandırın, ama bedelini bilerek
Statik bir 3D sahne hızla "maket" gibi görünmeye başlar. Sahneye şunları ekledik ve hepsi çalışma zamanında, sahneyi yeniden ihraç etmeden yapıldı:
- Dosyanın içinde zaten duran 48 animasyon klibi keşfedildi; dört figür kendi kliplerini oynuyor.
- Kalabalıktaki figürlerin omurga ve boyun kemiklerine derece altı bir salınım verildi. Heykel gibi durmuyorlar, kare başına maliyeti ölçülemeyecek kadar küçük.
- Büyü çemberinin halkaları dönüyor, ateş topu düzensiz titriyor, şimşek aralıklarla çakıyor.
Yapmadıklarımız da bilinçli: gerçek alan derinliği (bokeh) eklemedik, çünkü sahnenin ikinci kez çizilmesini gerektiriyor ve çizim çağrısını ikiye katlıyor. Yerine vinyet ve hafif objektif ayrımı kullandık; aynı sinematik his, neredeyse sıfır maliyet.
5. Peki bu iş kime yarar?
Gerçek zamanlı 3D her siteye gerekmez. İşe yaradığı yerler, ürünün kendisinin ikna ettiği işlerdir:
- Araç, makine ve ekipman showroom'ları — ziyaretçi ürünü çevirip yakınlaştırabildiğinde karara yaklaşır.
- Mobilya, mimari ve iç mekân sunumları — malzeme ve ölçek fotoğraftan daha iyi aktarılır.
- Emlak ve proje tanıtımları — henüz inşa edilmemiş bir yapı gezilebilir hâle gelir.
- Turizm ve otel deneyimleri — mekânı görmek, anlatmaktan güçlüdür.
- Marka anlatısı gereken açılış sayfaları — rakiplerden ayrışmanın en hızlı yolu.
Buna karşılık bir muhasebe paneline, bir haber sitesine veya hızın her şey olduğu bir e-ticaret listeleme sayfasına 3D koymak, ziyaretçiye fayda değil bekleme süresi verir. Biz de bu sahneyi ana sayfamıza gömmedik: ana sayfada bir poster ve bir bağlantı var, sahne ayrı bir sayfada açılıyor.
6. Dürüst sınırlar
Bu tür işlerde en çok yanıltan şey, sadece iyi tarafın gösterilmesi. Bizim sahnemizde de açık kalanlar var: üçgen bütçesi hedeflenen 1,5 milyonun üzerinde, 1,76 milyonda kaldı (katedral sadeleştirmeden muaf tutulduğu için). Doku atlası birleştirme yapılmadı. Kalabalıktaki dört figür kaynak dosyadan T-pozunda geldi; sahneyi yeniden kurmak yerine bunları ölçerek tespit edip gizledik. Hepsi çözülebilir işler, ama bugün itibarıyla durum bu.
Sahneyi kendiniz gezin
Kasaba sahnesi stüdyo sitemizde canlı. Kaydırdıkça 25 durakta ilerliyor; masaüstünde açmanızı öneririz. Aynı hattı bir ürün showroom'una ya da marka sayfanıza kurabiliriz.
İlgili içerikler: Web & Dijital Çözümler · Web Sitesi Maliyeti Rehberi · Web Stüdyosu (canlı 3D) · English version
Bu yazıdaki sayıların tamamı kendi projemizde ölçülmüştür (Temmuz 2026). Dosya boyutları, üçgen sayıları ve güzergâh uzunluğu üretim betiklerinin çıktısından alınmıştır.