স্মার্টফোনের বাইরে: JioHotstar কীভাবে ফোল্ডেবল ও ট্যাবলেটের জন্য তার UX অপ্টিমাইজ করেছে

ফোনের বাইরে: JioHotstar কীভাবে একটি অ্যাডাপ্টিভ UX তৈরি করেছে

JioHotstar হল ভারতের একটি শীর্ষস্থানীয় স্ট্রিমিং প্ল্যাটফর্ম, যা ৪০০ মিলিয়নেরও বেশি ব্যবহারকারীকে পরিষেবা প্রদান করে। ৩,৩০,০০০ ঘণ্টারও বেশি চাহিদা অনুসার ভিডিও (VOD) এবং প্রধান প্রধান স্পোর্টিং ইভেন্টের রিয়েল-টাইম ডেলিভারি সহ একটি বিশাল কন্টেন্ট লাইব্রেরি সহ, প্ল্যাটফর্মটি একটি বিশাল স্কেলে কাজ করে।

বিশাল সংখ্যক দর্শকদের প্রিমিয়াম অভিজ্ঞতা প্রদান করতে, JioHotstar তাদের অ্যাপকে ফোল্ডেবল ও ট্যাবলেটের জন্য অপ্টিমাইজ করে দেখার অভিজ্ঞতাকে আরও উন্নত করেছে। তারা Google-এর অ্যাডাপ্টিভ অ্যাপ সংক্রান্ত নির্দেশিকা অনুসরণ করে এবং  স্যাম্পেল, কোডল্যাব, কুকবুক এবং ডকুমেন্টেশন -এর মতো রিসোর্স ব্যবহার করে এটি সম্পন্ন করেছে, যাতে সব ডিসপ্লে সাইজ জুড়ে একটি নিরবচ্ছিন্ন এবং আকর্ষক অভিজ্ঞতা তৈরি করা যায়।

JioHotstar-এর বড় স্ক্রিন চ্যালেঞ্জ

JioHotstar স্ট্যান্ডার্ড ফোনে একটি চমৎকার ব্যবহারকারীর অভিজ্ঞতা অফার করেছে এবং টিম নতুন ফর্ম ফ্যাক্টরের সুবিধা নিতে চেয়েছে। শুরুতে, টিম তাদের অ্যাপকে বড় স্ক্রিনের অ্যাপ কোয়ালিটি নির্দেশিকা-এর সাথে তুলনা করে মূল্যায়ন করেছে যাতে ফোল্ডেবল এবং ট্যাবলেটে ব্যবহারকারীর অভিজ্ঞতা বাড়ানোর জন্য প্রয়োজনীয় অপ্টিমাইজেশন বোঝা যায়। টিয়ার ১ বড় স্ক্রিন অ্যাপ স্ট্যাটাস অর্জন করতে, টিম বিভিন্ন ফর্ম ফ্যাক্টর জুড়ে অ্যাপটিকে মানিয়ে নিতে এবং ফোল্ডেবল ডিভাইসে আলাদা করতে দুটি কৌশলগত আপডেট প্রয়োগ করেছে। ফোল্ডেবল ও ট্যাবলেট ডিভাইসের ক্ষেত্রে অনন্য চ্যালেঞ্জের সমাধান করে, JioHotstar-এর লক্ষ্য হল সব ডিসপ্লে সাইজ ও অ্যাস্পেক্ট রেশিও জুড়ে খুব ভাল কোয়ালিটি ও নিমজ্জিত অভিজ্ঞতা প্রদান করা।

তাদের কী করতে হবে

