Android बनाम iOS के लिए विकास: नेविगेशन पैटर्न

पिछले सप्ताह के लेख में, हमने एक उच्च स्तरीय दृष्टिकोण के साथ शुरुआत की, जहां हमने क्रमशः iOS और Android की डिज़ाइन भाषाओं के बीच अंतर: फ्लैट डिज़ाइन और सामग्री डिज़ाइन का वर्णन किया।

यदि आपको अभी तक फ्लैट बनाम सामग्री की अच्छी समझ नहीं है, तो मैं आपको इस लेख को पढ़ने से पहले उस पर पढ़ने की सलाह देता हूं।

अगले कुछ सप्ताहों में, हम Android बनाम iOS प्लेटफ़ॉर्म के बीच अधिक मूल बनाम हाइब्रिड मोबाइल विकास और अन्य अंतरों पर जा रहे हैं।

इस सप्ताह, नेविगेशन डिज़ाइन पैटर्न के बारे में बात करते हैं।

जब आप इस बारे में सोच रहे हों कि आपके उपयोगकर्ता आपके मोबाइल ऐप को कैसे नेविगेट करने जा रहे हैं, तो आपको अपने आप से निम्न प्रकार के प्रश्न पूछने चाहिए:

  • हालांकि उपयोगकर्ता को मेरे ऐप के अंतर अनुभागों को कैसे नेविगेट करना चाहिए?
  • क्या मुझे नेविगेशन ड्रॉअर या टैब का उपयोग करना चाहिए?
  • क्या मेरा टैब स्क्रीन के ऊपर या नीचे होना चाहिए?
  • मैं अपने उपयोगकर्ता को उनके वर्तमान दृश्य से वापस कैसे जाने दूं?

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

नेविगेशन का अध्ययन करने में परेशान क्यों?

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

टैब्स

जब आपके ऐप में कुछ मुख्य भाग होते हैं और आप अपने उपयोगकर्ता को उनके बीच जल्दी से जाने देना चाहते हैं, तो टैब एक ठोस विकल्प है। टैब आपको अपने ऐप के मुख्य दृश्य व्यवस्थित करने देता है और उपयोगकर्ताओं को उनमें से प्रत्येक में सामग्री को जल्दी से देखने देता है।

आईओएस

IOS पर, टैब स्क्रीन के निचले भाग में होते हैं। यह एक बहुत अच्छी तरह से ज्ञात और परिचित नेविगेशन डिज़ाइन दृष्टिकोण है जिसका उपयोग कई सफल उत्पादों जैसे कि फेसबुक, ट्विटर और इंस्टाग्राम द्वारा किया जाता है। iOS टैब में आमतौर पर आइकन और टेक्स्ट दोनों होते हैं।

ट्विटर के iOS ऐप पर टैबट्रेलो के iOS ऐप पर टैब बार

टैब के एक विशिष्ट उपयोग में प्रत्येक आपके आवेदन के एक भाग को शामिल करता है:

  • होम (मुख्य सामग्री) टैब
  • खोजें (यदि खोज के लिए सामग्री है) टैब
  • रचना / टैब बनाएँ
  • सूचनाएं टैब
  • प्रोफ़ाइल टैब
इसके अलावा, टैब में अक्सर आइकन या नंबर होते हैं जो यह संकेत देते हैं कि उपयोगकर्ता के लिए नई सामग्री उपलब्ध है

5 टैब तक एक कन्वेंशन और लिमिटेशन है। पारंपरिक रूप से आपके आवेदन में 5 "बड़ी" चीजें नहीं होनी चाहिए (यह सामान्य रूप से एक अच्छा यूएक्स अनुभव है)।

पोट्रेट मोड में केवल iOS उपकरणों पर क्षैतिज रूप से इतना अधिक स्थान होता है। इस प्रकार यदि आप 6 वाँ टैब रखते हैं तो उन सभी के लिए कोई जगह नहीं होगी और सिस्टम उन्हें अधिक टैब में "फ्लॉप" करेगा। उस बिंदीदार टैब पर टैप करने से अन्य टैब विकल्पों की एक सूची खुलती है जो इसे टैब बार में नहीं बनाती है।

Apple के म्यूजिक ऐप में मोर टैब का एक उदाहरण

एंड्रॉयड

एंड्रॉइड पर, टैब सबसे ऊपर होते हैं और आमतौर पर या तो टेक्स्ट या आइकन (टेक्स्ट और आइकन के बजाय) के रूप में दर्शाए जाते हैं, जब तक कि आप नीचे नेविगेशन बार के लिए नहीं जा रहे हैं, नीचे देखें।

