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

JioHotstar, Hindistan'da 400 milyonu aşan bir kullanıcı tabanına hizmet veren önde gelen bir yayın platformudur. 330.000 saatin üzerinde seç-izle video (VOD) içeriğini kapsayan geniş bir içerik kitaplığına ve büyük spor etkinliklerinin anlık olarak yayınlanmasına sahip olan bu platform, büyük ölçekte faaliyet gösterir.

JioHotstar, geniş kitlesine birinci sınıf bir deneyim sunmak için uygulamasını katlanabilir cihazlar ve tabletler için optimize ederek izleme deneyimini iyileştirdi. Bunu, Google'ın uyarlanabilir uygulama yönergelerini izleyerek ve tüm ekran boyutlarında tutarlı bir şekilde sorunsuz ve ilgi çekici bir deneyim oluşturmaya yardımcı olmak için örnekler, codelab'ler, yemek kitapları ve dokümanlar gibi kaynaklardan yararlanarak başardılar.

JioHotstar'ın büyük ekran sorunu

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

Ne yapmaları gerekiyordu?

JioHotstar'ın kullanıcı arayüzü, öncelikli olarak standart telefon ekranları için tasarlanmıştı. Bu nedenle, diğer form faktörlerinin çeşitli ekran boyutlarına ve çözünürlüklerine göre hero resim en-boy oranlarını, menüleri ve program ekranlarını uyarlamada zorluklar yaşandı. Bu durum genellikle resim kırpmaya, letterbox'a, düşük çözünürlüğe ve özellikle yatay modda kullanılmayan alana yol açıyordu. JioHotstar, tabletlerin ve katlanabilir cihazların özelliklerinden tam olarak yararlanmaya ve bu cihaz türlerinde optimize edilmiş bir kullanıcı deneyimi sunmaya yardımcı olmak 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ğlandı.

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ştirmeye yönelik bir girişimde bulundu. 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ü sunabiliyor.

JioHotstar, uygulamanın ne kadar kullanılabilir alanı olduğunu öğrenmek için Material 3 Adaptive kitaplığını kullanarak bu deseni izledi. Önce currentWindowAdaptiveInfo() işlevini çağırın, ardından üç pencere boyutu sınıfı için yeni düzenleri buna göre 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()
}

API, dahili olarak daha büyük veya eşit bir değer olup olmadığını kontrol ettiğinden kesme noktaları en büyükten en küçüğe doğru sıralanır. Bu nedenle, 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 sunar. Bu özellik, katlanabilir bir cihaz eller serbest deneyimi için kısmen katlandığında video oynatıcıyı ekranın üst yarısına, video kontrollerini ise alt yarısına taşır.

Bunu yapmak için Material 3 Adaptive kitaplığı da kullanılarak masaüstü modu sorgulanabilir. Bunun için aynı currentWindowAdaptiveInfo() kullanılabilir. Cihaz masaüstü modunda tutulduktan sonra, duruşun üst ve alt yarısına uygun bir düzen değişikliği yapılabilir. Bu değişiklikle, oynatıcı üst yarıya, kontrol cihazları ise alt yarıya yerleştirilir:

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

JioHotstar artık 1. Katman için Büyük Ekranlarda Uygulama Kalitesi Yönergeleri'ne uygun. Ekip, bu önerileri uygulamak için uyarlanabilir uygulama kılavuzundan yararlanarak örnekler, codelab'ler, yemek kitapları ve dokümanlardan faydalandı.

JioHotstar, kullanıcı deneyimini daha da iyileştirmek için video keşif sayfalarındaki dokunma hedefi boyutlarını önerilen 48 dp'ye yükselterek büyük ekranlı cihazlarda erişilebilirliği sağladı. Video ayrıntıları sayfası artık uyarlanabilir olup ekran boyutlarına ve yönlerine göre ayarlanıyor. Basit görüntü ölçeklendirme işleminin ötesine geçerek pencere boyutunu ve yoğunluğunu gerçek zamanlı olarak algılamak için pencere boyutu sınıflarından yararlandılar ve her form faktörü için en uygun ana resmi yükleyerek görsel doğruluğu artırdılar. Düzenlerin farklı ekran boyutlarına uyacak şekilde ayarlanmasıyla gezinme deneyimi de iyileştirildi.

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

"Google ile 1. Katman büyük ekran uygulaması 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 optimizasyonun uyarlanabilirlikten daha fazlası olduğuna, katlanabilir cihazları, tabletleri ve bağlı TV'leri hızla benimseyen izleyicilerin izleme deneyimini iyileştirmekle ilgili olduğuna her zaman inandık.

Google'ın Jetpack kitaplıklarından ve rehberlerinden yararlanarak içerik tüketimiyle ilgili analizlerimizi platform yeniliği konusundaki uzmanlıklarıyla birleştirebildik. Bu işbirliği sayesinde her iki ekip de sınırları zorlayarak eksiklikleri gidermiş ve her ekran boyutunda sorunsuz, etkileyici bir deneyim sunmak için birlikte çalışmıştır.

Bu gelişmiş deneyimi milyonlarca kullanıcıya sunmaktan ve Hindistan ile dünyanın akış deneyiminde yeni standartlar belirlemekten gurur duyuyoruz."
- Sonu Sanjeev, Kıdemli Yazılım Geliştirme Mühendisi