JioHotstar-এর ইউজার ইন্টারফেস, মূলত স্ট্যান্ডার্ড ফোন ডিসপ্লের জন্য ডিজাইন করা হয়েছে, যা অন্যান্য ফর্ম ফ্যাক্টরের বিভিন্ন স্ক্রিন সাইজ এবং রেজোলিউশনে অনেক বড় ছবির অ্যাস্পেক্ট রেশিও, মেনু এবং শো স্ক্রিন অ্যাডাপ্ট করার ক্ষেত্রে চ্যালেঞ্জের সম্মুখীন হয়েছে। এর ফলে প্রায়ই ছবি ক্রপ করা, লেটারবক্সিং, কম রেজোলিউশন ও অব্যবহৃত স্পেসের মতো সমস্যা দেখা দেয়, বিশেষ করে ল্যান্ডস্কেপ মোডে। ট্যাবলেট ও ফোল্ডেবল ডিভাইসের ক্ষমতা সম্পূর্ণভাবে কাজে লাগাতে এবং এইসব ডিভাইসে অপ্টিমাইজ করা ব্যবহারকারীর অভিজ্ঞতা প্রদান করতে, JioHotstar, UI রিফাইন করার উপর ফোকাস করেছে যাতে আরও বেশি ডিভাইসে অপ্টিমাল লেআউট ফ্লেক্সিবিলিটি, ইমেজ রেন্ডারিং ও নেভিগেশন নিশ্চিত করা যায়।

তারা কী করেছেন

বড় স্ক্রিনে আরও ভালো দেখার অভিজ্ঞতা প্রদান করার জন্য, JioHotstar তার অ্যাপে WindowSizeClass অন্তর্ভুক্ত করে এবং কম্প্যাক্ট, মাঝারি ও এক্সটেন্ডেড প্রস্থের জন্য অপ্টিমাইজ করা লেআউট তৈরি করে অ্যাপটিকে উন্নত করার উদ্যোগ নিয়েছে। এটি অ্যাপটিকে বিভিন্ন স্ক্রিনের ডাইমেনশন এবং অ্যাস্পেক্ট রেশিওতে তার ইউজার ইন্টারফেস মানিয়ে নিতে সাহায্য করে, যা বিভিন্ন ডিভাইস জুড়ে একটি সামঞ্জস্যপূর্ণ এবং দৃষ্টিনন্দন UI নিশ্চিত করে।

অ্যাপে কতটা জায়গা উপলভ্য আছে তা জানতে JioHotstar, Material 3 অ্যাডাপ্টিভ লাইব্রেরি ব্যবহার করে এই প্যাটার্ন অনুসরণ করেছে। প্রথমে currentWindowAdaptiveInfo() ফাংশনটি কল করা, তারপর তিনটি উইন্ডো সাইজ ক্লাসের জন্য সেই অনুযায়ী নতুন লেআউট ব্যবহার করা:

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 চেক করে যে কোনও প্রস্থ EXPANDED-এর চেয়ে বড় বা সমান হলে সেটি সবসময় MEDIUM-এর চেয়ে বড় হবে।

JioHotstar, ফোল্ডেবল ডিভাইসের জন্য অনন্য প্রিমিয়াম অভিজ্ঞতা প্রদান করতে পারে: টেবিলটপ মোড। হ্যান্ডস-ফ্রি অভিজ্ঞতার জন্য কোনও ফোল্ডেবল ডিভাইস আংশিকভাবে ভাঁজ করা হলে, এই ফিচারটি সুবিধাজনকভাবে ভিডিও প্লেয়ারটিকে স্ক্রিনের উপরের অর্ধে এবং ভিডিও কন্ট্রোলগুলিকে নিচের অর্ধে স্থানান্তরিত করে।

এটি করার জন্য, Material 3 অ্যাডাপ্টিভ লাইব্রেরি ব্যবহার করে, একই currentWindowAdaptiveInfo() টেবিলটপ মোডের জন্য কোয়েরি করতে ব্যবহার করা যেতে পারে। ডিভাইসটি টেবিলটপ মোডে থাকলে, পোস্টারের উপরের এবং নিচের অর্ধেকের সাথে মিল রেখে লেআউট পরিবর্তন করা যেতে পারে। এর জন্য একটি কলাম ব্যবহার করা যেতে পারে, যাতে প্লেয়ারটি উপরের অর্ধেকের মধ্যে এবং কন্ট্রোলারটি নিচের অর্ধেকের মধ্যে থাকে:

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

