मुख्य सामग्री पर जाएं
Change page

Web3 इंटरफ़ेस डिज़ाइन के लिए 7 ह्यूरिस्टिक्स

पृष्ठ संपादित करें (opens in a new tab)

उपयोगिता ह्यूरिस्टिक्स (usability heuristics) व्यापक "सामान्य नियम (rules of thumb)" हैं जिनका उपयोग आप अपनी साइट की उपयोगिता को मापने के लिए कर सकते हैं। यहां दिए गए 7 ह्यूरिस्टिक्स विशेष रूप से Web3 के लिए तैयार किए गए हैं और इन्हें Jakob Nielsen के इंटरैक्शन डिज़ाइन के 10 सामान्य सिद्धांतों (opens in a new tab) के साथ इस्तेमाल किया जाना चाहिए।

Web3 के लिए सात उपयोगिता ह्यूरिस्टिक्स

  1. कार्रवाई के बाद फीडबैक
  2. सुरक्षा और विश्वास
  3. सबसे महत्वपूर्ण जानकारी स्पष्ट होती है
  4. समझने योग्य शब्दावली
  5. कार्रवाइयां यथासंभव छोटी होती हैं
  6. नेटवर्क कनेक्शन दृश्यमान और लचीले होते हैं
  7. वॉलेट से नहीं, ऐप से नियंत्रण

परिभाषाएं और उदाहरण

1. कार्रवाई के बाद फीडबैक

यह स्पष्ट होना चाहिए कि कब कुछ हुआ है, या हो रहा है।

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

सुझाव:

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

उदाहरण: लेन-देन में शामिल प्रत्येक चरण को दिखाने से उपयोगकर्ताओं को यह जानने में मदद मिलती है कि वे प्रक्रिया में कहां हैं। उपयुक्त आइकन उपयोगकर्ता को उनके कार्यों की स्थिति बताते हैं।

Informing the user about each step when swapping tokens

2. सुरक्षा और विश्वास अंतर्निहित हैं

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

सुझाव:

  • गर्व के साथ अपने ऑडिट सूचीबद्ध करें
  • कई ऑडिट करवाएं
  • आपके द्वारा डिज़ाइन की गई किसी भी सुरक्षा सुविधा का विज्ञापन करें
  • अंतर्निहित एकीकरण सहित संभावित जोखिमों को उजागर करें
  • रणनीतियों की जटिलता के बारे में बताएं
  • गैर-UI मुद्दों पर विचार करें जो आपके उपयोगकर्ताओं की सुरक्षा की धारणा को प्रभावित कर सकते हैं

उदाहरण: अपने ऑडिट को पाद लेख (footer) में, एक प्रमुख आकार में शामिल करें।

Audits referenced in the website footer

3. सबसे महत्वपूर्ण जानकारी स्पष्ट होती है

जटिल प्रणालियों के लिए, केवल सबसे प्रासंगिक डेटा दिखाएं। निर्धारित करें कि सबसे महत्वपूर्ण क्या है, और इसके प्रदर्शन को प्राथमिकता दें। बहुत अधिक जानकारी भारी पड़ सकती है और निर्णय लेते समय उपयोगकर्ता आमतौर पर जानकारी के एक टुकड़े पर टिके रहते हैं। विकेंद्रीकृत वित्त (DeFi) में, यह संभवतः यील्ड ऐप पर APR और ऋण देने (lending) वाले ऐप पर LTV होगा।

सुझाव:

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

उदाहरण: स्कैन करते समय पूर्ण रंग में बड़े टोकन ढूंढना आसान होता है। APR बड़ा है और एक एक्सेंट रंग में हाइलाइट किया गया है।

The token and APR are easy to find

4. स्पष्ट शब्दावली

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

सुझाव:

  • सरल और सुसंगत शब्दावली का प्रयोग करें
  • जितना संभव हो मौजूदा भाषा का प्रयोग करें
  • अपने स्वयं के शब्द न बनाएं
  • स्थापित नियमों (conventions) का पालन करें
  • उपयोगकर्ताओं को जितना संभव हो उतना शिक्षित करें

उदाहरण: "आपके पुरस्कार (Your rewards)" एक व्यापक रूप से समझा जाने वाला, तटस्थ शब्द है; इस प्रोजेक्ट के लिए बनाया गया कोई नया शब्द नहीं। वास्तविक दुनिया के मानसिक मॉडल से मेल खाने के लिए पुरस्कारों को USD में दर्शाया गया है, भले ही पुरस्कार स्वयं किसी अन्य टोकन में हों।

Token rewards, displayed in U.S. dollars

5. कार्रवाइयां यथासंभव छोटी होती हैं

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

सुझाव:

  • जहां संभव हो "स्वीकृति दें (Approve)" को अन्य कार्रवाइयों के साथ मिलाएं
  • हस्ताक्षर करने (signing) के चरणों को जितना संभव हो एक साथ बंडल करें

उदाहरण: "तरलता जोड़ें (add liquidity)" और "स्टेक" को मिलाना एक त्वरक (accelerator) का एक सरल उदाहरण है जो उपयोगकर्ता का समय और गैस दोनों बचाता है।

Modal showing a switch to combine the deposit and stake actions

6. नेटवर्क कनेक्शन दृश्यमान और लचीले होते हैं

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

सुझाव:

  • डिस्कनेक्ट होने पर ऐप का जितना संभव हो उतना हिस्सा दिखाएं
  • दिखाएं कि उपयोगकर्ता वर्तमान में किस नेटवर्क से जुड़ा है
  • नेटवर्क बदलने के लिए उपयोगकर्ता को वॉलेट में जाने के लिए मजबूर न करें
  • यदि ऐप को उपयोगकर्ता को नेटवर्क स्विच करने की आवश्यकता है, तो मुख्य कॉल टू एक्शन से कार्रवाई का संकेत दें
  • यदि ऐप में कई नेटवर्क के लिए बाज़ार या वॉल्ट हैं, तो स्पष्ट रूप से बताएं कि उपयोगकर्ता वर्तमान में किस सेट को देख रहा है

उदाहरण: उपयोगकर्ता को दिखाएं कि वे किस नेटवर्क से जुड़े हैं, और उन्हें ऐपबार (appbar) में इसे बदलने की अनुमति दें।

Dropdown button showing the connected network

7. वॉलेट से नहीं, ऐप से नियंत्रण

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

सुझाव:

  • UI में फीडबैक के माध्यम से सिस्टम की स्थिति के बारे में बताएं
  • उनके इतिहास का रिकॉर्ड रखें
  • पुराने लेन-देन के लिए ब्लॉक एक्सप्लोरर के लिंक प्रदान करें
  • नेटवर्क बदलने के लिए शॉर्टकट प्रदान करें।

उदाहरण: एक सूक्ष्म कंटेनर उपयोगकर्ता को दिखाता है कि उनके वॉलेट में कौन से प्रासंगिक टोकन हैं, और मुख्य CTA नेटवर्क बदलने के लिए एक शॉर्टकट प्रदान करता है।

Main CTA is prompting the user to switch network

पेज का अंतिम अपडेट: 25 दिसंबर 2024