उंगलियों के साथ दोस्तों के मोबाइल डिजाइन बनाएं: टचस्क्रीन के लिए आदर्श आकार

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



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

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

मोबाइल प्लेटफ़ॉर्म गाइड्स क्या कहते हैं

IPhone मानव इंटरफ़ेस दिशानिर्देश , Apple का दिशानिर्देश, स्पर्श तत्व के लिए न्यूनतम आकार की अनुशंसा करता है: 44px चौड़ा और 44px उच्च। माइक्रोसॉफ्ट का गाइड - विंडोज फोन यूआई डिजाइन और इंटरेक्शन गाइड 26px के न्यूनतम स्पर्श क्षेत्र के साथ 34px आकार का उपयोग करने का सुझाव देता है। नोकिया के डेवलपर गाइड का सुझाव है कि यह आकार कम से कम 1 x 1 सेमी 2 होना चाहिए। या 28 x 28 पीएक्स।

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

छोटे स्पर्श क्षेत्र बड़ी समस्याएं पैदा कर सकते हैं।

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



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



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

पिक्सेल में तर्जनी की औसत चौड़ाई।

MIT टच लैब ने अपने काम में ह्यूमन फिंगर्टिप्स मेकैनिकल ऑफ टेक्टाइल सेंस (मानव फिंगर्टिप्स की जांच करने के लिए टैक्टाइल सेंस के मैकेनिक्स) की जांच की, यह निर्धारित किया कि ज्यादातर वयस्कों के लिए औसत उंगली की चौड़ाई 1.6 - 2 सेमी (16 - 20 मिमी) है। पिक्सल में, ये मूल्य 45 - 57 पीएक्स होंगे , जो डेवलपर्स के लिए अधिकांश दिशानिर्देशों में संकेतित की तुलना में व्यापक है।



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

पिक्सेल में अंगूठे की औसत चौड़ाई।

उपयोगकर्ताओं की एक बड़ी संख्या है जो मोबाइल डिवाइस पर क्लिक करने के लिए अपनी तर्जनी का उपयोग करते हैं। हालांकि, अंगूठे प्रेमियों का अस्तित्व कम नहीं है। अंगूठे और तर्जनी के बीच मुख्य अंतर इसकी चौड़ाई है, जो औसतन एक वयस्क के लिए 2.5 सेमी है , जिसे 72 पीएक्स में परिवर्तित किया जा सकता है।



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

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

एक अन्य अध्ययन, " मोबाइल फोन पर लक्ष्य चयन के लिए टच की डिज़ाइन " , यह भी पाया गया कि क्लिक क्षेत्र में वृद्धि के साथ त्रुटियों की संख्या कम हो गई थी।

उंगलियों का क्षेत्र लगभग हमेशा सही होता है, लेकिन हमेशा व्यावहारिक नहीं होता है।

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

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

गेमिंग अनुप्रयोगों में उंगलियों के लिए आयाम

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


Gyro13 स्टीम हैलीकाप्टर आर्केड खेल महान स्पर्श नियंत्रण है

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

पुनश्च: कुछ नियमों और अभिव्यक्तियों के लिए, मुझे एक अस्पष्ट अनुवाद नहीं मिला, इसलिए सख्ती से न्याय न करें।