डिज़ाइन और उपयोगकर्ता अनुभव

अपनी पसंदीदा वेबसाइट या ऐप्लिकेशन के बारे में सोचें. आपको वह क्यों पसंद है? अब, उस वेबसाइट या ऐप्लिकेशन के बारे में सोचें जो आपको पसंद नहीं है. आपको इसमें क्या पसंद नहीं आया? उपयोगकर्ता आपके डिज़ाइन के साथ कैसे इंटरैक्ट करते हैं और आपकी वेबसाइट और ऐप्लिकेशन पर उनका अनुभव कैसा होता है, यह अलग-अलग हो सकता है.

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

सभी को ध्यान में रखकर टेक्नोलॉजी और डिज़ाइन बनाना

हम एक साथ, उपयोगकर्ताओं की सभी संभावित ज़रूरतों को कैसे पूरा कर सकते हैं? सभी को ध्यान में रखकर टेक्नोलॉजी और डिज़ाइन बनाने के बारे में जानकारी डालें. इनक्लूसिव डिज़ाइन में, लोगों की ज़रूरतों को ध्यान में रखकर काम किया जाता है. इसमें सुलभता, इस्तेमाल में आसानी, और सभी को शामिल करने की भावना को एक साथ जोड़ा जाता है.

यूनिवर्सल डिज़ाइन में, एक ऐसे डिज़ाइन पर फ़ोकस किया जाता है जिसे ज़्यादा से ज़्यादा लोग इस्तेमाल कर सकें. हालांकि, समावेशी डिज़ाइन के सिद्धांतों में, किसी व्यक्ति या इस्तेमाल के उदाहरण के लिए डिज़ाइन बनाने पर फ़ोकस किया जाता है. इसके बाद, उस डिज़ाइन को अन्य लोगों के लिए उपलब्ध कराया जाता है.

सुलभता को ध्यान में रखकर, समावेशी डिज़ाइन के सात सिद्धांत बनाए गए हैं:

1. सभी के लिए एक जैसा अनुभव दें: पक्का करें कि आपका इंटरफ़ेस सभी के लिए एक जैसा अनुभव दे. इससे लोग अपनी ज़रूरतों के हिसाब से काम कर पाएंगे. साथ ही, कॉन्टेंट की क्वालिटी भी बनी रहेगी.
2. स्थिति के बारे में सोचें: पक्का करें कि आपका इंटरफ़ेस लोगों को काम का अनुभव दे, भले ही उनकी स्थिति कुछ भी हो.
3. एक जैसे तरीके का इस्तेमाल करें: जाने-पहचाने तरीकों का इस्तेमाल करें और उन्हें लॉजिकल तरीके से लागू करें.
4. कंट्रोल देना: पक्का करें कि लोग अपनी पसंद के मुताबिक कॉन्टेंट को ऐक्सेस कर सकें और उसके साथ इंटरैक्ट कर सकें.
5. विकल्प उपलब्ध कराएं: लोगों को टास्क पूरा करने के अलग-अलग तरीके उपलब्ध कराएं. खास तौर पर, मुश्किल या गैर-मानक टास्क के लिए.
6. कॉन्टेंट को प्राथमिकता दें: कॉन्टेंट और लेआउट में इन एलिमेंट को अपनी पसंद के क्रम में व्यवस्थित करके, उपयोगकर्ताओं को मुख्य टास्क, सुविधाओं, और जानकारी पर फ़ोकस करने में मदद करें.
7. वैल्यू जोड़ें: सुविधाओं के मकसद और अहमियत के बारे में सोचें. साथ ही, यह भी सोचें कि ये सुविधाएं अलग-अलग उपयोगकर्ताओं के अनुभव को कैसे बेहतर बनाती हैं.

पर्सोना

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

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

दिव्यांगों को शामिल करना

