Bu neden önemli?

3D ürün animasyonu etkileşimi, sayfada kalma süresini ve sepete ekleme oranlarını artırabilir; ancak kötü uygulanırsa sayfaları yavaşlatabilir ve dönüşümleri düşürebilir. Bu rehber 3D’nin ne zaman kullanılacağını, nasıl verimli şekilde yayına alınacağını ve neyin ölçülmesi gerektiğini gösterir.

3D ne zaman yardımcı olur?

• Hareketin değeri ortaya çıkardığı karmaşık ürünler (mekanizmalar, dokular, kalıp).

• Etkileşimli görüntülemeden fayda sağlayan, uzun düşünülerek alınan ürünler.

• Hareketin markayı farklılaştırdığı lansmanlar ve reklamlar.

3D ne zaman zarar verir?

• Mobil veri paketlerinde ağır dosyalar.

• LCP’yi engelleyen, otomatik oynatılan ve ekranın üst kısmında yer alan canvas’lar.

• Belirsiz değer: alıcının bir sorusuna cevap vermeyen animasyon.

Formatlar ve teslim seçenekleri

• Ana bölüm demoları için hafif video döngüleri (WebM/MP4).

• Kaydırılabilir görünümler için optimize edilmiş görsel dizileri (WebP).

• Gerçek etkileşim için WebGL/Three.js: yüklemeyi kullanıcı niyeti gelene kadar erteleyin.

Performans kontrol listesi

• Ekranın üst kısmındaysa ana bölüm varlığını yaklaşık 120–200 KB altında tutun; daha ağır deneyimleri ekranın altına erteleyin.

• Etkileşimli 3D’yi tıklama/kaydırma anında tembel yükleyin; statik bir kapak görseli sağlayın.

• Yalnızca kritik olanı önceden yükleyin; sessiz döngüler için sıkıştırın, kod dönüştürün ve ses kanallarını kaldırın.

• LCP/CLS/INP değerlerini gerçek cihazlarda test edin; tipik koşulları simüle etmek için “Slow 4G”ye kısıtlayın.

UX ilkeleri

• Varsayılan olarak net bir “3D Görüntüle” kontrolüne sahip statik bir ana görsel kullanın.

• Basit kamera ön ayarları (ön/yan/yakınlaştırma) ve sıfırlama sağlayın.

• Alt yazıları koruyun: neye bakılacağını açıklayın (“manyetik kilidin devreye girişini görün”).

• Kullanıcı kontrolüne saygı gösterin; ilk boyamada gürültülü hareket olmasın.

Ölçüm planı

• “3D Görüntüle” tıklamalarını, 3D’de geçirilen süreyi, 3D görünümden sonra sepete eklemeyi ve ödeme tamamlamayı izleyin.

• Yaygınlaştırmadan önce yüksek trafikli tek bir üründe statik ile 3D’yi A/B testine tabi tutun.

Yeniden kullanabileceğiniz iş akışı

Net görsel değeri olan tek bir SKU seçin.
3D varlığı ve hafif bir kapak görseli üretin.
Statik bir ana görsel ile ekranın altında isteğe bağlı 3D yayınlayın.
2 hafta boyunca ölçün; CTR/ATC, CWV gerilemeleri olmadan iyileşiyorsa koruyun.
En çok satan ilk 5 SKU’ya yaygınlaştırın ve tekrarlayın.

Sonuç

3D, gerçek bir alıcı sorusuna cevap verdiğinde ve hafif yayınlandığında güçlüdür. Küçük başlayın, etkiyi ölçün ve yalnızca dönüşüm sağladığı yerde ölçekleyin.