Google'da "web sitesine 3 boyutlu model ekleme" veya "ürünün 3 boyutlu modelini alma" araması yapan işletme sahiplerinin çoğu aynı soruyu soruyor: Ürün fotoğraflarım var, ama rakiplerimden ayrışan, "elde tutuyormuş gibi" hissettiren bir ürün gösterimi istiyorum — bu teknik olarak nasıl mümkün, ne kadar zaman alır ve gerçekten sitenin performansını bozar mı?
Bu rehberde, ZÜZÜ adlı konsept çalışmamızda uyguladığımız yöntemden yola çıkarak süreci baştan sona anlatıyoruz.
Neden Düz Ürün Fotoğrafı Artık Yetmiyor?
Bir e-ticaret sayfasında 5-6 açıdan çekilmiş düz fotoğraf, ürünü anlatır ama hissettirmez. Ziyaretçi ürünü elinde tutamadığı için satın alma kararı büyük ölçüde markaya güvene kalır. İnteraktif bir 3D model veya derinlik/paralaks efekti bu boşluğu doldurur: ziyaretçi ürünü kendi isteğiyle döndürür, yakınlaştırır, keşfeder — pasif bir izleyiciden aktif bir kullanıcıya dönüşür.
3 Boyutlu Ürün Modeli Nasıl Üretilir?
Ürününüzün 3 boyutlu modelini almanın iki temel yolu vardır:
1. Fotogrametri / 3D Tarama
Ürünün etrafından çekilen onlarca (bazen yüzlerce) fotoğraf, özel yazılımlarla birleştirilerek bir 3D mesh oluşturulur. Karmaşık, düzensiz geometrili ürünler (heykel, el yapımı objeler, organik formlar) için doğru yöntemdir ama ekipman, zaman ve maliyet açısından ağırdır.
2. İki Fotoğraftan Modelleme (Basit Geometriler İçin)
Kutu, şişe, kavanoz, tüp gibi dönel simetriye sahip ya da basit geometrili ürünlerde çok daha hızlı bir yol var: ürünün ön ve arka yüzünü gösteren iki düz fotoğraf yeterli. Bu fotoğraflar, ürünün gerçek boyutlarına uygun şekilde Blender'da oluşturulan bir mesh üzerine doku (texture) olarak sarılır. ZÜZÜ çalışmamızda tam olarak bunu yaptık: iki etiket fotoğrafından, gerçek zamanlı döndürülebilen bir 3D model çıkardık.
| Yöntem | Uygun Ürünler | Süre | Maliyet |
|---|---|---|---|
| Fotogrametri / 3D tarama | Karmaşık, düzensiz geometri | Uzun | Yüksek |
| İki fotoğraftan modelleme | Kutu, şişe, kavanoz, ambalaj | 7–10 iş günü | Ekonomik |
Web Sitesine 3D Model Eklemenin Teknik Yolları
Model elinizde olduğunda sırada onu sitenize eklemek var. Üç yaygın yaklaşım:
- <model-viewer> web bileşeni: Google'ın geliştirdiği, kod yazmadan tek bir HTML etiketiyle GLB/GLTF model gömmenizi sağlayan hazır bir çözüm. Hızlı başlangıç için idealdir ama özel etkileşim (otomatik yavaş dönüş, tıklamada özel animasyon gibi) sınırlıdır.
- Three.js + react-three-fiber: React tabanlı sitelerde (Next.js dahil) en esnek yöntem. Kamera açısı, ışıklandırma, tıklama animasyonu, otomatik döndürme gibi her detay kodla kontrol edilebilir. Bizim ZÜZÜ modelimiz ve bu rehberin dayandığı yöntem budur.
- Shopify/WooCommerce 3D eklentileri: Hazır e-ticaret altyapılarında üçüncü parti uygulamalarla model gömme imkânı sunar; özelleştirme seçenekleri platforma bağlı olarak sınırlıdır.
Hangi yöntemi seçerseniz seçin, iki teknik detay kritik: model dosyası sıkıştırılmış GLB formatında olmalı (birkaç yüz kilobayt) ve yalnızca kullanıcı o bölüme yaklaştığında yüklenmeli (lazy loading). Aksi halde sayfa hızınız ve Core Web Vitals skorlarınız zarar görür.
Adım Adım: Ürününüzün 3D Modelini Nasıl Alırsınız?
- Fotoğrafları hazırlayın: Ürününüzün ön ve arka yüzünü gösteren, düz ışıklı iki fotoğraf. Stüdyo çekimi şart değil.
- Derinlik haritası çıkarılır: Tek bir fotoğraftan üretilen derinlik haritasıyla fareyle/dokunuşla gezinilebilen bir paralaks efekti oluşturulur — bu, tam 3D modelden önce hızlı ve ekonomik bir ara adımdır.
- 3D mesh Blender'da modellenir: Ürünün geometrisine uygun bir mesh oluşturulur, fotoğraflar UV-wrap doku olarak sarılır.
- GLB olarak dışa aktarılır ve sitenize entegre edilir: react-three-fiber/WebGL ile gömülür, masaüstünde fare, mobilde parmakla döndürülür.
- Test edilir ve yayına alınır: Masaüstü, mobil ve tablet performansı doğrulanır.
Maliyet ve Süre
Tek bir ürün için (kutu, şişe, kavanoz gibi basit geometri) uçtan uca süreç 7–10 iş günü sürer. Maliyet; ürün sayısına, geometrinin karmaşıklığına ve istediğiniz efekt türüne (yalnızca paralaks mı, tam 3D model mi) göre değişir.
Kimler İçin Uygun?
- İçecek ve ambalaj kutuları
- Kozmetik ve bakım ürünleri
- Kavanoz, şişe ve tüp paketlemeler
- Takı ve aksesuar
- Küçük elektronik ürünler
Çok parçalı, esnek yüzeyli veya son derece düzensiz geometrili ürünlerde önce bir fizibilite değerlendirmesi yapılması gerekir.
Sık Sorulan Sorular
Web sitesine 3 boyutlu model eklemek için kodlama bilmem gerekir mi?
Hazır bir çözüm kullanacaksanız (örneğin <model-viewer> web bileşeni veya bir Shopify 3D uygulaması) minimal teknik bilgi yeterlidir. Özel, markanıza uygun bir etkileşim (yavaş otomatik dönüş, tıklamada hızlı dönüş gibi) istiyorsanız react-three-fiber/Three.js ile özel bir entegrasyon gerekir — bu noktada bir ajansla çalışmak süreci hızlandırır.
Ürünümün 3 boyutlu modelini nasıl alırım?
İki yöntem var: fotogrametri/3D tarama (karmaşık geometriler için, pahalı ve yavaş) veya iki düz fotoğraftan modelleme (kutu, şişe, kavanoz gibi basit geometriler için hızlı ve ekonomik).
3D model dosya formatı olarak ne kullanılmalı?
Web için standart, sıkıştırılmış GLB (glTF Binary) formatı. Genellikle birkaç yüz kilobayt boyutundadır ve tarayıcılar arasında tutarlı çalışır.
3D model SEO'yu olumsuz etkiler mi?
Doğru uygulandığında hayır. Model yalnızca kullanıcı o bölüme yaklaştığında yüklenmeli ve ayrı bir paket (chunk) olarak sunulmalıdır; bu şekilde Core Web Vitals etkilenmez.
Hangi teknoloji web sitesine 3D model eklemek için kullanılır?
En yaygın yol WebGL üzerine kurulu Three.js'tir. React tabanlı sitelerde react-three-fiber, daha basit ihtiyaçlar için Google'ın <model-viewer> bileşeni kullanılabilir.
Sonuç
Ürününüzün 3 boyutlu modelini almak, sandığınız kadar pahalı veya karmaşık bir süreç değil — özellikle kutu, şişe veya kavanoz gibi basit geometrili ürünlerde iki fotoğrafla başlayabilirsiniz. Bu yöntemi gerçek bir üründe nasıl uyguladığımızı görmek için ZÜZÜ vaka çalışmasını inceleyin, ya da doğrudan 3 boyutlu ürün modelleme hizmetimize göz atın. Ürününüzün fotoğraflarıyla birlikte ücretsiz danışma toplantısı talep edin; kapsamı birlikte netleştirelim.