शुरू से ही बड़ी स्क्रीन के लिए डिज़ाइन करें

Android डिवाइस कई तरह के फ़ॉर्म फ़ैक्टर में आते हैं. जैसे, फ़ोन, टैबलेट, फ़ोल्ड किए जा सकने वाले डिवाइस, और ChromeOS डिवाइस. इन डिवाइसों की स्क्रीन के साइज़ भी अलग-अलग होते हैं. Android में कई डिसप्ले मोड काम करते हैं. जैसे, मल्टी-विंडो, मल्टी-डिसप्ले, फ़्री-फ़ॉर्म, और पिक्चर में पिक्चर. फ़ोल्ड किए जा सकने वाले डिवाइसों को अलग-अलग तरह से इस्तेमाल किया जा सकता है. जैसे, टेबलटॉप या किताब की तरह.

अपने ऐप्लिकेशन को डिज़ाइन करते समय, इसके इस्तेमाल के अलग-अलग उदाहरणों को ध्यान में रखें. उदाहरण के लिए:

  • बड़ी स्क्रीन वाले डिवाइसों पर, उपयोगकर्ता आपके मीडिया ऐप्लिकेशन के कॉन्टेंट के साथ अलग-अलग तरीकों से जुड़ सकते हैं.

  • उपयोगकर्ता, मल्टी-विंडो कॉन्फ़िगरेशन में वीडियो देखते समय, कई काम कर सकते हैं. इसके अलावा, वे किसी इमेज को कैप्चर करने के बाद, बड़ी स्क्रीन का फ़ायदा लेकर उसमें ज़्यादा जटिल बदलाव कर सकते हैं.

  • वीडियो कॉल के ज़रिए अपने दोस्तों और परिवार के सदस्यों से जुड़े रहने के लिए, उपयोगकर्ता टैबलेट का इस्तेमाल कर सकते हैं. इससे उन्हें अपने दोस्तों और परिवार के सदस्यों को ज़्यादा साफ़ तौर पर देखने में मदद मिलती है. आपका ऐप्लिकेशन, पसंद के मुताबिक बनाए गए प्लेबैक ओवरले में किसी टाइटल या सीन के बारे में ज़्यादा जानकारी दिखा सकता है. इसके अलावा, स्क्रीन पर ज़्यादा कंट्रोल के विकल्प भी दे सकता है.

  • ब्राउज़िंग व्यू में कैरसेल, ज़्यादा विज़ुअल अपील के लिए अलग-अलग तरह के हो सकते हैं. इसके अलावा, आपका मीडिया ऐप्लिकेशन, वीडियो चलाने के साथ-साथ ब्राउज़ किए जा सकने वाले फ़ीड की सुविधा देकर, उपयोगकर्ताओं को जोड़े रख सकता है.

ध्यान रखें कि आपके मीडिया ऐप्लिकेशन में एक ही कोड, स्टैंडर्ड फ़ोन, फ़ोल्ड किए जा सकने वाले फ़ोन, टैबलेट, और ChromeOS डिवाइसों पर चलता है. इसलिए, आपको ऐप्लिकेशन डेवलप करने की शुरुआत से ही बड़ी स्क्रीन के लिए डिज़ाइन करना चाहिए. ज़्यादा जानकारी और विज़ुअल उदाहरणों के लिए, बड़ी स्क्रीन वाली गैलरी देखें.

अपने मीडिया ऐप्लिकेशन को डिफ़ॉल्ट रूप से रिस्पॉन्सिव बनाना

अपने मीडिया ऐप्लिकेशन के लेआउट को फ़ोन, टैबलेट, फ़ोल्ड किए जा सकने वाले डिवाइसों, और ChromeOS डिवाइसों के हिसाब से अडैप्टिव बनाएं, ताकि लोगों को बेहतर अनुभव मिल सके.

आपका ऐप्लिकेशन, अलग-अलग डिसप्ले साइज़, ओरिएंटेशन, और फ़ॉर्म फ़ैक्टर के हिसाब से रिस्पॉन्सिव होना चाहिए. अडैप्टिव लेआउट, डिसप्ले के लिए उपलब्ध जगह के हिसाब से बदलता रहता है. ज़्यादा जानकारी के लिए, अलग-अलग डिसप्ले साइज़ के साथ काम करना लेख पढ़ें.

