🍯 👍 👨🏻‍⚕️ जीयूआई डिजाइन ✍🏾 🏄 👩‍🎤

परिचय

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

हालांकि, सभी डेवलपर्स और यहां तक कि डिजाइनर भी एक सुविधाजनक और समझने योग्य ग्राफिकल यूजर इंटरफेस बनाने के बारे में नहीं सोच रहे हैं।

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

सामान्य सिद्धांत

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

क्या ईआई बनाने के लिए?

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

ईआई का डिजाइन क्या होना चाहिए?

वास्तव में, ईआई का डिजाइन एक अलग लेख का विषय है। यहां आपको सब कुछ पर विचार करने की आवश्यकता है: रंग, आकार, अनुपात से, संज्ञानात्मक मनोविज्ञान के साथ समाप्त होना। हालांकि, कई सिद्धांत अभी भी ध्यान देने योग्य हैं:

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

ईआई को स्क्रीन पर कैसे रखें?

एक दावा है कि दृश्य अपील अनुपात पर आधारित है। प्रसिद्ध संख्या 1.62 याद है? यह तथाकथित गोल्डन सेक्शन सिद्धांत है। लब्बोलुआब यह है कि पूरे खंड में से अधिकांश को संदर्भित करता है, जिस तरह से अधिकांश इसे कम को संदर्भित करता है। उदाहरण के लिए, साइट की कुल चौड़ाई 900px है, हम 900 को 1.62 से विभाजित करते हैं, हमें ~ 555px मिलता है, यह सामग्री के साथ ब्लॉक की चौड़ाई है। अब हम 900 से 555 घटाते हैं और 345px प्राप्त करते हैं। यह छोटे भाग की चौड़ाई है:
स्थिति से पहले, ईआई को आदेश दिया जाना चाहिए (समूहबद्ध) महत्व के द्वारा। यानी निर्धारित करें कि कौन से सबसे महत्वपूर्ण हैं और कौन से कम हैं।
आमतौर पर (लेकिन जरूरी नहीं), तत्वों को निम्नलिखित ग्रेडेशन में रखा जाता है: बाएं से दाएं, ऊपर से नीचे तक। सबसे ऊपर बाईं ओर सबसे महत्वपूर्ण तत्व हैं, नीचे दाईं ओर - कम। यह उस क्रम के कारण है जिसमें पाठ पढ़ा जाता है। टच स्क्रीन के मामले में, सबसे महत्वपूर्ण तत्व अंगूठे की कार्रवाई के क्षेत्र में स्थित हैं।
उपयोगकर्ता की आदतों पर विचार किया जाना चाहिए। उदाहरण के लिए, यदि विंडोज़ में क्लोज बटन ऊपरी दाएं कोने में स्थित है, तो प्रोग्राम को उसी स्थान पर एक समान बटन रखना होगा। यानी इंटरफ़ेस में उपयोगकर्ता के लिए जानी जाने वाली चीजों के साथ अधिक से अधिक एनालॉग होना चाहिए।
ईआई को उस स्थान के करीब रखें जहां उपयोगकर्ता कर्सर स्थित है। ताकि उसे कर्सर को स्क्रीन के एक छोर से दूसरे छोर तक ले जाना न पड़े।
अनुपात रखें
एक इंटरफ़ेस तत्व को दृश्यमान माना जा सकता है यदि यह या तो वर्तमान में मानव संवेदी अंगों के लिए सुलभ है, या यह हाल ही में माना गया है कि यह अभी तक अल्पकालिक स्मृति छोड़ने में कामयाब नहीं हुआ है। इंटरफ़ेस को ठीक से काम करने के लिए, केवल आवश्यक चीजें दिखाई देनी चाहिए - वे जो कार्य प्रणालियों के कुछ हिस्सों की पहचान करते हैं, और जो उस तरीके को दर्शाते हैं जिसमें उपयोगकर्ता डिवाइस के साथ बातचीत कर सकता है।
ईआई के बराबर या एक दूसरे के लिए कई के बीच इंडेंट।

ईआई को कैसे व्यवहार करना चाहिए?

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

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

निष्कर्ष में

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

साहित्य

जेफ रस्किन , "इंटरफ़ेस: कंप्यूटर सिस्टम डिजाइन में नए रुझान"
एलन कूपर , "इंटरफ़ेस के बारे में। इंटरेक्शन डिजाइन मूल बातें
एलन कूपर , "मरीजों के हाथों में मानसिक अस्पताल"

जीयूआई डिजाइन