Web3 इंटरफेस डिझाइनसाठी 7 मार्गदर्शक तत्वे

उपयोगिता मार्गदर्शक तत्वे हे व्यापक 'अंगठ्याचे नियम' आहेत जे तुम्ही तुमच्या साइटची उपयोगिता मोजण्यासाठी वापरू शकता. येथील 7 मार्गदर्शक तत्वे विशेषतः Web3 साठी तयार केली आहेत आणि जेकब निल्सनच्या इंटरॅक्शन डिझाइनसाठी 10 सामान्य तत्त्वे (opens in a new tab) सोबत वापरली पाहिजेत.

web3 साठी सात उपयोगिता मार्गदर्शक तत्वे

1. कृतीनंतर प्रतिक्रिया येते
2. सुरक्षा आणि विश्वास
3. सर्वात महत्त्वाची माहिती स्पष्ट आहे
4. समजण्यायोग्य परिभाषा
5. कृती शक्य तितक्या लहान असाव्यात
6. नेटवर्क कनेक्शन दृश्यमान आणि लवचिक आहेत
7. ॲपमधून नियंत्रण, वॉलेटमधून नाही

व्याख्या आणि उदाहरणे

१. कृतीनंतर प्रतिक्रिया येते

जेव्हा काहीतरी घडले आहे किंवा घडत आहे, तेव्हा ते स्पष्ट असले पाहिजे.

वापरकर्ते त्यांच्या मागील कृतींच्या परिणामावर आधारित पुढील कृती ठरवतात. म्हणून त्यांना सिस्टमच्या स्थितीबद्दल माहिती देत राहणे आवश्यक आहे. Web3 मध्ये हे विशेषतः महत्त्वाचे आहे कारण व्यवहारांना ब्लॉकचेनवर नोंद होण्यासाठी काही वेळा थोडा वेळ लागू शकतो. जर त्यांना थांबायला सांगणारी कोणतीही प्रतिक्रिया नसेल, तर वापरकर्त्यांना काही घडले आहे की नाही याची खात्री नसते.

टिपा:

• मेसेजिंग, नोटिफिकेशन्स आणि इतर अलर्टद्वारे वापरकर्त्याला माहिती द्या.
• प्रतीक्षा कालावधी स्पष्टपणे कळवा.
• जर एखाद्या कृतीला काही सेकंदांपेक्षा जास्त वेळ लागणार असेल, तर टायमर किंवा ॲनिमेशनद्वारे वापरकर्त्याला दिलासा द्या जेणेकरून त्यांना काहीतरी घडत आहे असे वाटेल.
• जर प्रक्रियेत अनेक पायऱ्या असतील, तर प्रत्येक पायरी दाखवा.

उदाहरण: व्यवहारात समाविष्ट असलेली प्रत्येक पायरी दाखवल्याने वापरकर्त्यांना ते प्रक्रियेत कोठे आहेत हे जाणून घेण्यास मदत होते. योग्य आयकॉन वापरकर्त्याला त्यांच्या कृतींची स्थिती कळवतात.

२. सुरक्षा आणि विश्वास अंतर्भूत आहेत

सुरक्षेला प्राधान्य दिले पाहिजे आणि वापरकर्त्यासाठी यावर जोर दिला पाहिजे. लोकांना त्यांच्या डेटाची खूप काळजी असते. वापरकर्त्यांसाठी सुरक्षितता ही अनेकदा प्राथमिक चिंता असते, म्हणून डिझाइनच्या सर्व स्तरांवर तिचा विचार केला पाहिजे. तुम्ही नेहमी तुमच्या वापरकर्त्यांचा विश्वास मिळवण्याचा प्रयत्न केला पाहिजे, पण तुम्ही हे कसे करता याचा अर्थ वेगवेगळ्या ॲप्सवर वेगळा असू शकतो. तो नंतरचा विचार नसावा, तर संपूर्ण प्रक्रियेत जाणीवपूर्वक डिझाइन केले पाहिजे. अंतिम UI तसेच सोशल चॅनेल आणि डॉक्युमेंटेशनसह संपूर्ण वापरकर्ता अनुभवातून विश्वास निर्माण करा. विकेंद्रीकरणाची पातळी, ट्रेझरी मल्टी-सिग स्थिती आणि टीम डॉक्स आहे की नाही, यासारख्या गोष्टी वापरकर्त्यांच्या विश्वासावर परिणाम करतात