"सभी लोग अलग-अलग होते हैं. मैं सिर्फ़ अपने अनुभव के आधार पर बोल सकती हूँ. जब आप किसी एक व्यक्ति से मिलते हैं, तो इसका मतलब यह नहीं है कि आपने सभी लोगों से मुलाकात कर ली."

ID24 की बातचीत में शामिल Meryl Evans ने Deaf Tech: Travel Through Time from Past to Future के बारे में बताया.

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

आपके पर्सोना में दिव्यांग लोगों को शामिल करने का तरीका चाहे जो भी हो, वे असल लोगों या स्टीरियोटाइप पर आधारित नहीं होने चाहिए. साथ ही, पर्सोना कभी भी उपयोगकर्ता की टेस्टिंग का विकल्प नहीं होते.

डिसएबिलिटी सिम्युलेटर

अपने पर्सोना की नकल करने या उन्हें बेहतर बनाने के लिए, विकलांगता सिम्युलेटर का इस्तेमाल करते समय ज़्यादा सावधानी बरतें.

विकलांगता सिम्युलेटर, दोधारी तलवार की तरह होते हैं. इनसे सहानुभूति या हमदर्दी मिल सकती है. यह इस बात पर निर्भर करता है कि सिम्युलेटर का इस्तेमाल कौन कर रहा है, किस संदर्भ में किया जा रहा है, और ऐसे कई अन्य फ़ैक्टर जिन पर कंट्रोल नहीं किया जा सकता. दिव्यांगों के लिए काम करने वाले कई लोग, दिव्यांगता का अनुभव कराने वाले टूल इस्तेमाल करने के ख़िलाफ़ हैं. वे दिव्यांग लोगों के बनाए गए वीडियो, डेमो, ट्यूटोरियल, और अन्य कॉन्टेंट देखने का सुझाव देते हैं. साथ ही, वे दिव्यांग लोगों के अनुभवों के बारे में सीधे तौर पर जानने का सुझाव देते हैं.

"मुझे लगता है कि हमें यह बात साफ़ तौर पर बतानी चाहिए कि सिम्युलेशन से जुड़ी किसी भी गतिविधि से, उन सबसे ज़रूरी बातों पर कोई असर नहीं पड़ता जिनके बारे में हम चाहते हैं कि दृष्टिबाधित लोग अपने दिल और दिमाग़ से जानें. अंधापन हमारी पहचान नहीं है. अंधापन के बारे में गलतफ़हमियां और कम उम्मीदें, हमारी सबसे बड़ी बाधा हैं.

इन गलतफ़हमियों की वजह से, बनावटी रुकावटें पैदा होती हैं. इनकी वजह से, हम पूरी तरह से हिस्सा नहीं ले पाते. साथ ही, ये झूठी सीमाएं हमें पीछे धकेलती हैं."

मार्क रिकोबोना, नैशनल फ़ेडरेशन ऑफ़ द ब्लाइंड के अध्यक्ष.

सुलभता से जुड़े ह्यूरिस्टिक्स

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

साल 2019 में, Deque की डिज़ाइन टीम ने डिजिटल ऐक्सेसिबिलिटी पर फ़ोकस करने वाले, अनुमान लगाने के नए सिद्धांत बनाए और उन्हें शेयर किया. उनकी रिसर्च के मुताबिक, किसी वेबसाइट या ऐप्लिकेशन के लिए, सुलभता से जुड़ी सभी गड़बड़ियों में से 67% तक को ठीक किया जा सकता है. इसके लिए, डिज़ाइन प्रोसेस में सुलभता को शामिल करना ज़रूरी है. इससे काफ़ी फ़र्क़ पड़ता है. कोड की एक भी लाइन लिखे जाने से पहले ही, यह फ़र्क़ दिख सकता है.

मूल ह्यूरिस्टिक के सेट की तरह ही, डिज़ाइन प्लान करते समय सुलभता से जुड़े दस ह्यूरिस्टिक पर ध्यान देना होता है.