दिशा-निर्देशों के मुताबिक डिज़ाइन करना

ऐप्लिकेशन की मुख्य क्वालिटी, सभी Android ऐप्लिकेशन के लिए आधार होती है. भले ही, डिसप्ले का साइज़, डिवाइस का पोज़िशन या डिवाइस से जुड़ी अन्य बातें कुछ भी हों. बड़ी स्क्रीन के लिए डिज़ाइन शुरू करने से पहले, आपके ऐप्लिकेशन को इन बुनियादी ज़रूरी शर्तों को पूरा करना चाहिए. ज़्यादा जानकारी के लिए, ऐप्लिकेशन की मुख्य क्वालिटी लेख पढ़ें.

आपका ऐप्लिकेशन, डिवाइस के फ़ॉर्मैट, स्क्रीन साइज़, डिसप्ले मोड या पोज़िशन के बावजूद, उपयोगकर्ता को बेहतरीन अनुभव देना चाहिए. इसलिए, अपने ऐप्लिकेशन को टीयर 1, 2, और 3 के इन दिशा-निर्देशों के मुताबिक डिज़ाइन करें.

इन दिशा-निर्देशों में, Android के ज़्यादातर तरह के ऐप्लिकेशन की क्वालिटी से जुड़ी ज़रूरी शर्तों के बारे में बताया गया है.

तीसरा टियर:

इस बुनियादी लेवल पर, आपके ऐप्लिकेशन को यूज़र इंटरफ़ेस (यूआई) और ग्राफ़िक से जुड़ी ज़रूरी शर्तों का पालन करना होगा. आपका ऐप्लिकेशन बड़ी स्क्रीन के लिए तैयार है और उपयोगकर्ता ज़रूरी टास्क फ़्लो को पूरा कर सकते हैं. हालांकि, उन्हें उपयोगकर्ता अनुभव का बेहतर अनुभव नहीं मिलता.

ऐसा हो सकता है कि ऐप्लिकेशन का लेआउट सही न हो, लेकिन वह मल्टी-विंडो मोड में फ़ुल स्क्रीन या फ़ुल विंडो में चलता हो. यह लेटरबॉक्स नहीं है और यह कंपैटिबिलिटी मोड में नहीं चलता. यह ऐप्लिकेशन, बाहरी इनपुट डिवाइसों के लिए बुनियादी सहायता उपलब्ध कराता है. इनमें कीबोर्ड, माउस, और ट्रैकपैड शामिल हैं. ज़्यादा जानकारी के लिए, बड़ी स्क्रीन के लिए तैयार लेख पढ़ें.

टियर 2:

यहां आपका ऐप्लिकेशन, सभी स्क्रीन साइज़ और डिवाइस कॉन्फ़िगरेशन के लिए लेआउट ऑप्टिमाइज़ेशन लागू करता है. साथ ही, बाहरी इनपुट डिवाइसों के लिए बेहतर सहायता भी देता है. ज़्यादा जानकारी के लिए, बड़ी स्क्रीन के लिए ऑप्टिमाइज़ किया गया देखें.

टियर 1:

यह सहायता का सबसे बेहतर लेवल है. इससे उपयोगकर्ता को आपके ऐप्लिकेशन का बेहतरीन अनुभव मिलता है, क्योंकि इसमें प्रीमियम सुविधाओं और क्षमताओं के बारे में बताया जाता है.

जहां लागू हो, वहां ऐप्लिकेशन में मल्टीटास्किंग, फ़ोल्ड किए जा सकने वाले डिवाइस के पोज़िशन, खींचें और छोड़ें, और स्टाइलस इनपुट की सुविधा काम करती है. इस लेवल पर, ऐप्लिकेशन काफ़ी अलग-अलग होते हैं. इसलिए, कई काम एक साथ करने और फ़ोल्ड किए जा सकने वाले डिवाइसों के लिए बने दिशा-निर्देशों पर ध्यान दें. ज़्यादा जानने के लिए, बड़ी स्क्रीन के लिए अलग-अलग लेख पढ़ें.

ऑप्टिमाइज़ किए गए लेआउट