टिपा:

• तुमच्या ऑडिटची अभिमानाने यादी करा
• अनेक ऑडिट मिळवा
• तुम्ही डिझाइन केलेल्या कोणत्याही सुरक्षा वैशिष्ट्यांची जाहिरात करा
• अंतर्निहित इंटिग्रेशन्ससह संभाव्य धोके ठळकपणे सांगा
• धोरणांची जटिलता कळवा
• तुमच्या वापरकर्त्यांच्या सुरक्षिततेच्या धारणेवर परिणाम करणाऱ्या UI-व्यतिरिक्त समस्यांचा विचार करा

उदाहरण: फूटरमध्ये तुमचे ऑडिट ठळक आकारात समाविष्ट करा.

३. सर्वात महत्त्वाची माहिती स्पष्ट आहे

जटिल प्रणालींसाठी, केवळ सर्वात संबंधित डेटा दाखवा. सर्वात महत्त्वाचे काय आहे ते ठरवा आणि ते दाखवण्यास प्राधान्य द्या. खूप जास्त माहिती गोंधळात टाकणारी असते आणि वापरकर्ते निर्णय घेताना सहसा माहितीच्या एकाच तुकड्यावर लक्ष केंद्रित करतात. DeFi मध्ये, हे बहुधा यील्ड ॲप्सवर APR आणि लेंडिंग ॲप्सवर LTV असेल.

टिपा:

• वापरकर्ता संशोधन सर्वात महत्त्वाचे मेट्रिक उघड करेल
• मुख्य माहिती मोठी आणि इतर तपशील लहान आणि नजरेत न भरणारे ठेवा
• लोक वाचत नाहीत, ते स्कॅन करतात; तुमचे डिझाइन स्कॅन करण्यायोग्य असल्याची खात्री करा

उदाहरण: पूर्ण रंगातील मोठे टोकन स्कॅन करताना सहज सापडतात. APR मोठा आहे आणि ॲक्सेंट रंगात हायलाइट केलेला आहे.

४. स्पष्ट परिभाषा

परिभाषा समजण्यायोग्य आणि योग्य असावी. तांत्रिक शब्दजाल एक मोठा अडथळा असू शकतो, कारण त्यासाठी पूर्णपणे नवीन मानसिक मॉडेल तयार करणे आवश्यक असते. वापरकर्ते डिझाइनला त्यांना आधीच माहित असलेल्या शब्द, वाक्ये आणि संकल्पनांशी जोडू शकत नाहीत. सर्व काही गोंधळात टाकणारे आणि अपरिचित वाटते, आणि ते वापरण्याचा प्रयत्न करण्याआधीच एक कठीण शिकण्याची प्रक्रिया असते. एक वापरकर्ता काही पैसे वाचवण्याच्या इच्छेने DeFi कडे येऊ शकतो आणि त्याला काय मिळते ते म्हणजे: मायनिंग, फार्मिंग, स्टेकिंग, एमिशन्स, ब्राइब्स, वॉल्ट्स, लॉकर्स, veTokens, वेस्टिंग, इपॉक्स, विकेंद्रीकृत अल्गोरिदम, प्रोटोकॉल-ओन्ड लिक्विडिटी... असे सोपे शब्द वापरण्याचा प्रयत्न करा जे लोकांच्या सर्वात मोठ्या गटाला समजतील. फक्त तुमच्या प्रोजेक्टसाठी नवीन शब्द तयार करू नका.

टिपा:

• सोपी आणि सुसंगत परिभाषा वापरा
• शक्य तितकी विद्यमान भाषा वापरा
• तुमचे स्वतःचे शब्द तयार करू नका
• संकेत जसे दिसतील तसे त्यांचे पालन करा
• वापरकर्त्यांना शक्य तितके शिक्षित करा

उदाहरण: “तुमचे रिवॉर्ड्स” हा एक व्यापकपणे समजला जाणारा, तटस्थ शब्द आहे; या प्रोजेक्टसाठी बनवलेला नवीन शब्द नाही. वास्तविक जगाच्या मानसिक मॉडेलशी जुळण्यासाठी रिवॉर्ड्स USD मध्ये दर्शविले जातात, जरी रिवॉर्ड्स स्वतः दुसऱ्या टोकनमध्ये असले तरी.

५. कृती शक्य तितक्या लहान असाव्यात

उप-कृती एकत्र करून वापरकर्त्याच्या परस्परसंवादाला गती द्या. हे स्मार्ट कॉन्ट्रॅक्ट स्तरावर तसेच UI मध्ये केले जाऊ शकते. एक सामान्य कृती पूर्ण करण्यासाठी वापरकर्त्याला सिस्टमच्या एका भागातून दुसऱ्या भागात जाण्याची - किंवा सिस्टम पूर्णपणे सोडण्याची गरज पडू नये.

टिपा:

• शक्य असेल तिथे "Approve" ला इतर कृतींसह एकत्र करा
• स्वाक्षरी करण्याच्या पायऱ्या शक्य तितक्या जवळ एकत्र करा

उदाहरण: “लिक्विडिटी ॲड करणे” आणि “स्टेक करणे” एकत्र करणे हे ॲक्सलरेटरचे एक सोपे उदाहरण आहे जे वापरकर्त्याचा वेळ आणि गॅस दोन्ही वाचवते.

6. नेटवर्क कनेक्शन दृश्यमान आणि लवचिक आहेत

वापरकर्त्याला ते कोणत्या नेटवर्कशी कनेक्ट आहेत याची माहिती द्या आणि नेटवर्क बदलण्यासाठी स्पष्ट शॉर्टकट प्रदान करा. मल्टीचेन ॲप्सवर हे विशेषतः महत्त्वाचे आहे. डिस्कनेक्ट असताना किंवा नॉन-सपोर्टेड नेटवर्कशी कनेक्ट असतानाही ॲपची मुख्य कार्ये दृश्यमान असावीत.

टिपा:

• डिस्कनेक्ट असताना शक्य तितके ॲप दाखवा
• वापरकर्ता सध्या कोणत्या नेटवर्कशी कनेक्ट आहे ते दाखवा
• नेटवर्क बदलण्यासाठी वापरकर्त्याला वॉलेटमध्ये जाऊ देऊ नका
• जर ॲपला वापरकर्त्याला नेटवर्क बदलण्याची आवश्यकता असेल, तर मुख्य कॉल टू ॲक्शनमधून कृतीसाठी प्रॉम्प्ट करा
• जर ॲपमध्ये अनेक नेटवर्कसाठी मार्केट्स किंवा वॉल्ट्स असतील, तर वापरकर्ता सध्या कोणता संच पाहत आहे हे स्पष्टपणे सांगा

उदाहरण: वापरकर्त्याला ते कोणत्या नेटवर्कशी कनेक्ट आहेत ते ॲपबारमध्ये दाखवा आणि त्यांना ते बदलण्याची परवानगी द्या.

7. ॲपमधून नियंत्रण, वॉलेटमधून नाही

UI ने वापरकर्त्याला त्यांना माहित असणे आवश्यक असलेल्या सर्व गोष्टी सांगाव्यात आणि त्यांना जे काही करायचे आहे त्यावर नियंत्रण द्यावे. Web3 मध्ये, काही कृती तुम्ही UI मध्ये करता आणि काही कृती तुम्ही वॉलेटमध्ये करता. सामान्यतः, तुम्ही UI मध्ये एक कृती सुरू करता आणि नंतर वॉलेटमध्ये तिची पुष्टी करता. जर हे दोन धागे काळजीपूर्वक एकत्रित केले नाहीत तर वापरकर्त्यांना अस्वस्थ वाटू शकते.

टिपा:

• UI मधील प्रतिक्रियेद्वारे सिस्टमची स्थिती कळवा
• त्यांच्या इतिहासाची नोंद ठेवा
• जुन्या व्यवहारांसाठी ब्लॉक एक्सप्लोरर्सच्या लिंक प्रदान करा
• नेटवर्क बदलण्यासाठी शॉर्टकट प्रदान करा.

उदाहरण: एक सूक्ष्म कंटेनर वापरकर्त्याला त्यांच्या वॉलेटमध्ये कोणते संबंधित टोकन आहेत हे दाखवतो आणि मुख्य CTA नेटवर्क बदलण्यासाठी एक शॉर्टकट प्रदान करतो.