1. इंटरैक्शन के तरीके और मोड: उपयोगकर्ता अपनी पसंद के इनपुट तरीके (जैसे कि माउस, कीबोर्ड, टच वगैरह) का इस्तेमाल करके, सिस्टम के साथ आसानी से इंटरैक्ट कर सकते हैं.
2. नेविगेशन और रास्ता ढूंढना: उपयोगकर्ता, सिस्टम में कभी भी नेविगेट कर सकते हैं, कॉन्टेंट ढूंढ सकते हैं, और यह पता लगा सकते हैं कि वे कहां हैं.
3. स्ट्रक्चर और सिमैंटिक्स: उपयोगकर्ताओं को हर पेज पर मौजूद कॉन्टेंट का स्ट्रक्चर समझ में आना चाहिए. साथ ही, उन्हें यह भी समझ में आना चाहिए कि सिस्टम को कैसे इस्तेमाल करना है.
4. गड़बड़ी को रोकना और गड़बड़ी की स्थितियां: इंटरैक्टिव कंट्रोल में, लगातार और काम के निर्देश होते हैं. इनसे गड़बड़ियों को रोकने में मदद मिलती है. साथ ही, उपयोगकर्ताओं को गड़बड़ी की स्थितियों के बारे में साफ़ तौर पर जानकारी मिलती है. इससे यह पता चलता है कि समस्याएं क्या हैं और उन्हें कैसे ठीक किया जाए. यह जानकारी तब मिलती है, जब गड़बड़ियां दिखती हैं.
5. कंट्रास्ट और पढ़ने में आसानी: उपयोगकर्ता, टेक्स्ट और अन्य ज़रूरी जानकारी को आसानी से पढ़ सकते हैं और उनके बीच अंतर कर सकते हैं.
6. भाषा और पढ़ने में आसानी: उपयोगकर्ता आसानी से कॉन्टेंट पढ़ सकते हैं और उसे समझ सकते हैं.
7. अनुमान लगाने और एक जैसा अनुभव मिलने की सुविधा: उपयोगकर्ता, हर एलिमेंट के मकसद का अनुमान लगा सकते हैं. इससे यह साफ़ तौर पर पता चलता है कि हर एलिमेंट, सिस्टम से किस तरह जुड़ा है.
8. समय और डेटा का रखरखाव: उपयोगकर्ताओं को अपने टास्क पूरे करने के लिए काफ़ी समय दिया जाता है. साथ ही, अगर उनका समय (यानी कि सेशन) खत्म हो जाता है, तो उनकी जानकारी नहीं मिटती.
9. मूवमेंट और फ़्लैश होना: उपयोगकर्ता, पेज पर मौजूद उन एलिमेंट को रोक सकते हैं जो मूव करते हैं, फ़्लैश होते हैं या ऐनिमेटेड होते हैं. इन एलिमेंट की वजह से, उपयोगकर्ताओं का ध्यान नहीं भटकना चाहिए या उन्हें किसी तरह का नुकसान नहीं पहुंचना चाहिए.
10. विज़ुअल और ऑडियो के विकल्प: उपयोगकर्ता, जानकारी देने वाले किसी भी विज़ुअल या ऑडियो कॉन्टेंट के लिए, टेक्स्ट पर आधारित विकल्पों को ऐक्सेस कर सकते हैं.

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

नेविगेशन और रास्ता ढूंढने के चेकपॉइंट के लिए, सुलभता की हिस्टिक समीक्षा का उदाहरण यहां दिया गया है:

