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


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

लगभग एक साथ, कई अनुप्रयोगों ने अपने आप में पार्श्व नेविगेशन पेश किया, जैसा कि फेसबुक एप्लिकेशन में है। सबसे पहले, हमने देखा कि नए Spotify डिज़ाइन में इसका उपयोग कैसे किया जाता है, और फिर लगभग तुरंत निर्णय Evernote द्वारा अपनाया गया था। एक वर्ष से भी कम समय में, Google+ एप्लिकेशन के नए डिज़ाइन ने एक समान पैटर्न पेश किया।

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

कार्यान्वयन में दृश्य अंतर स्पष्ट हैं। उदाहरण के लिए, Google+ एप्लिकेशन में, मेनू वर्तमान स्क्रीन पर स्क्रॉल करता है, जबकि अन्य अनुप्रयोगों में वर्तमान स्क्रीन किनारे की ओर शिफ्ट हो जाती है। Google+ गो अप आइकन का उपयोग करता है, लेकिन एक्शन बार जगह में रहता है, भले ही मेनू खुला हो, जबकि अन्य अनुप्रयोगों में यह नहीं है।

एक दिलचस्प चर्चा जो इस पैटर्न के बारे में बहुत पहले नहीं हुई थी, उसे लेखक के ब्लॉग पर Google+ पर पढ़ा जा सकता है। चर्चा से जुड़ा (संलग्न)

डैशबोर्ड मर चुका है

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

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

उदाहरण एप्लिकेशन के अनुभागों के बीच ले जाने में कठिनाई को दर्शाता है, अगर यह डैशबोर्ड के अंतर्निहित सिद्धांत के साथ बनाया गया है।



पार्श्व नेविगेशन दोनों समस्याओं को हल करता है। उपयोगकर्ता सीधे होम स्क्रीन पर लौटने के बिना आवेदन के किसी भी अनुभाग में जा सकता है। उसी समय, जब एप्लिकेशन शुरू होता है, तो मुख्य स्क्रीन में से एक खुलता है, जिस पर सामग्री तुरंत उपलब्ध होती है।

निम्न स्केच उसी एप्लिकेशन का एक उदाहरण है, लेकिन साइड नेविगेशन के सिद्धांत पर बनाया गया है। सबसे पहले, एप्लिकेशन की पहली स्क्रीन सामग्री को दिखाती है और दूसरी बात, उपयोगकर्ता किसी भी स्क्रीन से सीधे एप्लिकेशन के किसी अन्य भाग में जा सकता है।



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

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

ब्रेक के बाद थोड़ा और ...

साइड नेविगेशन मुद्दे

दुर्भाग्य से, पार्श्व नेविगेशन को सही ढंग से लागू करना कुछ कठिनाइयों के कारण डैशबोर्ड अवधारणा की तुलना में अधिक कठिन है।

ऊपर?

मैं कभी भी एंड्रॉइड में अप बटन अवधारणा का प्रशंसक नहीं रहा हूं। मेरा मानना ​​है कि उपयोगकर्ता अप और बैक ट्रांज़िशन के बीच के अंतर को नहीं समझ सकता है। इसके अलावा, Google ने इस तथ्य के साथ "मदद" करने का फैसला किया कि "ऊपर" कार्रवाई बाएं तीर द्वारा इंगित की गई है। प्रत्येक उपयोगकर्ता जो मैंने बैक बटन के रूप में इस अप बटन की बात की है।

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

यदि आप Google+ एप्लिकेशन को देखते हैं और यहां नेविगेशन कैसे काम करता है, तो हम देखेंगे कि साइड नेविगेशन पर पहुंच प्राप्त करने के लिए आपको सबसे पहले एक श्रेणी स्क्रीन पर जाना होगा। मुझे लगता है कि यह इसके अर्थ को पार करता है। यदि, उदाहरण के लिए, मैंने समाचार का एक टुकड़ा पढ़ा और अचानक एक वीडियोकांफ्रेंसिंग शुरू करना चाहता हूं, तो मुझे हैंगआउट करने के लिए न्यूज फीड से बाहर क्यों निकलना चाहिए?

इसके बजाय, मैं एक्शन बार के ऊपरी बाएँ बटन को देखकर और अधिक प्रसन्न हो जाऊँगा, चाहे आप किस भी स्क्रीन पर हों ।

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

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

वापस ढेर मुद्दों

रिटर्न स्टैक का उचित प्रबंधन करना बहुत महत्वपूर्ण है। पार्श्व नेविगेशन रिवर्स स्टैक को जटिल कर सकता है। अलेक्जेंडर ब्लूम ने इस बारे में कई अच्छे पोस्ट लिखे। मैं आपको देखने की सलाह देता हूं:
Android नेविगेशन और Spotify (दोस्तों के साथ)
स्लाइड-आउट नेविगेशन बेहतर किया गया
(इंग्लैंड)।

