Başarılı Örnekler

Akıllı telefonun ötesinde: JioHotstar, kullanıcı deneyimini katlanabilir cihazlar ve tabletler için nasıl optimize etti?

Okuma süresi: 3 dk.
Charles Munger'ın profilini görüntüle
Prateek Batra Geliştirici İlişkileri Mühendisi, Android Uyarlanabilir Uygulamalar

Telefonların Ötesinde: JioHotstar Nasıl Uyarlanabilir Bir Kullanıcı Deneyimi Oluşturdu?

JioHotstar, Hindistan'da 400 milyonu aşkın kullanıcı tabanına hizmet veren önde gelen bir yayın platformudur. 330.000 saati aşkın seç-izle video (VOD) içeriği ve önemli spor etkinliklerinin gerçek zamanlı yayınıyla devasa bir içerik kitaplığına sahip olan platform, çok büyük bir ölçekte faaliyet gösteriyor.

JioHotstar, geniş kitlelerine üst düzey bir deneyim sunmak için uygulamasını katlanabilir cihazlar ve tabletler için optimize ederek izleme deneyimini daha iyi hale getirdi. Bunu, Google'ın uyarlanabilir uygulama kılavuzunu takip ederek ve tüm ekran boyutlarında tutarlı, sorunsuz ve ilgi çekici bir deneyim oluşturmaya yardımcı olan örnekler, kod laboratuvarları, yemek kitapları ve belgeler gibi kaynaklardan yararlanarak başardılar.

JioHotstar'ın büyük ekran zorluğu

JioHotstar, standart telefonlarda mükemmel bir kullanıcı deneyimi sunuyordu ve ekip, yeni form faktörlerinden yararlanmak istiyordu. Ekip, kullanıcı deneyimini katlanabilir cihazlara ve tabletlere genişletmek için gereken optimizasyonları anlamak amacıyla öncelikle uygulamalarını büyük ekranlarda uygulama kalitesi yönergelerine göre değerlendirdi. 1. Kademe büyük ekran uygulama statüsüne ulaşmak için ekip, uygulamayı çeşitli form faktörlerine uyarlamak ve katlanabilir cihazlarda farklılaştırmak amacıyla iki stratejik güncelleme uyguladı. JioHotstar, katlanabilir cihazların ve tabletlerin sunduğu benzersiz zorlukları ele alarak tüm ekran boyutlarında ve en boy oranlarında yüksek kaliteli ve sürükleyici bir deneyim sunmayı amaçlıyor.

Yapmaları gerekenler

Öncelikle standart telefon ekranları için tasarlanan JioHotstar kullanıcı arayüzü, hero resim en boy oranlarını, menüleri ve program ekranlarını diğer form faktörlerinin farklı ekran boyutlarına ve çözünürlüklerine uyarlama konusunda zorluklarla karşılaştı. Bu durum genellikle resim kırpma, sinemaskop, düşük çözünürlük ve özellikle yatay modda kullanılmayan alanlara neden oluyordu. JioHotstar, tabletlerin ve katlanabilir cihazların özelliklerinden tam olarak yararlanmak ve bu cihaz türlerinde optimize edilmiş bir kullanıcı deneyimi sunmak için kullanıcı arayüzünü iyileştirmeye odaklandı. Böylece daha geniş bir cihaz yelpazesinde optimum düzen esnekliği, görüntü oluşturma ve gezinme sağladı.

Ne yaptılar?

JioHotstar, büyük ekranlarda daha iyi bir izleme deneyimi sunmak için WindowSizeClass'ı entegre ederek ve kompakt, orta ve geniş ekranlar için optimize edilmiş düzenler oluşturarak uygulamasını geliştirdi. Bu sayede uygulama, kullanıcı arayüzünü çeşitli ekran boyutlarına ve en boy oranlarına uyarlayarak farklı cihazlarda tutarlı ve görsel açıdan çekici bir kullanıcı arayüzü sunabildi.

JioHotstar, uygulamanın ne kadar kullanılabilir alanı olduğunu öğrenmek için Material 3 Adaptive kitaplığını kullanarak bu kalıbı uyguladı. Önce currentWindowAdaptiveInfo() işlevini çağırın, ardından üç pencere boyutu sınıfı için yeni düzenleri uygun şekilde kullanın:

