Shopify Site İncelemesi: rains.com

Bugün inceleyeceğim site Rains.com. Rains, 2012 yılında Danimarka’da kurulmuş bir marka. Yağmurluk ve su geçirmez çantalar üretiyorlar. Shopify altyapısını, oldukça akıllıca kodlanmış bir temayla kullanıyorlar. Bu incelemede, görüp çok beğendiğim Rains.com’un temasını inceleyip notlarımı paylaşacağım.

• Ana sayfanın tamamı Hero Media sectionlarından oluşuyor. Carousel kullanmayıp tüm odağı tek bir görsel veya videoya çekmek oldukça akıllıca. Kullanıcıların ancak çok çok az bir kısmının carousel alanlarındaki diğer görsellere tıkladığı pek çok araştırma ile ortaya konmuş bir gerçek. Yani carousel kurgusu gereksiz ve site üzerinde satışa dönüşmeyen bir ağırlık yaratıyor. Her şey görünür olmalı.

• Menu click ile aktive oluyor, yine sevdiğim bir kurgu. Bu kurguda, menü içeriğinin de click sonrasında yüklenmesi mümkün, yani ilk açılışa ağırlık bindirilmemiş oluyor. Hover kurgusu daha akıcı bir deneyim sunsa da menü içeriklerinin görüntülenmeye hazır şekilde bekletilmesi performans açısından olumsuz olabiliyor. Ayrıca hover kurgusu mobilde yok, yani desktop ile mobil arasında farklı bir deneyim sunulmuş oluyor ki bu da UX açısından olumsuz olabilecek bir durum.

• Sitenin en çok kullanılan sayfaları olan Home, PDP ve PLP’de gereksiz section kullanımından kaçınılmış. Karmaşık aksiyonlar yerine mesajı daha basit ama güçlü vermeye odaklanılmış. Bu da çok iyi bir optimizasyon.

• Sitede kullanılan product card kurgusuna ise bayıldım.
  • Variant’lar renklere bağlı ve alt grup olarak yükleniyor, yani her renk variant’ı başka bir subcard çağırıyor.
  • Renk variant’larının tek amacı farklı renkleri gösterebilmek, diğer özelleştirmeler ve satın alma için ürüne gidilmesi gerekiyor.
  • Her variant subcard olduğu için de bu subcard’ları sonradan çağırıp ilk yüklemeye yük bindirmemek mümkün.
  • Variant görselleri de hover’lanabiliyor böylece, hover aksiyonu sadece ilk ürünle sınırlı kalmıyor.
  • Size’lar gösteriliyor ama sadece bilgi için, tıklanmıyorlar, variant değiştirmiyorlar. İşleri karmaşıklaştırmaya gerek yok sonuçta.

• PDP de çok iddialı ama bir o kadar da basit.

  • Ürün görselleri akıyor ama üstüne gelince dursun gibi bir çaba yok, temalarımızdaki bir section’da bu durdurma işlemini yapabilmek için çok zaman kaybetmiştik.
  • Görseller üzerinde fazladan ikonlar yok, zoom için görsele tıklanıyor ve açılıyor, açılınca da tıklanıp kapanıyor. Basit.
  • Tüm ekran product gallery olduğu için de bilgi info alanı ile denk geldi mi, sticky mi, çok mu büyüdü gibi dertler yok, tertemiz full ekran.

• Sitede görseller en fazla 2048px ile sınırlandırılmış. Videolar da sizeları ile karşılaştırıldığında epey ufak. Aşırı bir süper kalite olsun hedefi de yok, mesaj dev medialarla verilmiş oluyor zaten.

• Quick ATC, Shoppable, Interactive Banner gibi bizim temalarımızda çılgın atan ve dar alanda çok iş yapmaya çalışan sectionlar bu sitenin temasında yok, alanları geniş geniş kullanmışlar. En çok emek verilen kısım product card’lar gibi onda da bayıldığım akıllıca yöntem ve işlev basitleştirme oldukça işe yaramış.

• PLP’de kullanılan Load More ile Page 2’de önceki ürünlerin gözükmemesi sorununu nasıl aşmışlar diye baktım. Sayfaya direkt Page 2’den girince aşılan bir şey yok, yani problem orada duruyor. Ancak aşağı doğru inilip de Show more butonu görüş alanına girince yukarıdaki ürünlerk kendi kendine yükleniyor.

• Yine PLP’de Load More kısmında sayfa sayısı yerine şu kadar ürünün şu kadarı gösteriliyor bilgisi de oldukça insancıl. Kim ne yapsın sayfa sayısını? Bana ürün sayısını göster, kaç ürün olduğunu anlamam için bana sayfa sayısı ile sayfadaki ürün sayısını bölüp çarptırma.

• Search önerilenlerde ve PDP’deki variant seçiminde dekupe görseller kullanılmış, böylece köşeler gitmiş, ürün daha çok ortaya çıkmış.

Özetle;
Rains.com oldukça akıllıca tasarlanmış ve kodlanmış bir site. Shopify altyapısını en iyi şekilde kullanmışlar. Tema oldukça basit ve sade, gereksiz sectionlar ve aksiyonlar kullanılmamış. Ürün kartları ve PDP oldukça basit ve etkili.

Solo bir developer olsam ve basit bir tema yayınlamak istesem bu temayı yayınlardım. Çok fazla özellik eklemeye çalışırken tema içinde kaybolmadan ve temayı ağırlaştırmadan bunun gibi hedefe odaklanmış ve işlevini en iyi şekilde yerine getirmiş bir tema gerçekten harika bir iş yapar