साइड नेविगेशन क्या खोलता है?

उपयोगकर्ता साइड नेविगेशन कैसे खोल सकते हैं? क्या इशारों और बटन का उपयोग करने के लिए?

किसी भी एप्लिकेशन में लेटरल नेविगेशन सबसे महत्वपूर्ण घटक है जिसमें आप इसका उपयोग करने का निर्णय लेते हैं। जब तक वे इसे खोलना नहीं जानते, तब तक उपयोगकर्ता एप्लिकेशन में कहीं भी नहीं जा सकते।

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

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

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

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

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

साइड नेविगेशन में क्रियाएँ

इससे पहले, मैं नेविगेशन के बारे में बात कर रहा था, लेकिन पैटर्न के कई उपयोग अकेले नेविगेशन की सीमाओं से परे हैं। यह मुझे तर्कसंगत लगता है। एक्शन बार स्क्रीन पर प्रासंगिक कार्यों के लिए जगह है जहां यह स्थित है। लेकिन क्या होगा यदि एप्लिकेशन में ऐसी क्रियाएं हैं जो इतनी महत्वपूर्ण हैं कि वे किसी भी स्क्रीन से सुलभ होनी चाहिए?

एवरनोट ने साइड मेनू में कार्रवाई करके इस समस्या को हल किया। मुझे लगता है कि उनका समाधान उत्कृष्ट है। यह पहले उपयोग पर थोड़ा अधिभार लग सकता है, लेकिन नेविगेशन तत्वों और कार्यों का एक स्पष्ट दृश्य पृथक्करण उपयोगकर्ता को आसानी से अपने सिर में एक मॉडल बनाने में मदद करता है कि नेविगेशन कहां है और क्रियाएं कहां हैं।

आप इसे क्या कहते हैं?

विवरणात्मक और क्रमिक रूप से पैटर्न का नाम देना बहुत महत्वपूर्ण है। पैटर्न के फायदों में से एक यह है कि उन्हें केवल नाम से संदर्भित करके आसानी से चर्चा में उपयोग किया जा सकता है। स्थापित पैटर्न के लिए, कोई और स्पष्टीकरण की आवश्यकता नहीं है। "हो सकता है कि आपको इंटरफ़ेस में एक्शन बार का उपयोग करना चाहिए?" या "त्वरित कार्यों की एक सूची के बारे में?" स्व-व्याख्यात्मक वाक्य हैं।

तो इस पैटर्न का नाम क्या है? मैंने इस पोस्ट में इसे "साइड नेविगेशन" के रूप में संदर्भित किया है, लेकिन यहां कई अन्य विकल्प हैं:

• साइड नेविगेशन
• फ्लाई-इन ऐप मेनू
• नेविगेशन को खिसकाना
• स्लाइडिंग नेविगेशन बार
• स्लाइड मेनू
• ...

हम Google द्वारा प्रतीक्षा कर सकते हैं कि किसी एक नाम के स्वयं से व्यवस्थित होने से पहले पैटर्न का नाम दिया जाए। लोकतंत्र में यहां मदद की संभावना नहीं है। अभी के लिए, मैं इसे पार्श्व नेविगेशन कहूंगा, लेकिन मैं किसी अन्य नाम को स्वीकार करने के लिए तैयार हूं।

तकनीकी समाधान

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

यहाँ एक और परियोजना है:
https://github.com/darvds/RibbonMenu

और यहाँ दो और हैं:
https://bitbucket.org/jfeinstein10/slidingmenu/overview
https://github.com/Gregadeaux/android-fly-in-app-navigation

सिरिल मोटियर ने अपने ब्लॉग (अंग्रेजी) पर इस पैटर्न की शुरुआत के बारे में भी लिखा। ये पोस्ट पढ़ने लायक हैं:
Prixing # 1 का निर्माण: फ्लाई-इन ऐप मेनू
Prixing # 2 बनाना: फ्लाई-इन ऐप मेनू को स्वाइप करना
# 3 बनाने Prixing: स्लाइडिंग एप्लिकेशन मेनू चमकाने

भविष्य

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

Google I | O कोने के चारों ओर है (जून 2012 में यह लेख लिखने के समय कोने के आसपास था) । हम देख सकते हैं कि वे Android के अगले संस्करण की घोषणा कैसे करते हैं। मुझे उम्मीद है कि Google अपने ओएस में अधिक जटिल घटकों को बढ़ावा देना जारी रखता है (जैसा कि उन्होंने ICS / हनीकॉम्ब में एक्शन बार के साथ किया था)। मुझे यह भी उम्मीद है कि हम इस पैटर्न के अनुप्रयोग में निरंतरता का परिचय देते हुए, नए रिलीज़ के हिस्से के रूप में साइड नेविगेशन घटक देखेंगे।

निष्कर्ष

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