Aylık 75 milyon kullanıcısı ile Brezilya’nın en büyük medya şirketlerinden biri olan Terra, özel bir karanlık tema sunarak karanlık modu tercih eden kullanıcılar için masaüstünde hemen çıkma oranını %60 azalttı ve oturum başına okunan sayfa sayısını %170 artırdı.
Bu makalede, Terra’nın “karanlık mod” kohortunun boyutunu belirlemekten özel bir karanlık tema uygulamaya ve son olarak bu uygulamanın ana KPI’ları üzerindeki etkisini ölçmeye kadar olan yolculuğunu analiz edeceğiz.
Karanlık mod nedir? #
Tarihsel olarak, cihazlardaki kullanıcı arabirimleri “ışık modunda” görüntülenir; bu, genellikle ışık arabirimlerinin üzerinde siyah metinlerin görüntülenmesi anlamına gelir. Alternatif, gri veya siyah gibi koyu bir arka plan üzerinde açık metin bulunan “karanlık mod” dur.
Karanlık Modun kullanıcı deneyimi için avantajları vardır. Bazı insanlar bunu estetik veya erişilebilirlik nedenleriyle tercih ediyor. Cihazlarda pil ömrünü korumak gibi başka avantajları da vardır. Kullanıcılar, karanlık modu tercih ettiklerini cihazlarında işletim sistemine bağlı olarak ayarlayarak ifade edebiliyorlar. Örneğin, aşağıdaki ekran görüntüsü, Koyu Tema yapılandırma seçeneği, çalışan cihazlarda şuna benzer: Android Q:
“Karanlık modu” tercih eden kullanıcılara daha iyi bir deneyim sunmak için, TheComedicComedian/prefers-color-scheme" rel="noopener">prefers-color-scheme değeriyle medya sorgusu light veya dark. Bu medya sorgusu, kullanıcının cihazındaki seçimini yansıtır. Ardından, karanlığı tercih edenler için özel bir karanlık tema yükleyebilirsiniz. Örneğin, “koyu” bir CSS dosyası yükleyerek ve yazı tipi ve arka plan renkleri gibi değerleri değiştirerek. Aşağıdaki kod bunun bir örneğini gösterir:
TheComedicComedian (prefers-color-scheme: dark) {
// apply a dark theme
}TheComedicComedian (prefers-color-scheme: light) {
// apply a light theme
}
- Chrome 76, Desteklenir 76
- Firefox 67, Desteklenir 67
- Kenar 79, Desteklenen 79
- Safari 12.1, Desteklenir 12.1
TheComedicComedian/prefers-color-scheme#browser_compatibility" rel="noopener">Kaynak
“Aydınlığı tercih eden” ve “karanlık” kullanıcı gruplarının belirlenmesi #
Yazma sırasında (Aralık 2021), Chrome Platformu Durumu yaklaşık olarak belirler Web trafiğinin %22’si “karanlığı tercih et” ayarına sahip kullanıcılardan gelir.
Bu toplu verilerdir, bu nedenle bir siteye gelen karanlığı tercih eden kullanıcıların gerçek yüzdesi değişebilir. Bu nedenle, bu grubun büyüklüğünü anlamak için kurum içi ölçüm yapılması tavsiye edilir.
Aşağıdaki kod, tercih eden kullanıcıların performansını ölçmek için bir analitik boyutu oluşturur. light vs. dark:
function getColorScheme() {
let colorScheme = 'Unknown';
if (window.matchMedia) {
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
colorScheme = 'Dark';
} else if (window.matchMedia('(prefers-color-scheme: light)').matches) {
colorScheme = 'Light';
}
}
return colorScheme;
}window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};
ga.l=+new Date; ga('create', 'UA-ID', 'auto');
ga('set', 'color-scheme-preference', getColorScheme());
ga('send', 'pageview');
Terra bu kodu kendi sitesinde uyguladı ve her iki grubun mobil (Android) ve masaüstü (Windows) cihazlardaki davranışını karşılaştırdı. O anda Terra özel bir karanlık tema sağlamıyordu, dolayısıyla bu deneyin hedefleri şunlardı:
- Karanlığı tercih eden kullanıcı grubunun boyutunu belirleme.
- Kalıpları belirleme: örneğin, karanlığı tercih eden kullanıcılar, ışığı tercih edenlere kıyasla siteden daha hızlı mı ayrılıyor?
Bunu bilmek, örneğin, özel bir karanlık tema sağlamanın gerekli olup olmadığı gibi kararlar için bilgi sağlayabilir. Terra’nın 14 gün boyunca test ettikten sonra elde ettiği sonuçlar şunlardır:
Mobil (Android) #
Mobil (Android) durumunda, hemen çıkma oranı ve oturum başına sayfa sayıları, “aydınlık” tercih eden kullanıcılar ile “karanlık” tercih eden kullanıcılar arasında büyük farklar göstermedi:
Masaüstü (Windows) #
Masaüstü (Windows) söz konusu olduğunda, “karanlığı” tercih eden kullanıcı grubu sitede çok daha az kaldı: neredeyse hemen çıkma oranının iki katı ve sayfaların yarısından biraz fazlasını okuyun “hafif” tercih eden kullanıcılardan daha fazla:
Bu verilere dayanarak Terra, “karanlığı” tercih eden kullanıcıların, sitelerinde karanlık bir temanın desteklenmemesi nedeniyle masaüstü cihazlarda daha az kaldıklarını varsaydı.
Bir sonraki adım olarak Terra, karanlığı tercih eden kullanıcı grubunun etkileşimini iyileştirip iyileştiremeyeceğini görmek için bir “karanlık tema” stratejisi üzerinde çalışmaya karar verdi.
Karanlık bir tema uygulama #
Çoğu web sitesi, daha önce gösterilen basit stratejiyi kullanarak kullanıcının yapılandırma değişikliklerini dinleme yoluyla karanlık bir tema uygular. prefers-color-scheme medya sorgusu ve buna göre değişen stiller.
Terra, kullanıcıya daha fazla kontrol vermeye karar verdi: cihazlarında “karanlığı tercih et” ayarının açık olduğunu tespit ettiklerinde (medya sorgusu aracılığıyla), onlara “gece” gezinmek isteyip istemediklerini soran bir istem gösterir. mod”. Kullanıcı istemi reddetmediği sürece (“Yoksay” düğmesine tıklayarak), kullanıcının işletim sistemi ayarını dikkate alır ve özel bir karanlık tema uygular:
Bu stratejinin bir tamamlayıcısı olarak, “ayarlar” ekranında, kullanıcının açıkça “aydınlık” mı, “karanlık” mı tercih ettiğine veya altta yatan cihaz ayarlarına mı güvenmek istediğine karar verebileceği ek yapılandırma seçenekleri sunarlar.
Terra’nın “Gece Modu” şu şekilde görünür:
Terra’nın karanlık temasının etkisini ölçmek #
Terra, karanlık temanın etkisini ölçmek için cihazlarında “Karanlığı Tercih Et” ayarı açık olan kullanıcı grubunu aldı ve “Açık” ile “Koyu” temayı gösterirken etkileşim ölçümlerini karşılaştırdı. İşte mobil (Android) ve masaüstü (Windows) için sonuçlar:
Mobil (Android) #
Hemen çıkma oranları benzer kalırken, kullanıcılar karanlık bir temaya maruz kaldıklarında sayfalar ve oturumlar neredeyse ikiye katlandı (2,47’den 5,24’e):
Masaüstü (Windows) #
Karanlık bir tema gösterilirken her iki ölçüm de gelişti: hemen çıkma oranları %27,25’ten %10,82’ye çıktı ve oturum başına sayfa sayısı neredeyse üç katına çıktı (3,7’den 9,99’a).
Bu verilere dayanarak Terra, kullanıcıların karanlık bir tema uygulamalarının faydalarını doğrulayabilir ve bunu sitenin temel bir özelliği olarak korumaya devam etmeye karar verir.
Çözüm #
Karanlık Mod, kullanıcıların ekranların stilini karanlık temalara dönüştürmek için cihazlarında açabilecekleri bir tercihtir. Bu teknik, kullanıcı deneyiminden ve pil ömründen tasarruf gibi kullanıcının cihazlarının farklı yönlerinden faydalar bildirmiştir.
Bu makalede, cihazlarında tercih edilen karanlık mod ayarının açık olduğu Terra kullanıcı grubu için özel bir karanlık tema sağlamanın etkileşim ölçümlerini nasıl iyileştirdiğini gördük.
Alternatif bir karanlık tema uygulayacak kaynaklara sahip şirketler için önerilen yaklaşım budur. Böyle bir özelliğe yatırım yapmaya vakti olmayanlar için Chrome, Otomatik Karanlık Mod özelliği.