बड़ी स्क्रीन पर मौजूद जगह का ज़्यादा से ज़्यादा फ़ायदा पाएं. इसके लिए, स्क्रीन को लेटरबॉक्स में बदलने या स्ट्रेच किए बिना वीडियो चलाएं. मीडिया और सोशल मीडिया के लिए अपने ऐप्लिकेशन के लेआउट को ऑप्टिमाइज़ करने पर, आपके ऐप्लिकेशन की पहुंच बढ़ती है. साथ ही, बड़ी स्क्रीन वाले सभी फ़ॉर्म फ़ैक्टर, जैसे कि टैबलेट, फ़ोल्ड किए जा सकने वाले डिवाइस, और ChromeOS डिवाइसों पर बेहतर उपयोगकर्ता अनुभव मिलता है. साथ ही, यह सभी फ़ोन साइज़ के साथ काम करता है.

नेविगेशन रेल और ड्रॉअर कॉम्पोनेंट, यूज़र इंटरफ़ेस (यूआई) के लिए अलग तरह का नेविगेशन उपलब्ध कराते हैं. इससे यूज़र को सुविधा और कंट्रोल मिलता है. ये कॉम्पोनेंट, कैननिकल लेआउट (सूची की जानकारी, फ़ीड, और सहायक पैनल) को भी बेहतर बनाते हैं. ये मुख्य नेविगेशन डेस्टिनेशन को स्क्रीन पर कम से कम जगह लेते हुए, आसानी से ऐक्सेस करने लायक बनाते हैं.

मीडिया लेआउट

सूची की जानकारी, फ़ीड, और सहायक पैनल के लिए मीडिया के हिसाब से लेआउट लागू करके, अपने ऐप्लिकेशन को ज़्यादा इस्तेमाल करने लायक बनाएं. MDX, Flutter, और Compose लेआउट के बारे में जानकारी के लिए, लेआउट संसाधन देखें.

  • सूची की जानकारी: इंटरैक्टिव मीडिया ब्राउज़र की मदद से ऐप्लिकेशन डिज़ाइन करने पर, उपयोगकर्ता वीडियो देखते या सुनते समय अलग-अलग मीडिया ब्राउज़ कर सकते हैं. मीडिया के टाइटल, चल रहे वीडियो या ऑडियो फ़ाइल के साथ-साथ दिखाए जाते हैं. अगर डिवाइस का ओरिएंटेशन बदलता है, तो ऐप्लिकेशन की स्थिति को बनाए रखने के लिए, सूची-ज़्यादा जानकारी वाला लेआउट काम करता है. ज़्यादा जानने के लिए, सूची की ज़्यादा जानकारी वाले लेआउट देखें.

  • फ़ीड: फ़ीड लेआउट, कॉन्फ़िगर किए जा सकने वाले ग्रिड में मिलते-जुलते कॉन्टेंट एलिमेंट को व्यवस्थित करता है. इससे, आपके ऐप्लिकेशन में मौजूद संगीत फ़ीड या फ़िल्म और टीवी कीऑस्क जैसे बहुत ज़्यादा कॉन्टेंट को तुरंत और आसानी से देखा जा सकता है. ज़्यादा जानकारी के लिए, फ़ीड लेआउट लेख पढ़ें.

  • सहायक पैनल: प्राइमरी और सेकंडरी डिसप्ले एरिया की मदद से, आपका ऐप्लिकेशन संदर्भ, काम के होने या रेफ़रंस के लिए सहायक पैनल एम्बेड कर सकता है. जैसे, मिलते-जुलते टाइटल की स्क्रोलिंग सूची, पब्लिश की गई समीक्षाएं या एक ही कलाकार या कलाकार की अन्य कलाकृतियां. ज़्यादा जानकारी के लिए, पैनल लेआउट के साथ काम करने की सुविधा देखें.

मीडिया लेआउट का कलेक्शन देखने के लिए, मीडिया गैलरी देखें.

सोशल मीडिया लेआउट

