उपयोगकर्ता इंटरफ़ेस

टियर 2 का अडैप्टिव ऑप्टिमाइज़ किया गया आइकॉन

टीयर 2 — अडैप्टिव ऑप्टिमाइज़ेशन

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

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

अपने ऐप्लिकेशन को बड़ी स्क्रीन के लिए ऑप्टिमाइज़ करें. इसके लिए, इन यूज़र इंटरफ़ेस (यूआई) एलिमेंट को शामिल करें:

  • नेविगेशन रेल या नेविगेशन पैनल
  • बड़े टच टारगेट
  • सही जगह पर मौजूद मेन्यू और डायलॉग
  • कई पैन वाले लेआउट

अडैप्टिव लेआउट

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

कैननिकल लेआउट

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

रिस्पॉन्सिव यूज़र इंटरफ़ेस (यूआई)

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

गतिविधि एम्बेड करना

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

अगले चरण

ऑप्टिमाइज़ किए गए यूज़र एक्सपीरियंस (यूएक्स) के लिए यूज़र इंटरफ़ेस (यूआई) डेवलपमेंट के बारे में जानने के लिए, डेवलपर के ये दिशा-निर्देश देखें: