10 UX / UI टिप्स: कैसे कपड़ों के लेबल और डेटिंग एप्लिकेशन हमें बेहतर डिजाइन करना सिखाते हैं

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

हम अपने लक्षित दर्शकों की विशेषताओं को ध्यान में रखते हैं

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

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



मुख्य बात यह है कि "उपयोगकर्ताओं के लक्ष्य क्या हैं?" जैसे सवालों के जवाब देने के लिए, "इन लक्ष्यों को साकार करने के तरीके में क्या है?", "कैसे और क्या करने की आवश्यकता है ताकि उनके उपयोगकर्ताओं की मदद की जा सके?" सामान्य तौर पर, यह "आपके" उपयोगकर्ता (नीचे चित्रण) का एक चित्र बनाने में मदद करता है, जो आगे के काम में बहुत मदद करता है।



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

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

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

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

प्रत्यक्ष संपर्क के उदाहरण (टचस्क्रीन के लिए प्रासंगिक):

• बटन पर टैप करें।
• स्वाइप करें।
• अपनी उंगली से इंटरफ़ेस तत्व लपेटें।

अप्रत्यक्ष (अप्रत्यक्ष) बातचीत के उदाहरण (किसी भी उपकरण के लिए प्रासंगिक):

• माउस चयन।
• विशेष आज्ञाओं का उपयोग करना।
• प्रपत्र में डेटा दर्ज करना।

इंटरफ़ेस को उपयोगकर्ता को बताना चाहिए कि क्या करना है।

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



ट्विटर (सेवा का पुराना डिज़ाइन) एक समय में कुछ भी सुझाता नहीं था। एक शुरुआत करने वाला क्या समझ सकता है जो अभी पंजीकृत है? थोड़ा सा।

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



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

1. पाठ दर्ज करने के लिए एक क्षेत्र है, यह हमेशा उपलब्ध है।
2. उपयोगकर्ता के लिए एक संकेत है कि आप ट्विटर पर समाचार साझा कर सकते हैं। इसे "व्हाट्स न्यू?" के रूप में लागू किया गया है।
3. फ़ीड के लिए जोड़े गए सुझाव - यदि फ़ीड में कोई ट्वीट नहीं हैं, तो आपको कुछ करने की आवश्यकता है, साथ ही युक्तियों का एक ब्लॉक दिखाई देता है, जिनके लिए आपको सदस्यता लेनी चाहिए।
4. शब्द "रुझान" के बजाय जो कई के लिए समझ से बाहर है, शिलालेख "आपके लिए वास्तविक विषय" जोड़ा गया है।

स्पष्ट फैसले और झूठे वादे

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

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



यह एक पैलेट का उपयोग करने के लायक भी है जो अधिकांश के लिए समझ में आता है। ग्रीन का आमतौर पर मतलब है "सब ठीक है," लाल का अर्थ है "गलती।" सब कुछ स्वैप करें - और उपयोगकर्ता गलतियाँ करेंगे, जिससे एप्लिकेशन या सेवा के साथ काम करने पर झुंझलाहट दिखाई देगी।



इसके अलावा, इंटरफ़ेस तत्व यथासंभव स्पष्ट होना चाहिए।



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



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



आइकनों का चयन नहीं करने का एक हड़ताली उदाहरण है कि कपड़े और लिनन के लिए लेबल पर तैयार की गई चीजों के साथ क्या और क्या नहीं किया जा सकता है। यह पवित्र ज्ञान है, कुछ की समझ के लिए सुलभ है।



आइकन के लिए निहित मूल्य का एक और उदाहरण Apple मेल इंटरफ़ेस तत्व है। संदेश लिखने के लिए आपको क्या क्लिक करने की आवश्यकता है? श्रृंखला से प्रश्न "सभी 400 के लिए।"

डिफ़ॉल्ट सेटिंग्स स्पष्ट और व्यावहारिक होनी चाहिए।

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

लगभग कोई भी टीवी, टैबलेट, फोन की सेटिंग में बदलाव नहीं करता है। रेफ्रिजरेटर के लगभग 99% खरीदार कभी भी डिवाइस के ऑपरेटिंग मोड को नहीं बदलते हैं।

बेशक, इंटरफ़ेस एक रेफ्रिजरेटर नहीं है, लेकिन इसे विकसित करते समय, यह संभव के रूप में स्पष्ट और सुविधाजनक सब कुछ करने के लायक है।

उपयोगकर्ता प्रतिक्रिया

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

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

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



यह जीमेल की तरह होना आवश्यक नहीं है, लेकिन विश्वसनीय और ध्यान देने योग्य उपयोगकर्ता प्रतिक्रिया बनाने के लिए बस आवश्यक है।

सही समय पर सही जगह पर

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

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



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



किसी भी मामले में, एप्लिकेशन या साइट के इंटरैक्टिव तत्वों की नियुक्ति उपयोगकर्ता के लिए सुविधाजनक होनी चाहिए।

मानकों की अनदेखी न करें

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

यह अन्य साइटों और अनुप्रयोगों के साथ पिछले उपयोगकर्ता अनुभव के लिए प्रासंगिक होना चाहिए। यदि यह मामला नहीं है, तो एप्लिकेशन / सेवा कष्टप्रद होगी, जहां उपयोगकर्ता "सब कुछ गलत है।"



ऊपर gif पॉकेट एंड्रॉइड एप्लिकेशन में एक इंटरफ़ेस तत्व को बदलने का एक उदाहरण दिखाता है। यह तत्व 2013 में स्थित था, जहां एंड्रॉइड डेवलपर्स की सिफारिश पर, अप बटन स्थित होना चाहिए। लेकिन कुछ कार्यों को डुप्लिकेट नहीं करना चाहते थे, पॉकेट के रचनाकारों ने "पुरातत्व" बटन को बाईं ओर शीर्ष पर रखने का फैसला किया।



नतीजतन, आवेदन के नए उपयोगकर्ताओं का एक समूह, पृष्ठ पर एक विशिष्ट स्थान पर जाने के बजाय, ग्रंथों को संग्रहीत करता है।

जहाँ संभव हो सब कुछ सरल करें

डिजाइनरों की शुरुआत (और कुछ मामलों में बहुत अधिक पेशेवरों) की गलतियों में से एक इंटरफेस की एक अनावश्यक जटिलता है।



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

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

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

विश्लेषण

प्रत्येक डिजाइनर इस या उस निर्णय को सफल मान सकता है। लेकिन वास्तव में, निष्कर्ष केवल साइट या एप्लिकेशन इंटरफ़ेस के साथ उपयोगकर्ता इंटरैक्शन से संबंधित डेटा का विश्लेषण करने के बाद निकाला जा सकता है।

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

मुख्य बात यह है कि एकत्र किए गए डेटा का विश्लेषण किया जाता है और मौजूदा समाधान का अनुकूलन करने के लिए उपयोग किए गए विश्लेषण के परिणाम।

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