ट्विटर के एंड्रॉइड ऐप पर टैब

एंड्रॉइड टैब आमतौर पर आईओएस की तुलना में ऐप विशिष्ट अनुभागों पर अधिक केंद्रित होते हैं और सर्च, क्रिएट / कंपोज़ और प्रोफाइल जैसे "सेकेंडरी" अनुभागों पर कम होते हैं क्योंकि एंड्रॉइड में उन भूमिकाओं को पूरा करने के लिए अन्य नेविगेशन तत्व होते हैं।

स्वाइप

एंड्रॉइड ऐप (बैकड्रॉप्स की तरह) उपयोगकर्ताओं को आमतौर पर टैब के बीच नेविगेट करने के लिए स्क्रीन को क्षैतिज रूप से स्वाइप करने देते हैं।

नीचे नेविगेशन बार

नीचे नेविगेशन बार एक अपेक्षाकृत नया एंड्रॉइड डिज़ाइन पैटर्न है जो iOS में टैब का उपयोग करने की नकल करने की कोशिश करता है। जबकि मैं व्यक्तिगत रूप से तर्क देता हूं कि एंड्रॉइड में एक निचला टैब मूर्खतापूर्ण है (चूंकि यह एंड्रॉइड के प्रतिष्ठित नेविगेशन बार के बहुत करीब है), Google टैब्स बनाम निचला नेविगेशन पर निम्नलिखित कहता है:

टैब अलग-अलग विचारों के बीच अन्वेषण और स्विच करना आसान बनाते हैं और

नीचे के नेविगेशन बार एक ही टैप में शीर्ष-स्तरीय दृश्यों के बीच अन्वेषण और स्विच करना आसान बनाते हैं।

साइड नेविगेशन दराज

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

आईओएस

IOS पर, नेविगेशन ड्रॉअर एक मूल डिज़ाइन पैटर्न नहीं है। वे प्लेटफ़ॉर्म पर आए क्योंकि आईओएस डिज़ाइन विकसित हुआ लेकिन अभी भी बहुत सारे अनुप्रयोगों में नेविगेशन का एक महत्वपूर्ण हिस्सा है।

चूंकि Apple नेविगेशन ड्रॉअर को लागू करने के लिए एक एपीआई प्रदान नहीं करता है, इसलिए डेवलपर्स आमतौर पर थर्ड पार्टी लाइब्रेरी (यहां आंशिक सूची) का उपयोग करते हैं।

एंड्रॉयड

एंड्रॉइड पर, नेविगेशन ड्रॉअर एक मूल डिज़ाइन पैटर्न है, इसलिए Google आपको उन API के साथ प्रदान करता है जिन्हें आपको नेविगेशन ड्रॉअर बनाने की आवश्यकता है, तीसरे पक्ष के एपीआई की खोज करने की कोई आवश्यकता नहीं है।

यदि लागू हो, तो नेविगेशन ड्रावर का शीर्ष आमतौर पर उपयोगकर्ता की विशिष्ट जानकारी दिखाता है।नेविगेशन ड्रॉअर का निचला भाग द्वितीयक अनुभाग दिखा सकता है।

शीर्ष बार

आईओएस

IOS पर टॉप बार को नेविगेशन बार कहा जाता है। नेविगेशन बार में आमतौर पर शामिल हैं:

  • वर्तमान में उपयोगकर्ता जिस अनुभाग का शीर्षक है
  • बाईं ओर एक बैक बटन है, जिसमें वापस नेविगेट करने के लिए एक स्क्रीन है
  • लागू होने पर दाईं ओर एक सामग्री नियंत्रण तत्व (जैसे खोज)
ट्विटर का iOS ऐप नेविगेशन बारट्विटर के iOS ऐप का बैक बटन के साथ नेविगेशन बार

नेविगेशन बार का मुख्य उद्देश्य उपयोगकर्ता को बैक बटन के उपयोग के माध्यम से श्रेणीबद्ध ऐप स्क्रीन की एक श्रृंखला के माध्यम से नेविगेशन की अनुमति देना है।

एंड्रॉयड

Android पर शीर्ष पट्टी को टूलबार कहा जाता है। Android का टूलबार iOS से अधिक मानकीकृत है और इसमें आमतौर पर शामिल हैं:

  • वर्तमान में उपयोगकर्ता जिस अनुभाग का शीर्षक है
  • बाईं ओर एक ऊपर का बटन यदि वापस नेविगेट करने के लिए एक स्क्रीन है
  • यदि कोई अप बटन नहीं है तो एक नेविगेशन दराज बटन
  • अधिक विकल्पों के साथ मेनू बटन और अतिप्रवाह मेनू