नेविगेशन और रास्ता ढूंढने के लिए चेकपॉइंट	बहुत अच्छा (+2 पॉइंट)	पास (+1 पॉइंट)	यूआरएल, लिंक की जांच में फ़ेल हो गया (-1 पॉइंट)	लागू नहीं (0 पॉइंट)
क्या फ़ोकस किए जाने पर, सभी चालू एलिमेंट पर साफ़ तौर पर दिखने वाला इंडिकेटर सेट किया गया है?	check
क्या पेज पर मौजूद टाइटल टेक्स्ट, पेज के हिसाब से काम का है? साथ ही, क्या इसमें पेज के बारे में खास जानकारी सबसे पहले दी गई है?			check
क्या पेज का टाइटल एलिमेंट और H1 टैग एक जैसे हैं या मिलते-जुलते हैं?		check
क्या हर मुख्य सेक्शन के लिए काम की हेडिंग दी गई हैं?		check
क्या लिंक के मकसद के बारे में सिर्फ़ लिंक के टेक्स्ट या उसके आस-पास के कॉन्टेक्स्ट से पता चलता है?				check
क्या पेज में सबसे ऊपर स्किप लिंक दिया गया है और क्या फ़ोकस करने पर यह दिखता है?			check
क्या नेविगेशनल एलिमेंट को इस तरह से व्यवस्थित किया गया है कि लोग आसानी से रास्ता ढूंढ सकें?	check

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

सुलभता से जुड़ी एनोटेशन

अपने डिज़ाइन को डेवलपमेंट टीम को सौंपने से पहले, आपको सुलभता एनोटेशन जोड़ने चाहिए.

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

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

यहां दिए गए डिज़ाइन के उदाहरण, Figma के लिए Indeed.com की ऐक्सेसिबिलिटी एनोटेशन किट से लिए गए हैं.

आपके डिज़ाइन प्रोग्राम के आधार पर, आपके पास चुनने के लिए कई ऐक्सेसिबिलिटी एनोटेशन स्टार्टर किट होनी चाहिए. इसके अलावा, अगर आपको पसंद है, तो अपना सेट बनाया जा सकता है. दोनों ही मामलों में, आपको यह तय करना होगा कि हैंड-ऑफ़ टीम को कौनसी जानकारी देनी है और किस फ़ॉर्मैट में देनी है.

सुलभता एनोटेशन के लिए, इन बातों पर ध्यान दें:

• कलर: पैलेट में मौजूद सभी रंगों के अलग-अलग कॉम्बिनेशन के कंट्रास्ट रेशियो शामिल करें.
• बटन और लिंक: डिफ़ॉल्ट, होवर, चालू, फ़ोकस, और बंद स्थितियों की पहचान करें.
• स्किप लिंक: डिज़ाइन के छिपे हुए और दिखने वाले पहलुओं को हाइलाइट करें. साथ ही, यह भी बताएं कि वे पेज पर कहां लिंक होते हैं.
• इमेज और आइकॉन: ज़रूरी इमेज और आइकॉन के लिए, वैकल्पिक टेक्स्ट जोड़ने के सुझाव पाएं.
• ऑडियो और वीडियो: सबटाइटल, ट्रांसक्रिप्ट, और ऑडियो फ़ॉर्मैट में जानकारी सुनने की सुविधा के लिए, हाइलाइट किए गए हिस्से और लिंक.
• हेडिंग: प्रोग्रामैटिक लेवल जोड़ें और हेडिंग की तरह दिखने वाली हर चीज़ को शामिल करें.
• लैंडमार्क: एचटीएमएल या ARIA की मदद से, डिज़ाइन के अलग-अलग सेक्शन हाइलाइट करें.
• इंटरैक्टिव कॉम्पोनेंट: क्लिक किए जा सकने वाले एलिमेंट, होवर इफ़ेक्ट, फ़ोकस एरिया की पहचान करें.
• कीबोर्ड: पहचान करें कि फ़ोकस कहां से शुरू होना चाहिए (अल्फ़ा स्टॉप) और टैब का क्रम क्या होना चाहिए.
• फ़ॉर्म: फ़ील्ड के लेबल, सहायता टेक्स्ट, गड़बड़ी के मैसेज, और सफलता के मैसेज जोड़ें.
• ऐक्सेस किए जा सकने वाले नाम: इससे यह पता चलता है कि सहायक टेक्नोलॉजी को एलिमेंट की पहचान कैसे करनी चाहिए.