बड़ी स्क्रीन पर, सोशल मीडिया इस्तेमाल करने वाले लोगों को ज़्यादा जगह मिलती है. इससे वे कॉन्टेंट बना सकते हैं, एक से ज़्यादा काम कर सकते हैं, ऐप्लिकेशन के बीच कॉन्टेंट को खींचकर छोड़ सकते हैं, और उसे शेयर कर सकते हैं. छोटी स्क्रीन वाले डिवाइसों पर, बड़ी स्क्रीन वाले मीडिया ऐप्लिकेशन की खास सुविधाएं और क्षमताएं काम नहीं करतीं. हालांकि, बड़ी स्क्रीन वाले मीडिया ऐप्लिकेशन में, सूची की जानकारी, फ़ीड, और पैनल के लेआउट का फ़ायदा लिया जा सकता है.

  • List-detail: यह मैसेजिंग ऐप्लिकेशन, संपर्क मैनेजर या फ़ाइल ब्राउज़र के लिए सबसे सही है. उदाहरण के लिए, आपका ऐप्लिकेशन बातचीत की सूची के साथ-साथ जानकारी दिखा सकता है, ताकि आपको हाल ही के मैसेज के बारे में पता चलता रहे. ज़्यादा जानकारी के लिए, सूची के ज़्यादा जानकारी वाले लेआउट देखें.

  • फ़ीड: इस स्टाइल के लेआउट में कार्ड और सूचियां आम तौर पर इस्तेमाल की जाती हैं. उदाहरण के लिए, ज़रूरत के हिसाब से ग्रिड फ़ॉर्मैट में पोस्ट का कोलाज बनाएं या अहम पोस्ट पर ध्यान खींचने के लिए, साइज़ और पोज़िशन का इस्तेमाल करें. उपयोगकर्ता, कॉन्टेंट के बड़े ग्रुप को तुरंत देख सकते हैं. ज़्यादा जानकारी के लिए, फ़ीड लेआउट देखें.

  • सहायता पैनल: खोज और रेफ़रंस ऐप्लिकेशन या प्रोडक्टिविटी ऐप्लिकेशन को इस स्टाइल के लेआउट से फ़ायदा मिल सकता है. इससे उपयोगकर्ता के लिए, कॉन्टेंट बनाने के टूल आसानी से उपलब्ध रहते हैं. उदाहरण के लिए, आपके ऐप्लिकेशन में उपयोगकर्ताओं को सेटिंग में बदलाव करने, कलर पैलेट ऐक्सेस करने, इफ़ेक्ट लागू करने, और बदलावों को तुरंत देखने की सुविधा मिल सकती है. ज़्यादा जानकारी के लिए, पैनल के लेआउट लेख पढ़ें.

सोशल मीडिया लेआउट का कलेक्शन देखने के लिए, सोशल मीडिया गैलरी पेज पर जाएं.

बड़ी स्क्रीन वाले मीडिया ऐप्लिकेशन बनाने के सबसे सही तरीके

बड़ी स्क्रीन के लिए सबसे सही तरीकों का इस्तेमाल करने से, आपको अपने ऐप्लिकेशन में फिर से काम करने की ज़रूरत नहीं पड़ती. साथ ही, इससे आपका ऐप्लिकेशन शुरू से ही ज़्यादा डिवाइसों पर इस्तेमाल करने लायक बन जाता है. खास तौर पर, ऑरिएंटेशन, कीबोर्ड शॉर्टकट, कैमरे की झलक देखने की सुविधा, और फ़ोल्ड किए जा सकने वाले डिवाइसों के लिए.

ओरिएंटेशन और साइज़ बदलना

अगर आपका मीडिया ऐप्लिकेशन, ओरिएंटेशन और साइज़ बदलने से जुड़ी पाबंदियां लगाता है, तो Android एक कंपैटिबिलिटी मोड चालू करता है. हालांकि, काम करने के मोड से यह पक्का होता है कि आपका ऐप्लिकेशन ठीक से काम करता है, लेकिन इससे ऐप्लिकेशन इस्तेमाल करने में काफ़ी मुश्किल होती है और उपयोगकर्ता अनुभव भी खराब होता है.

उदाहरण के लिए, अगर आपका ऐप्लिकेशन टैबलेट पर है, तो टैबलेट लैंडस्केप ओरिएंटेशन में डॉक हो जाता है. अगर आपका ऐप्लिकेशन सिर्फ़ पोर्ट्रेट मोड में काम करता है, तो वीडियो लेटरबॉक्स में दिखता है. यह असली उपयोगकर्ता के लिए सही नहीं है. आपके ऐप्लिकेशन में लोगों को अपने पसंदीदा ओरिएंटेशन का इस्तेमाल करने की सुविधा मिलनी चाहिए. इसलिए, अपने डिज़ाइन में बड़ी स्क्रीन के उपलब्ध साइज़ का फ़ायदा लें.