JioHotstar এখন টিয়ার ১-এর জন্য বড় স্ক্রিন অ্যাপ কোয়ালিটি নির্দেশিকা মেনে চলছে। টিম অ্যাডাপ্টিভ অ্যাপ সংক্রান্ত নির্দেশিকা কাজে লাগিয়েছে, স্যাম্পেল, কোডল্যাব, কুকবুক এবং ডকুমেন্টেশন ব্যবহার করে এইসব সাজেশন অন্তর্ভুক্ত করেছে।

ব্যবহারকারীর অভিজ্ঞতা আরও উন্নত করতে, JioHotstar ভিডিও খোঁজার পৃষ্ঠায় টাচ টার্গেটের সাইজ বাড়িয়ে সাজেস্ট করা ৪৮dp করেছে, যাতে বড় স্ক্রিনের ডিভাইসেও অ্যাক্সেসিবিলিটি নিশ্চিত করা যায়। তাদের ভিডিওর বিবরণ পৃষ্ঠা এখন স্ক্রিনের সাইজ এবং ওরিয়েন্টেশন অনুযায়ী অ্যাডজাস্ট করে। তারা সাধারণ ইমেজ স্কেলিংয়ের বাইরে গিয়ে উইন্ডো সাইজ ক্লাস ব্যবহার করে রিয়েল-টাইমে উইন্ডোর সাইজ ও ডেনসিটি শনাক্ত করে এবং প্রতিটি ফর্ম ফ্যাক্টরের জন্য সবচেয়ে উপযুক্ত অনেক বড় ছবি লোড করে, যা ভিজ্যুয়াল ফিডেলিটি উন্নত করতে সাহায্য করে। নেভিগেশনও উন্নত করা হয়েছে, যার লেআউট বিভিন্ন স্ক্রিন সাইজের সাথে মানানসই।

এখন ব্যবহারকারীরা JioHotstar-এ তাদের পছন্দের কন্টেন্ট বড় স্ক্রিনের ডিভাইসে আরও উন্নত ও অপ্টিমাইজ করা দেখার অভিজ্ঞতা সহ দেখতে পারবেন।

"Google-এর সাথে টিয়ার ১ বড় স্ক্রিন অ্যাপ স্ট্যাটাস অর্জন করা একটি মাইলস্টোন যা আমাদের শেয়ার করা ভিশনের শক্তিকে প্রতিফলিত করে। JioHotstar-এ আমরা সবসময় বিশ্বাস করি যে বড় স্ক্রিনের ডিভাইসের জন্য অপ্টিমাইজ করা মানে শুধু মানিয়ে নেওয়া নয়, এর অর্থ হল সেইসব দর্শকদের দেখার অভিজ্ঞতা উন্নত করা যারা দ্রুত ফোল্ডেবল, ট্যাবলেট ও কানেক্টেড টিভির মতো ডিভাইস ব্যবহার করতে শুরু করছেন।

Google-এর Jetpack লাইব্রেরি ও নির্দেশিকা ব্যবহার করে আমরা কন্টেন্ট ব্যবহারের বিষয়ে আমাদের ইনসাইট এবং প্ল্যাটফর্মের উদ্ভাবনে তাদের দক্ষতাকে একত্রিত করতে পেরেছি। এই সহযোগিতার ফলে দুটি টিমই সীমানা অতিক্রম করতে, ফাঁক পূরণ করতে এবং প্রতিটি স্ক্রিনের সাইজ জুড়ে একটি নিরবচ্ছিন্ন, ইমারসিভ অভিজ্ঞতা সহ-তৈরি করতে পেরেছে।

আমরা একসাথে লক্ষ লক্ষ ব্যবহারকারীর কাছে এই উন্নত অভিজ্ঞতা পৌঁছে দিতে পেরে এবং ভারত ও বিশ্বের মানুষ কীভাবে স্ট্রিমিংয়ের অভিজ্ঞতা লাভ করেন তার নতুন মানদণ্ড স্থাপন করতে পেরে গর্বিত।"
- সোনু সঞ্জীব, সিনিয়র সফ্টওয়্যার ডেভেলপমেন্ট ইঞ্জিনিয়ার