WooCommerce ile kurulmuş bir mağazada ürün galerisi fotoğraflardan oluşur. Ürünü 3D göstermek, yani müşterinin ürünü çevirip yakınlaştırabilmesi için WooCommerce'in kendi içinde hazır bir özellik yoktur. Bu iş bir eklentiyle ya da temaya eklenen bir 3D görüntüleyiciyle yapılır.
Bu yazıda WooCommerce'te 3D ürün göstermenin yollarını, eklenti seçerken nelere bakılacağını, model dosyasının nasıl hazırlanacağını ve renk ya da malzeme seçeneklerini 3D model üzerinde göstermek istediğinizde neye ihtiyacınız olduğunu anlatıyoruz.
WooCommerce'te 3D için iki yol
- 3D görüntüleyici eklentisi: WordPress eklenti dizininde ürün sayfasına 3D model ekleyen ücretsiz ve ücretli eklentiler var. Çoğu, Google'ın açık kaynaklı model-viewer bileşenini ya da three.js kütüphanesini kullanır. Ürün düzenleme ekranına bir 3D model alanı ekler, modeli galeride ya da galerinin üstünde gösterir.
- Özel entegrasyon: 3D görüntüleyici ya da konfigüratör, temanın ürün sayfası şablonuna doğrudan yerleştirilir. Görünüm, yükleme davranışı ve varyasyonlarla bağlantı tamamen ürüne göre kurulur.
Tek renkli, az seçenekli ürünler için iyi bir eklenti çoğu zaman yeterlidir. Seçeneklerin birleştiği ürünlerde ya da markanın kendine özgü bir sunum istediği durumlarda özel entegrasyon öne çıkar.
Eklenti seçerken nelere bakılmalı?
- Güncellik: Eklentinin son güncelleme tarihine ve WordPress ile WooCommerce'in güncel sürümleriyle test edildiğine bakın. Uzun süredir güncellenmeyen bir eklenti, bir güncellemeden sonra ürün sayfasını bozabilir.
- Dosya biçimi: GLB desteği şarttır. GLB, web'de 3D model için yaygın kabul gören biçimdir; model, malzemeler ve dokular tek dosyada durur.
- Varyasyon desteği: Ürününüzün renk varyasyonları varsa, eklentinin her varyasyona ayrı model atayıp atayamadığına bakın. Bazı eklentiler bunu destekler, bazıları ürün başına tek model gösterir.
- AR görünümü: Telefonda ürünü kamerayla kendi ortamında gösterme seçeneği olup olmadığına bakın. iPhone'da bunun için ayrıca USDZ dosyası gerekebilir.
- Yükleme davranışı: Modelin sayfa açılır açılmaz mı, yoksa müşteri ona dokunduğunda mı yüklendiğine bakın. İkincisi ürün sayfasının hızını korur.
WordPress varsayılan olarak.glb dosyalarının medya kütüphanesine yüklenmesine izin vermez. 3D eklentileri bu dosya türünü genellikle kendisi açar; açmıyorsa yükleme sırasında "dosya türüne izin verilmiyor" hatası alırsınız.
3D model dosyası nasıl hazırlanmalı?
Hangi eklentiyi kullanırsanız kullanın, müşterinin gördüğü şey modelin kendisidir. İyi bir görüntüleyici kötü hazırlanmış bir modeli kurtarmaz.
- Dosya boyutu: Bir ürün modeli için birkaç megabayt hedeflenir. Paylaşımlı WordPress sunucularında büyük dosyalar yavaş iner; telefondaki müşteri bekler ve vazgeçer.
- Gerçek ölçü: Model ürünün gerçek ölçüsünde olmalı. AR görünümünde ürünün odada doğru boyda durması buna bağlıdır.
- Hafif geometri, gerçekçi malzeme: Dışarıdan görünmeyen parçalar atılır; kumaşın, ahşabın, metalin ve camın görünüşü malzeme ve dokularla verilir. Dokular web için sıkıştırılır.
- Önizleme görseli: Model yüklenene kadar görünen bir görsel hazırlanır. Galeri boş kalmaz, sayfa kaymaz.
Ürünün CAD dosyası varsa model ondan hazırlanır; yoksa teknik çizimden ya da fotoğraf ve ölçülerden modellenir. Süreç için 3D ürün modelleme yazımıza bakabilirsiniz.
Varyasyonlar: her renk için ayrı model mi?
WooCommerce'te bir koltuğun beş kumaş rengi varsa, eklentilerin çoğunda her renk için ayrı bir GLB dosyası hazırlayıp ilgili varyasyona bağlamanız gerekir. Kumaş, ayak ve kol seçeneklerinin birleştiği bir üründe bu sayı hızla onlara çıkar; her biri ayrı dosya, ayrı yükleme, ayrı bakım demektir.
Bu noktada 3D ürün konfigüratörü devreye girer. Konfigüratör tek bir modelde bütün kumaşları, renkleri ve parçaları tanımlar. Müşteri seçtikçe ürün anında değişir; yeni bir renk eklemek için yeni model gerekmez, yalnızca yeni malzeme tanımlanır.
WooCommerce ürün sayfasına 3D konfigüratör
Konfigüratör, ürün sayfasında galerinin yerine ya da yanına yerleştirilir. Müşteri ürünü döndürür, seçeneklerini değiştirir; sepet ve ödeme WooCommerce'in kendi akışında kalır. Konfigüratördeki seçim WooCommerce varyasyonuyla eşleştirilir: müşteri 3D modelde hangi birleşimi seçtiyse sepete o varyasyon eklenir, fiyat da ona göre güncellenir.
Nasıl bir deneyim olduğunu görmek için 3D Web App'imizdeki örneklere bakabilirsiniz: mobilya, kozmetik ve ambalaj örneklerinde seçenekler modelin üzerinde değişiyor. Aynı altyapı sizin ürününüzle WooCommerce mağazanıza entegre edilir. Ayrıntılar 3D web tasarım ve ürün konfigüratörü sayfamızda.
Aynı model, başka işler
Mağaza için hazırlanan 3D model yalnızca ürün sayfasında kalmaz. Aynı modelden beyaz fonlu katalog görselleri, kampanya görselleri ve sosyal medya için kısa ürün videoları üretilir. Yeni bir renk geldiğinde fotoğraf çekimi yapılmaz, model üzerinde render alınır. Görseller için 3D render, video için 3D ürün animasyonu sayfalarımıza bakabilirsiniz.
Sıkça Sorulan Sorular
WooCommerce'te 3D için mutlaka eklenti mi gerekiyor?
WooCommerce'in kendi içinde 3D desteği yoktur. Ya bir eklenti kullanılır ya da 3D görüntüleyici veya konfigüratör temaya özel olarak eklenir.
Hangi dosya biçimi kullanılmalı?
GLB. Model, malzemeler ve dokular tek dosyada durur, tarayıcıda hızlı açılır. iPhone'daki AR görünümü için bazı eklentiler ayrıca USDZ dosyası ister.
3D model sitemi yavaşlatır mı?
Doğru hazırlanmış ve müşteri dokunduğunda yüklenen bir model yavaşlatmaz. Sorun genellikle web için hafifletilmemiş, onlarca megabaytlık modellerde çıkar.
Ürünümüzün 3D modeli yok, ne yapmalıyız?
CAD dosyanız varsa model ondan hazırlanır. Yoksa teknik çizimden ya da fotoğraf ve ölçülerden modellenir. Aynı model mağaza, konfigüratör, ürün görselleri ve animasyon için kullanılır.
Konfigüratör WooCommerce varyasyonlarıyla çalışır mı?
Evet. Kurulumda konfigüratördeki her seçim bir WooCommerce varyasyonuna bağlanır; müşterinin seçtiği birleşim sepete doğru varyasyon ve doğru fiyatla eklenir.