Aşağıdaki makale size yardımcı olacaktır:Yükseltilmiş Ürün Sayfalarıyla E-ticaret Markanızı Farklılaştırın
Ürün sayfaları e-ticaretin ekmeğidir. Bir müşteri bir ürün detay sayfasına geldiğinde, bir dakikadan az değeri iletmek ve soruyu cevaplamak için: “Aradığım şey bu mu?”
Ancak ürün sayfaları, ürün bilgilerini iletmekten çok daha fazlasını yapmanıza yardımcı olabilir. Bunlar markanızı farklılaştırmanız için bir şanstır.
‘Yüksek’ ürün sayfası deneyimleri dediğimiz şeyi oluşturmak, öne çıkan bir marka olarak ortaya çıkmanın anahtarıdır. Bu tür site içeriği marka değerinize katkıda bulunur ve daha yüksek fiyat noktalarına hakim olmanıza yardımcı olabilir.
Kısacası: kaliteli hikaye anlatımı ana sayfada duramaz. Bunun yerine, ürün detay sayfalarınız da dahil olmak üzere site içeriğinin tamamında gereklidir.
Bugün, Shogun’da e-ticarette ‘yüksek’ ürün sayfası olarak tanımladığımız şeyi, ayrıca markaların bu tür site içeriğini nasıl kolaylaştırdığını ve daha fazlasını öğreneceksiniz.
Öyleyse yerleşin ve başlayalım!
‘Yükseltilmiş’ ürün sayfası nedir?
“Yükseltilmiş” ürün sayfası derken tam olarak neyi kastediyoruz? Bunun diğer ürün sayfalarından farkı nedir?
Shogun olarak bizim için ürün sayfaları yükseltilmiş Ürün bilgileri, görseller, SSS ve müşteri incelemelerinden oluşan standart formatın ötesine geçin. Bu sayfalar Kritik ürün ayrıntılarını aktarırken Ayrıca Alışveriş yapanlarla daha derin bir düzeyde bağlantı kurmak.
- Bu sayfalar genellikle bir marka topluluğunun özelliklerini sergiler (kullanıcı tarafından oluşturulan içerik sayfaya yerleştirilebilir),
- Zengin yakından ürün görünümlerini paylaşırlar (standart bir Amazon sayfasında görebileceğinizden farklıdır) ve
- Ürünün özel veya son derece özel görünmesini sağlamak için markalı görseller, arka plan videosu veya ürün veya marka eğitimi gibi bileşenler kullanın.
Aslında, yükseltilmiş ürün sayfaları genellikle hissetmek standart olanlardan farklıdır. Bu site içeriği daha çok bir marka deneyimine benziyor. Yükseltilmiş ürün sayfaları yararlılık arasındaki çizgiyi takip ediyor Ve dinamik.
Örneğin Apple’ı ele alalım. MacBook Air veya Apple Watch ürün sayfalarını incelediğinizde, bunlar yol Microsoft’ta görebileceğiniz bir şeyden daha ilgi çekici:
MacBook Air sayfasındaki Apple M1 çipinin zengin görselleri dikkat çekici ve kendini ifade ediyor. Özelleştirilebilir Apple Watch sayfası, müşterilerin Apple’ın Tarzını Yarat özelliği aracılığıyla kendi tarzlarına ve tercihlerine tam olarak uyan ürünü yaratmalarına olanak tanıyor.
Her iki sayfa da kendilerine göre dinamiktir ancak yine de Apple’ın değerlerine sadık kalmaktadır.
Apple’ın ürün sayfaları aşağıdaki gibi öğeleri içerir:
- İnce, kayan animasyonlar
- Yüksek çözünürlüklü görüntüler
- Önemli özellikleri vurgulayan büyük, kalın metinler ve markalı simgeler
- Hikaye Anlatımı öte özellikler (değer ve spesifikasyonlara odaklanır)
Apple ürün sayfaları, bir Apple aygıtı kullanmakla eş anlamlıdır; şık, her ayrıntısı düşünülmüş bir deneyim. Aldığınız ürünün aynı zamanda bir deneyim olacağını bilmenizi sağlarlar.
Daha standart, bilgi ağırlıklı bir görünümü koruyan Microsoft ürün sayfasıyla karşılaştırıldığında:
Güzel görünürken, bu sayfa basit teknik özelliklere odaklanmaktadır. Daha çok standart bir Amazon.com sayfasında sağlanan bilgilere benzer. Apple’ın yaptığı gibi bir “deneyim” gibi gelmiyor pek.
Microsoft’un markasının Apple’ınkinden oldukça farklı olduğu ve standart bir ürün sayfasının Apple’ın değerlerine daha uygun olduğu iddia edilebilir. Ve bu geçerli.
Fakat, Apple’ın sahip olduğu itibara sahip olmasının bir nedeni var. Teknolojik farklılıklar bir yana, günün sonunda hem Microsoft hem de Apple dizüstü bilgisayar ve tablet satıyor. Apple’ın bir dizüstü bilgisayar tedarikçisinden çok daha fazla öne çıkmasını sağlayan şey, yarattığı duygusal bağdır.. Apple, ürün lansmanları boyunca blokları uzatarak ürün gruplarını yönetebilir ve bu marka bağlılığının bir kısmı, deneyimler oluşturma ve hikayeleri ilgi çekici şekillerde anlatma konusundaki benzersiz yeteneklerine atfedilebilir.
Bununla birlikte, bir ürün sayfasını standarttan standart hale getiren bileşenlere bakalım. yükseltilmiş.
Ürün sayfalarının durumu
Amazon’da gördüğünüz gibi standart ürün sayfaları, ürün ayrıntıları, görseller ve incelemeler gibi tipik bilgileri içerir:
Bu bilgiler önemli olmakla birlikte DTC markalarının beğendiği özel soslar bu gibi sayfalarda eksik Brooklyn, ParlatıcıVe Hims & Onunki Ürün sayfalarında var. Standart ürün sayfaları, müşteri eğitimi olarak öne çıkan sihire veya marka özüne sahip değildir.
Bu sihir, markanızın Amazon gibi devlere karşı rekabet avantajıdır.
Bu Yaşlanma Karşıtı Krem ürün sayfasını Hers’ten alın:
Ekranın üst kısmında tipik ürün sayfası öğelerini görüyorsunuz.
Ancak kaydırmaya devam ettikçe, örnek bir cilt bakımı rutini ve eğitici görsellerin yanı sıra, ürünün içeriğini (ve görevlerini) açıklayan, jargondan uzak bir metinle karşılaşırsınız.
Bu sayfada yer alan dermatolog destekli bilgiler, Hers’ü yalnızca başka bir yaşlanma karşıtı krem (okuyun: ticarileştirilmiş) perakendecisi değil, gerçekten işe yarayan ürünlerle güvenilir bir kaynak olarak konumlandırıyor.
Ayrıca Hers, büyüyen topluluğuna seslenmek için kullanıcı tarafından oluşturulan içeriği (gerçek hayattaki müşterilerin tanıtıcılarıyla birlikte) dahil etmeye önem veriyor:
Topluluğunu ve yakından ürün dokusu çekimlerini sergilemek Hers’in kendisini daha kişisel hissetmesini sağlıyor ve marka değerini oluşturuyor.
Bir şeyin 4 unsuru yükseltilmiş ürün sayfası
Tasarım seçenekleri ve eklenen markaya özel bilgilerle yükseltilmiş ürün sayfaları, özel bir şeye sahiptir. Gibi DTC markalarını ölçeklendirme Göçebe (lüks yaşam tarzı aksesuarları markası) ve Stikwood (modern bir ev dekorasyonu markası), bunu ürün sayfalarında yansıtın.
Bu yükseltilmiş ürün sayfaları aracılığıyla, Nomad ve Stikwood ürünlerden daha fazlasını satıyor. Bu sayfalar her iki markanın topluluklarını gösterir, eğitim sağlar ve tipik ürün sayfası bileşenlerinin ötesine geçer.
Bir ürün olarak değerlendireceğimiz şeyi neyin oluşturduğuna bir bakalım. yükseltilmiş ürün sayfası:
1. Marka kişiliği içeriğin tamamına işlenmiştir
Öne çıkan bir ürün sayfası oluşturmanın en hızlı yolu? Markanızı içerik ve tasarım öğelerine aşılayın.
Stikwood’un ürün sayfaları, markaya ait görseller ve metinlerle dolu olup, alışveriş yapanlara kim olduklarına ve ev dekorasyonu alanında neyi temsil ettiklerine dair özgün bir bakış sunuyor.
Stikwood sayfalarının formatı (Stikwood’un yapışkan ahşap plakalarını yansıtan yatay metin ve görüntü blokları), bağlamsal simgeler ve sayfanın formatına kusursuz bir şekilde uyum sağlayan malzeme gezgini özelliği, Stikwood’un kalitesine ve ürün tasarımına saygı duruşunda bulunur.
Malzeme gezgini özelliği, müşterilerin farklı ahşap türlerini büyütülmüş ayrıntılarla görmesine olanak tanır, böylece ev dekorasyonu projeleri için doğru ürünü seçtiklerinden emin olabilirler. Alışveriş yapanların kendi tarzlarına uygun mükemmel eşleşmeyi bulmalarına yardımcı olan bunun gibi özellikler, Stikwood’u DIY iç tasarım alanında birinci sınıf bir marka olarak konumlandırıyor.
Bu sayfa öğeleri ve özellikleri bir arada Stikwood’un kişiliğini yansıtıyor ve sıradan bir ev dekorasyonu markası olmadığını güçlendiriyor.
#cta-visual-fe#
2. Yükseltilmiş site içeriği, soruları müşteriler sormadan yanıtlar
Yükseltilmiş ürün sayfaları, tipik ürün açıklamasının ve teknik özelliklerinin ötesine geçer. Müşteri sorularını öngörüyorlar ve anlaşmazlıkları en aza indirmek için çalışıyorlar (böylece müşteriler alışverişlerini hemen tamamlamak yerine tamamlıyorlar).
Stikwood gibi bir ev dekorasyonu markası için alışveriş yapanlar, özellikle de Kendin Yap projelerinde yeni olanlar, “Bu özel ahşap türü ve rengi benim mekanımda işe yarar mı?” diye merak edebilir.
Alışveriş yapanlar Stikwood ürün sayfasında gezinirken, yalnızca tahta genişliği ve kalınlığı gibi ürün ölçümlerini görmekle kalmıyor, aynı zamanda alışveriş yapanların artırılmış gerçeklik aracılığıyla kendi alanlarındaki bir ürünü görmelerine olanak tanıyan bir aracı da görüyorlar.
Bunun gibi araçlar, alışveriş yapanların, satın almadan önce en sevdikleri Stikwood tahtalarının kendi alanlarında nasıl çalıştığını görmelerine yardımcı oluyor. Bu sadece müşterilere bilgi vermenin harika bir yolu değil Daha ürünler hakkında bağlam sağlar ancak “Bu ahşap rengi benim mekanıma sığar mı?” gibi Kendin Yap projelerinde sık karşılaşılan soruların yanıtlanmasına yardımcı olabilir. “Ne kadar sipariş vermem gerekiyor?”
Pazarlama Direktörü Steve Worth, ürün sayfalarına bu tür bir işlevsellik eklemenin Stikwood için çok önemli olduğunu söyledi:
Worth, “Korkulukların içinde kalmak istiyorsanız Shopify harika, ancak biz korkuluklarımızı kontrol etmek istedik” diyor. “Kendi sayfa bölümlerimizi tasarlama, istediğimiz gibi görünmelerini sağlama ve siteyi müşterilerin öğrenebileceği bir yere dönüştürme yeteneği, headless’a yatırım yapmamızın büyük bir nedeniydi.”
#cta-mini-fe#Stikwood’un neden e-ticaret deneyiminin tüm kontrolünü ele geçirdiği hakkında daha fazla bilgi edinin. Örnek olay incelemesini okuyun
3. Yükseltilmiş site içeriği aynı anda tek bir ürüne göre özelleştirilmiştir ve ayrıntılı yakın çekimler içerir
Ürün sayfaları yalnızca teknik özelliklerin iletilmesi için bir fırsat olmakla kalmaz, aynı zamanda her ürünün SKU’sunun en iyi özelliklerini vurgulayabilir.
DTC markası Nomad’ın mevcut her ürün tipi için farklı ürün sayfaları bulunmaktadır. Her sayfa biraz farklıdır ve belirli bir ürünün benzersiz özelliklerini vurgulamak için özelleştirilmiştir. Bu, tam olarak göz attığınız ürünle ilgili belirli ayrıntılara sahip olduğunuz için özellikle yararlıdır, ancak aynı zamanda Nomad’ın sonuç olarak çok spesifik Google arama reklamlarıyla eşleştirilecek ürün sayfaları da vardır.
Bu Nomad ürün sayfası, ürünü sergilemek için birlikte çalışan çeşitli öğeler içerir; Base One MagSafe Şarj Cihazını kullanmanın ne kadar kolay olduğunu gösteren bu gif gibi:
Bu daha ağır site içeriği, ürün ayrıntılarını göstermek için gerçekten işe yarıyor. Yüksek çözünürlüklü görüntüler (hareket halindeyken de değil!), bu şarj cihazının kompakt yapısını ve herhangi bir odanın dekoruna nasıl kolayca uyum sağladığını gösteriyor; bu ayrıntılar, Nomad müşterileri için önemli.
Benzer şekilde Spor Kordon ürün sayfasındaki görseller, bu ürünün pimli kapatma özelliğini net bir yakın çekimle vurgulamaktadır:
Müşteriler, bu görüntülerle bu ürünün ne kadar dayanıklı olduğuna dair net bir resim elde ediyor; bu, onu IRL’de denemekten sonraki en iyi şey.
Nomad’ın kurucu ortağı Brain Hahn, e-ticaret deneyimlerinde kaliteyi aktarmanın marka için kritik öneme sahip olduğunu söylüyor:
“Bir mağazaya gittiğinizde kaliteli bir saat kordonu ile kalitesiz bir saat kordonu arasındaki farkı anlayabilirsiniz. Hemen belli oluyor. Artık web sitenizin sizin için anlatması gerekiyor.”
Bu yüksek kaliteli yakın ürün yakın çekimlerine ve ayrıntılarına bu kadar önem vermelerinin nedeni budur; kaliteyi siteleri aracılığıyla iletmek çok önemlidir. her şey.
4. Yükseltilmiş site içeriği, alışveriş yapanlar için bağlam katmanları ekleyen zengin tasarım içerir
Bir e-ticaret yöneticisi olarak, tasarımın çevrimiçi alışveriş deneyiminizde oynadığı önemli rolün kesinlikle farkındasınız.
Peki ne tür tasarım öğeleri özellikle etkilidir? Hangileri ürün sayfalarınızı oluşturur? yükseltilmiş?
Hem Nomad hem de Stikwood, ürünlerinin değerini iletmek için aşağıdakiler gibi çeşitli görsel türler kullanıyor:
- Markaya özel ürün görselleri (Nomad için net yakın çekimler ve Stikwood için yüksek çözünürlüklü fotoğraflar)
- Şık arka plan videoları
- İnce animasyonlar (Göçebe)
- Her ürün sayfasındaki metni yoğunlaştırmak için açılır menüler (Stikwood)
Bu tasarım öğeleri, her iki markanın da müşterilere önemli bilgiler sağlarken değeri ve marka özlerini iletmelerine yardımcı olur. Hepsinden iyisi, her iki marka da sitelerinde başsız mimarinin avantajlarından yararlandığı için, site performansını düşüren zengin görseller konusunda endişelenmelerine gerek yok.
Örneğin, müşteriler Nomad.com’da iPhone 13 Pro Max kılıf sayfası gibi bir ürün sayfasını ziyaret ettiğinde ve ürün renkleri arasında geçiş yaptığında, sayfanın alt kısmının altındaki içerik, seçtikleri ürün rengine bağlanır.
Yani müşteri renkler arasında geçiş yaptığında ekranın alt kısmındaki içerik de onunla birlikte anında değişiyor. Bu, alışveriş yapan kişinin ürünü kişiselleştirirken inceleyerek mümkün olan en iyi deneyimi yaşamasına yardımcı olur. URL’nin seçilen renge bağlı olarak değiştiğine dikkat edin:
Nomad, sitenin varyantları değiştiriyormuş gibi görünmesini sağlamak için Shogun Frontend destekli sitesinde “varyant” UX’i kullanıyor, ancak sayfa aslında süper hızlı yükleniyor (o kadar hızlı ki alışveriş yapanlar URL değişikliğini fark etmiyor).
#cta-visual-fe#
Markalar yükseltilmiş ürün sayfalarını ve mağaza içeriğini nasıl oluşturuyor?
Yükseltilmiş ürün sayfalarının unsurlarını ele aldık, ancak Nomad ve Stikwood gibi markalar bu tür ayrıntılı site içeriğini nasıl kolaylaştırıyor?
Pek çok e-ticaret ekibi, zengin işlevsellik ve görsellere uyum sağlama konusunda sorunlarla karşılaşıyor. Bu acı genellikle standart özel temalar aşıldığında hissedilir.
Birçok e-ticaret web ekibi için sabit bir şey vardır: tasarım ve site performansı arasındaki dengebunun dikkate alınması gerekir. BENVitrin için sahip olduğunuz benzersiz vizyona ulaşmak zordur. Yani-sitenize daha karmaşık tasarım özellikleri ekledikçe bu genellikle kod şişmesine ve performans sorunlarına yol açar. Ama şimdi İleriyi düşünen markalar bu ödünleşimi aşarak gelişiyor.
Nomad ve Stikwood gibi markalar, e-ticaret deneyimleri üzerinde tam kontrole ihtiyaç duyuyor ve ön uç deneyimini (veya müşterinin gördüğü her şeyi) güçlendirmek için Shogun Frontend’i uyguladı. Sitenin üzerinde çalıştığı teknolojiyi değiştirmek ve ön ve arka uçları birbirinden ayırmak, markaların daha fazla dönüşüm için ürün sayfalarını (ve tüm site içeriğini) bir sonraki seviyeye taşımasına yardımcı olur.
Yani bu markalar standart temaların ötesine geçti. Artık daha yenilikçi bir site kullanıyorlar teknoloji Bu inanılmaz deneyimleri beslemek için.
Shogun Frontend destekli vitrinler, aşamalı web uygulaması (PWA) teknolojisini kullanır. PWA’lar, mağazanızın (API’ler aracılığıyla iletişim kuran) ön ucunu ve arka ucunu ayırmanıza yardımcı olur; bu, arka ucu etkilemeden sitenizin müşteriye yönelik katmanında (ön uç) değişiklikler yapabileceğiniz anlamına gelir.
Başsız ticaretle ilişkili esnekliği elde etmek için hepsi bir arada bir ön uç platformu seçen Stikwood ve Nomad, altyapıyı kendilerinin kurmanın karmaşıklığı olmadan başsız ticaretin tüm avantajlarından yararlanıyor.
Sonraki seviye mağaza tasarımı
Shogun Frontend ile Stikwood ve Nomad tam bir vitrin kontrolü elde etti; yapabilirler tam ön uç deneyimini tasarlayınplatform kısıtlamaları veya tanklama sahası performansı hakkında endişelenmeden hayal ediyorlar. Shogun Frontend’deki canlı önizleme yoluyla mağaza içeriğini güvenle oluşturup yayınlayabilirler.
Stikwood veya Nomad ekipleri yeni bir arka plan videosu veya başlık görseli ile denemeler yapmak isterlerse, bir geliştirici ekibine danışmadan yayınlamaya başlamadan önce nasıl görüneceğini görebilirler. Bu onları çevik ve yenilikçi tutar.
Aynı şekilde, Stikwood ve Nomad’ın teknik olmayan ekip üyeleri artık site genelinde değişiklikleri hızlı ve kolay bir şekilde gerçekleştirebiliyor. olmadan Yeniden kullanılabilen kodsuz bölümlerle geliştirici kaynaklarından faydalanma.
–
Bu, site güncellemeleriyle ilişkili birçok iş akışı engelleyicisini ortadan kaldırır, böylece geliştiriciler yüksek öncelikli görevlere odaklanabilir ve teknik olmayan ekibiniz gönderime devam edebilir.
Stikwood, Shogun Frontend ile yeni sayfaları çok daha hızlı açabileceklerini söylüyor:
“Hızlı ve gevşek koşuyoruz, dolayısıyla hepimizin aynı anda çalışabiliyor olması çok önemli.Geliştiricilerimize aşırı yükleme yapmadan daha fazlasını daha hızlı yapmamıza yardımcı oluyor ve bu da bize tonlarca zaman kazandırıyor.”
Rakipsiz site hızı
Hepsinden iyisi, bunun gibi bir platformla ön uçlarının kontrolünü ele alan markalar, performanstaki düşüşlerden endişe etmeden dudak uçuklatan ürün sayfaları oluşturabilir. Shogun Frontend PWA’lar yalnızca bir kez yüklenir ve web sitenizin gerekli bölümlerini doldurmak için cerrahi benzeri hassasiyet kullanır.
Başka bir deyişle, müşteriler alışveriş yaptıkça sitenizin tamamının yeniden yüklenmesine gerek kalmaz ve onlara yalnızca alışveriş yapılan bölümler gösterilir. ihtiyaç bir anda gösterilecek.
Örneğin, bir müşteri ana sayfanıza geldiğinde ekranın alt kısmındakiler, tek seferde sunulmak yerine sayfayı kaydırdıkça sunulacaktır.
Bu hassasiyet ve azaltılmış veri toplama ihtiyacı, sitenize neredeyse anında sayfa yükleme deneyimi sağlar. Tam olarak istediğiniz site içeriğine ve deneyimine, hiçbir yavaşlama olmadan sahip olabilirsiniz.
Stikwood ve Nomad, site içerikleriyle müşterilerinin beklentilerinin ötesine geçiyor. Her ikisi de bu tür yüksek bir e-ticaret deneyimine ulaşmanın farklı bir yaklaşım ve teknoloji gerektireceğinin farkındaydı.
Shogun Frontend aracılığıyla başsızlığa giden radikal biçimde farklı bir rota seçmek, diğer başsız yöntemlerin sıklıkla getirdiği karmaşıklıklar hakkında endişelenmeden bu yüksek deneyimi iyileştirmeye odaklanabilecekleri anlamına geliyordu.
E-ticaret markalarını ölçeklendirmek için yükseltilmiş site içeriği oluşturma
Yükseltilmiş ürün sayfaları ve site içeriği oluşturmak (tasarım ve performans arasındaki ödünleşim ihtiyacını ortadan kaldırmak), bu sayfaları öne çıkaran unsurları destekleyebilecek teknolojiye ihtiyacınız var.
Temelinde PWA teknolojisinin yanı sıra ayrıştırılmış bir mimari bulunan bir site oluşturduğunuzda, müşteri beklentilerini aşan ve dönüşüm sağlayan bir site oluşturabilirsiniz!
Genel olarak ürün sayfaları yalnızca satış amaçlı değildir. Ayrıca müşterilerinizle beklenmedik bir şekilde, doğru teknolojiyle bağlantı kurmanızı sağlayan bir ağ geçidi de olabilirler.
#cta-visual-fe#