ध्यान दें कि टूलबार और टैब दोनों के साथ एंड्रॉइड ऐप्स पर, दोनों एक ही तत्व में विलय हो जाते हैं।Youtube के Android ऐप पर अतिप्रवाह मेनू

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

वैकल्पिक रूप से, आप अपने साइड नेविगेशन ड्रॉअर के प्रत्येक सेक्शन को अपने स्वयं के ओवरफ्लो मेनू से आगे के विकल्पों के साथ दे सकते हैं, जिनसे आपका उपयोगकर्ता सहभागिता कर सकता है।

बैक बटन (और Android के नेविगेशन बार)

स्क्रीन पर नेविगेट करना बहुत अच्छा है, लेकिन उपयोगकर्ताओं के लिए यह स्पष्ट करना भी महत्वपूर्ण है कि वापस कैसे जाएं।

आईओएस

IOS पर उपयोगकर्ता को वापस नेविगेट करने का एकमात्र तरीका नेविगेशन बार के बाईं ओर एक बैक / क्लोज बटन के माध्यम से है।

एंड्रॉयड

चूंकि एंड्रॉइड में एक ऑनस्क्रीन नेविगेशन बार होता है, इसलिए डिज़ाइन प्रलेखन अप बटन और बैक बटन के बीच अंतर करता है।

ऊपर बटन

अप बटन आमतौर पर एक टूलबार में शामिल होता है और उपयोगकर्ता को अंतिम स्क्रीन पर ले जाता है जिसे वे आपके ऐप में देखते थे (जब तक वे ऐप की होम स्क्रीन तक नहीं पहुंचते)।

एंड्रॉइड नेविगेशन बार और बैक बटन

पिछला बटन नेविगेशन बार का हिस्सा है और "हाल ही में देखी गई स्क्रीन के इतिहास के माध्यम से रिवर्स कालानुक्रमिक क्रम में नेविगेट करता है"। हालांकि उप बटन आपके ऐप से उपयोगकर्ताओं को नहीं लेगा, बैक बटन उपयोगकर्ता को वर्तमान ऐप से ले सकता है जो वे पहले उपयोग कर रहे थे।

IOS और Android के बीच एक महत्वपूर्ण अंतर यह है कि पूर्व में एक भौतिक होम बटन कैसे होता है (वह भी थंब प्रिंट स्कैनर के रूप में कार्य करता है), और उत्तरार्द्ध एक बड़ा स्क्रीन रखने के लिए सामने वाले भौतिक बटन को भूल जाता है (और अंगूठे के प्रिंट स्कैनर को फेंक देता है) फोन के पीछे)।

यहां तक ​​कि अगर यह एक "ऐप" के बजाय एक "सिस्टम" डिज़ाइन पैटर्न है, तो एंड्रॉइड का नेविगेशन बार छिपाया जा सकता है और इमर्सिव मीडिया ऐप (जैसे कि Youtube, Google फ़ोटो, नेटफ्लिक्स, एक्ट) उपयोगकर्ता को फोकस करने के लिए नेविगेशन बार को छिपा देगा। एप्लिकेशन प्रस्तुत कर रहा है।

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

निष्कर्ष

IOS और Android पर नेविगेशन पैटर्न पर इस सप्ताह के लेख के लिए यही है।

अगले लेख में, हम मोबाइल ऐप्स के लिए मूल बनाम हाइब्रिड विकास पर जा रहे हैं।

यदि आप इन अगले लेखों के लाइव होने पर अपडेट प्राप्त करना चाहते हैं, तो कृपया हमारी मेलिंग सूची की सदस्यता लें। यदि आप मोबाइल स्पेस में एक उद्यमी / डेवलपर हैं और एंड्रॉइड और iOS दोनों को लक्षित करने की योजना बनाते हैं, तो आप इन दो ऑपरेटिंग सिस्टम और उपयोगकर्ता की अपेक्षाओं के बीच अंतर और डिज़ाइन के अंतर को समझने के लिए अपनी सफलता की संभावना को बड़े पैमाने पर बढ़ा देंगे।

इस लेख के सह-लेखक थे:

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

तथा

एलेक्स बुश, स्मार्टक्लाउड में एक सॉफ्टवेयर इंजीनियर। वह उन्नत iOS विषयों और रूबी ऑन रेल्स के बारे में ब्लॉग करता है।