ओरिएंटेशन पर लगने वाली किसी भी पाबंदी से, उपयोगकर्ताओं के कॉन्टेंट के साथ इंटरैक्ट करने या मीडिया का इस्तेमाल करने के तरीके पर असर पड़ता है. इससे आपके ऐप्लिकेशन के इस्तेमाल पर भी असर पड़ता है. ओरिएंटेशन बदलने से, साइज़ पर कुछ हद तक असर पड़ सकता है. हालांकि, साइज़ बदलने से ओरिएंटेशन नहीं बदलेगा.

कीबोर्ड शॉर्टकट

बड़ी स्क्रीन पर, फ़िज़िकल कीबोर्ड पर मौजूद कीबोर्ड शॉर्टकट का इस्तेमाल ज़्यादा किया जाता है. जैसे, शुरू करना, रोकना, रोकना, पीछे जाना, और आगे बढ़ना. इससे उपयोगकर्ता को कीबोर्ड के साथ बेहतर अनुभव मिलता है.

उपयोगकर्ता अपने मीडिया ऐप्लिकेशन में इन फ़ंक्शन की उम्मीद करते हैं. उपयोगकर्ताओं को ऐप्लिकेशन इस्तेमाल करने में आने वाली समस्याओं को कम करने के लिए, अपने ऐप्लिकेशन की जांच फ़िज़िकल कीबोर्ड की मदद से करें. इससे, आपको अपने ऐप्लिकेशन के डिज़ाइन की शुरुआत में ही, इन अहम शॉर्टकट को शामिल करने में मदद मिलती है.

कैमरे की झलक देखने की सुविधा

बड़ी स्क्रीन पर, स्ट्रेच करने, काट-छांट करने, और घुमाने से जुड़ी समस्याएं ज़्यादा हो सकती हैं. इसलिए, यह नहीं माना जा सकता कि कैमरे की झलक का साइज़, आपके मीडिया ऐप्लिकेशन के यूज़र इंटरफ़ेस (यूआई) में रेंडर किए गए साइज़ जैसा ही है.

उदाहरण के लिए, अगर कोई उपयोगकर्ता अपने टैबलेट से कोई फ़ोटो लेता है, लेकिन टैबलेट की स्क्रीन पर वह फ़ोटो उलटी दिखती है, तो यह अच्छा अनुभव नहीं है. बड़ी स्क्रीन के लिए, कैमरे की झलक देखने की सुविधा जोड़ें.

ज़्यादा जानकारी के लिए, CameraX की झलक या Camera2 की झलक देखें.

फ़ोल्ड किए जा सकने वाले आसन

बड़ी स्क्रीन के लिए मीडिया ऐप्लिकेशन डिज़ाइन करते समय, फ़ोल्ड किए जा सकने वाले पोज़िशन को भी ध्यान में रखना चाहिए. उदाहरण के लिए, आपका ऐप्लिकेशन, उपयोगकर्ता को मीडिया चलाने के लिए टेबलटॉप कॉन्फ़िगरेशन का इस्तेमाल करने की अनुमति दे सकता है. इसके अलावा, झलक देखने और कैप्चर करने के लिए, पीछे के डिसप्ले और ड्यूअल स्क्रीन मोड का इस्तेमाल करने की अनुमति भी दे सकता है.

ऐप्लिकेशन को डेवलप करने के प्लान में फ़ोल्ड किए जा सकने वाले डिवाइसों के फ़ॉर्मैट शामिल करने पर, आपका ऐप्लिकेशन ज़्यादा डिवाइसों पर उपलब्ध हो जाता है. साथ ही, इसका असर भी ज़्यादा होता है. उपयोगकर्ता को मीडिया का बेहतर अनुभव दिया जा सकता है. ऐसा करने के लिए, फ़ोल्ड किए जा सकने वाले डिवाइसों की ज़रूरत नहीं होती. ज़्यादा जानकारी के लिए, फ़ोल्ड किए जा सकने वाले आसन देखें.