val sizeClass = currentWindowAdaptiveInfo().windowSizeClass

if(sizeClass.isWidthAtLeastBreakpoint(WIDTH_DP_EXPANDED_LOWER_BOUND)) {
    showExpandedLayout()
} else if(sizeClass.isHeightAtLeastBreakpoint(WIDTH_DP_MEDIUM_LOWER_BOUND)) {
    showMediumLayout()
} else {
    showCompactLayout()
}

Kesme noktaları, en büyükten en küçüğe doğru sıralanır. API, dahili olarak daha büyük veya eşit bir değer olup olmadığını kontrol ettiğinden, en az EXPANDED değerinden büyük veya bu değere eşit olan tüm genişlikler her zaman MEDIUM değerinden büyük olur.


JioHotstar, katlanabilir cihazlara özel premium deneyim olan masaüstü modunu sunabiliyor. Bu özellik, katlanabilir bir cihaz kısmen katlandığında video oynatıcıyı ekranın üst yarısına, video kontrollerini ise alt yarısına taşıyarak eller serbest deneyimi sunar.

Bunu yapmak için Material 3 Adaptive kitaplığını da kullanarak masaüstü modunu sorgulamak üzere aynı currentWindowAdaptiveInfo() kullanılabilir. Cihaz masaüstü modunda tutulduğunda, duruşun üst ve alt yarısına uyacak şekilde düzen değişikliği yapılabilir. Bunun için oynatıcıyı üst yarıya, kumandaları ise alt yarıya yerleştirecek bir sütun kullanılabilir:

val isTabletTop = currentWindowAdaptiveInfo().windowPosture.isTabletop
if(isTabletopMode) {
   Column {
       Player(Modifier.weight(1f))
       Controls(Modifier.weight(1f))
   }
} else {
   usualPlayerLayout()
}

JioHotstar artık 1. kademe için büyük ekran uygulama kalitesi yönergelerine uygundur. Ekip, bu önerileri dahil etmek için örnekler, kod laboratuvarları, yemek kitapları ve belgelerden yararlanarak uyarlanabilir uygulama kılavuzunu kullandı.

JioHotstar, kullanıcı deneyimini daha da iyileştirmek için video keşif sayfalarında dokunma hedefi boyutlarını önerilen 48 dp'ye yükselterek büyük ekranlı cihazlarda erişilebilirlik sağladı. Video ayrıntıları sayfası artık uyarlanabilir olduğundan ekran boyutlarına ve yönlerine göre ayarlanıyor. Basit resim ölçeklendirmenin ötesine geçerek pencere boyutu sınıflarından yararlandılar. Bu sayede pencere boyutunu ve yoğunluğunu anlık olarak algılayıp her form faktörü için en uygun hero resmi yükleyerek görsel doğruluğu artırdılar. Gezinme de iyileştirildi ve düzenler farklı ekran boyutlarına uyacak şekilde uyarlandı.

Kullanıcılar artık JioHotstar'daki favori içeriklerini büyük ekranlı cihazlarda daha iyi ve optimize edilmiş bir görüntüleme deneyimiyle izleyebilir.

"Google ile 1. Kademe büyük ekran uygulama statüsüne ulaşmak, ortak vizyonumuzun gücünü yansıtan bir dönüm noktasıdır. JioHotstar olarak, büyük ekranlı cihazlar için optimizasyon yapmanın uyarlanabilirliğin ötesine geçtiğine, katlanabilir cihazları, tabletleri ve bağlı TV'leri hızla benimseyen kitleler için izleme deneyimini iyileştirmekle ilgili olduğuna her zaman inandık.

Google'ın Jetpack kitaplıklarından ve kılavuzlarından yararlanarak içerik tüketimiyle ilgili analizlerimizi Google'ın platform inovasyonu konusundaki uzmanlığıyla birleştirdik. Bu işbirliği sayesinde her iki ekip de sınırları zorladı, eksikleri giderdi ve her ekran boyutunda sorunsuz, sürükleyici bir deneyim oluşturdu.

Bu gelişmiş deneyimi milyonlarca kullanıcıya sunmaktan ve Hindistan'da ve dünyada yayın deneyimi için yeni standartlar belirlemekten gurur duyuyoruz."
- Sonu Sanjeev, Kıdemli Yazılım Geliştirme Mühendisi

Yazan:
Okumaya devam et