रउरा शायद एहसे पहिले भी गइल होखब. हमनी के प्रयोगकर्ता लोग के मोडल देखावे में से कइसे चुनीं जा, आ कब ओह लोग के अलग, नया पन्ना पर नेविगेट करीं जा? आ का एकरा से कवनो फर्क पड़ेला? असल में त अइसने होला. ई फैसला उपयोगकर्ता लोग के प्रवाह, ओह लोग के संदर्भ, ओह लोग के विवरण देखे के क्षमता, आ ओकरा साथे त्रुटि के आवृत्ति आ काम पूरा होखे के प्रभावित करेला. दुनों विकल्प बिघटनकारी आ निराशाजनक हो सके ला — गलत समय पर, आ गलत जगह पर। त बेहतर होई कि हमनी के ठीक से मिल जाव. खैर, देखल जाव कि ठीक वइसने कइसे कइल जाव. मोडल बनाम डायलॉग बनाम ओवरले बनाम लाइटबॉक्स के बा जबकि हमनी के अक्सर एकही मोडल यूआई घटक के बारे में बात करेनी जा, हमनी के अक्सर सभ अलग-अलग प्रकार के मोडल के बीच महीन, जटिल बारीकियन के अनदेखी करेनी जा। असल में हर मोडल एके जइसन ना होला. मोडल, डायलॉग, ओवरले, आ लाइटबॉक्स — सभ एकही नियर आवाज में आवे लें, बाकी वास्तव में ई बिल्कुल अलग बाड़ें:
संवाद“बातचीत” (उपयोगकर्ता ↔ सिस्टम) खातिर एगो सामान्य शब्द। ओवरले एगो छोट सामग्री पैनल जवन पन्ना के ऊपर देखावल जाला। ModalUser के ओवरले + बैकग्राउंड अक्षम के साथ बातचीत करे के होई। NonmodalUser के ओवरले + बैकग्राउंड सक्षम के साथ बातचीत करे के पड़ी। लाइटबॉक्समोडल पर ध्यान केंद्रित करे खातिर पृष्ठभूमि मद्धिम कर दिहल गइल।
जइसन कि अन्ना काले रेखांकित कइले बाड़ी, अधिकतर ओवरले गलत समय पर लउके ला, महत्वपूर्ण काम के दौरान प्रयोगकर्ता लोग के बाधित करे ला, खराब भाषा के इस्तेमाल करे ला आ प्रयोगकर्ता लोग के प्रवाह के तोड़ देला। ई स्वभाव से बाधक पैदा करे वाला होलें, आ आमतौर पर एकर गंभीरता के स्तर बहुत होला आ एकर मजबूत जरूरत ना होला।
निश्चित रूप से यूजर के धीमा करे के पड़ी आ अगर ओह लोग के कार्रवाई के परिणाम के बहुत असर पड़े त ओकरा के टोके देबे के पड़ी बाकिर अधिकतर परिदृश्य खातिर गैर-मोडल बहुते अधिका सूक्ष्म होला आ उपयोगकर्ता के ध्यान में कुछ ले आवे खातिर अधिका दोस्ताना विकल्प होला. अगर कुछ बा त हम हमेशा सुझाव देत बानी कि ई डिफ़ॉल्ट होखे. मोडल → एकल, स्व-निर्मित काम खातिर डिजाइनर के रूप में हमनी के अक्सर मोडल के अप्रासंगिक आ परेशान करे वाला बता के खारिज कर देनी जा — आ अक्सर अइसन होला! — तबो ओह लोग के आपन मूल्य भी बा। ई प्रयोगकर्ता लोग के संभावित गलती के बारे में चेतावे में या डेटा के नुकसान से बचे में मदद करे में बहुत मददगार हो सके लें। ई संबंधित क्रिया सभ के निष्पादन में भी मदद क सके लें या फिर पन्ना के वर्तमान स्थिति में बाधा ना डालले बिस्तार से ड्रिल डाउन क सके लें। लेकिन मोडल के सबसे बड़ फायदा इ बा कि इ उपयोगकर्ता के वर्तमान स्क्रीन के संदर्भ के रखे में मदद करेला। एकर मतलब खाली यूआई ना होला बलुक एडिट कइल इनपुट, स्क्रॉल पोजीशन, अकॉर्डियन के स्टेट, फिल्टर के चयन, सॉर्टिंग वगैरह भी होला.
कई बेर, प्रयोगकर्ता लोग के कौनों चयन के जल्दी से पुष्टि करे के पड़े ला (जइसे कि ऊपर देखावल गइल फिल्टर) आ फिर ओहिजा से तुरंत आगे बढ़े के पड़े ला। ऑटो-सेव से भी इहे हासिल हो सकेला, बेशक, लेकिन एकर हमेशा जरूरत भा वांछित ना होखेला। आ यूआई के ब्लॉक कइल अक्सर बढ़िया विचार ना होला. हालांकि मोडल के इस्तेमाल कवनो काम खातिर ना कइल जाला. आमतौर पर हमनी के इनहन के इस्तेमाल एकल, स्व-निर्मित काम खातिर करे लीं जहाँ प्रयोगकर्ता लोग के कूद के अंदर आवे के चाहीं, कौनों काम पूरा करे के चाहीं आ फिर जहाँ ऊ लोग रहे ओहिजा वापस आवे के चाहीं। आश्चर्य के बात नइखे कि ई उच्च प्राथमिकता वाला, छोट बातचीत (जइसे कि अलर्ट, बिनाशकारी कार्रवाई, जल्दी से पुष्टि) खातिर बढ़िया काम जरूर करे लीं। जब मोडल मदद करेला: 🚫 मोडल अक्सर विघटनकारी, आक्रामक, आ भ्रमित करे वाला होला।🚫 एकरा से तुलना आ कॉपी-पेस्ट कइल मुश्किल हो जाला।✅ फिर भी मोडल उपयोगकर्ता के कई गो संदर्भ के बनाए रखे के अनुमति देला।✅ अपरिवर्तनीय त्रुटि आ डेटा के नुकसान के रोके खातिर उपयोगी।✅ उपयोगी अगर उपयोगकर्ता के नया पन्ना पर भेजल विघटनकारी होई। ✅ कवनो मोडल के तबे देखाईं जब उपयोगकर्ता व्यवधान के मूल्यांकन करीहें।✅ डिफ़ॉल्ट रूप से, गैर-ब्लॉकिंग संवाद (“गैरमोडल”) पसंद करीं।✅ उपयोगकर्ता के बाद में संवाद के न्यूनतम करे, छिपावे, या बहाल करे के अनुमति दीं।✅ उपयोगकर्ता के धीमा करे खातिर मोडल के इस्तेमाल करीं, जइसे कि जटिल इनपुट के सत्यापन करीं।✅ “बंद करीं”, ESC कुंजी से बाहर निकले के रास्ता दीं, या बाहर क्लिक करीं बॉक्स के बा। पन्ना → जटिल, बहु-चरणीय कार्यप्रवाह खातिर मोडल के भीतर विज़ार्ड भा टैब कइल नेविगेशन बहुत बढ़िया काम ना करेला, ऊहो जटिल एंटरप्राइज प्रोडक्ट में — उहाँ, साइड पैनल भा दराज आमतौर पर बेहतर काम करेला. समस्या तब शुरू होला जब प्रयोगकर्ता लोग के डेटा बिंदु सभ के तुलना भा संदर्भ देवे के जरूरत होखे — फिर भी मोडल सभ एह बेहवार के रोके लें, एह से ऊ लोग एकरे बजाय एकही पन्ना के कई गो टैब सभ में दोबारा खोले ला।
अउरी जटिल प्रवाह आ बहु-चरण प्रक्रिया खातिर, स्टैंडअलोन पन्ना सभसे नीक काम करे लें। पन्ना तब भी बेहतर काम करेला जब ऊ उपयोगकर्ता के पूरा ध्यान के मांग करेला, आ पिछला स्क्रीन के संदर्भ बहुत मददगार ना होला. आ दराज सब-टास्क खातिर काम करे लें जे साधारण मोडल खातिर बहुत जटिल होलें, बाकी पूरा पन्ना नेविगेशन के जरूरत ना पड़े लें। मोडल से कब बचे के चाहीं: 🚫 त्रुटि संदेश खातिर मोडल से बची।🚫 फीचर सूचना खातिर मोडल से बची।🚫 ऑनबोर्डिंग अनुभव खातिर मोडल से बची।🚫 जटिल, लंबा मल्टी-स्टेप-टास्क खातिर मोडल से बची।🚫 कई गो नेस्टेड मोडल से बची आ एकरा बजाय प्रीव/नेक्स्ट के इस्तेमाल करीं।🚫 ऑटो-ट्रिगर मोडल से बची जब तक कि बिल्कुल जरूरी ना होखे। दुनु से बचे के चाहींबार-बार होखे वाला काम खातिर कई गो जटिल, काम से भरपूर प्रोडक्ट सभ में, यूजर लोग खुद के एकही काम के बार-बार, बार-बार करे वाला पाई। उहाँ मोडल आ नया पन्ना नेविगेशन दुनों घर्षण जोड़ देलें काहें से कि ई प्रवाह के बाधित करे लें या प्रयोगकर्ता लोग के सभ अलग-अलग टैब भा व्यू सभ के बीच गायब डेटा एकट्ठा करे खातिर मजबूर करे लें। बहुत बार, प्रयोगकर्ता लोग के अंत में एगो टूटल अनुभव होला, जवन कबो ना खतम होखे वाला पुष्टि, अतिरंजित चेतावनी, मुखर निर्देश, या खाली गायब संदर्भ बिंदु से भरल होला। जइसे कि साउलिस स्टेबुलिस बतवले बाड़न, एह परिदृश्य सभ में, बिस्तार करे लायक खंड भा जगह पर संपादन अक्सर बेहतर काम करे ला — ई काम के वर्तमान स्क्रीन पर लंगर डाल के रखे लें। व्यवहार में कई गो परिदृश्य में यूजर अलग-थलग आपन काम पूरा ना करेलें. इनहन के डेटा देखल, मान कॉपी-पेस्ट करे के जरूरत बा, अलग-अलग जगह पर प्रविष्टि सभ के रिफाइंड करे के जरूरत बा, या बस अपना काम के माध्यम से काम करत समय समान रिकार्ड सभ के समीक्षा करे के जरूरत बा। ओवरले आ दराज काम के दौरान बैकग्राउंड डेटा तक पहुँच बनावे में अधिका मददगार होला। एकरे परिणाम के रूप में संदर्भ हमेशा अपना जगह पर रहे ला, संदर्भ भा कॉपी-पेस्ट खातिर उपलब्ध रहे ला। मोडल आ पन्ना नेविगेशन के ओह पल खातिर सेव करीं जहाँ रुकावट सही मायने में मूल्य जोड़ देला — खासतौर पर महत्वपूर्ण गलती के रोके खातिर। मोडल बनाम पन्ना: एगो निर्णय के पेड़ कुछ समय पहिले रयान न्यूफेल्ड एगो बहुत मददगार गाइड बनवले रहलें जेह से डिजाइनर लोग के मोडल आ पन्ना सभ के बीच चुनाव करे में मदद मिल सके। एकरा में एगो सुलभ पीएनजी चीटशीट अवुरी गूगल डॉक टेम्पलेट बा, जवना में सवाल के 7 सेक्शन में बांटल बा। ई लमहर बा, बेहद गहन बा, बाकिर पालन कइल बहुते आसान बा:
हो सकेला कि ई कठिन लागत होखे, बाकिर ई एगो काफी सरल 4-चरण के प्रक्रिया ह:
स्क्रीन के संदर्भ।पहिले हमनी के जांच करेनी जा कि उपयोगकर्ता के अंतर्निहित स्क्रीन के संदर्भ के कायम राखे के जरूरत बा कि ना। काम के जटिलता आ अवधि।सरल, केंद्रित, गैर-विचलित काम सभ में मोडल के इस्तेमाल हो सके ला, बाकी लंबा, जटिल प्रवाह सभ खातिर पन्ना के जरूरत होला। अंतर्निहित पन्ना के संदर्भ।फिर, हमनी के जांच करे लीं कि प्रयोगकर्ता लोग के अक्सर बैकग्राउंड में डेटा के संदर्भ देवे के जरूरत होला कि ना या काम एगो साधारण पुष्टि भा चयन हवे। सही ओवरले चुनल।अंत में, अगर कवनो ओवरले वाकई में एगो बढ़िया विकल्प बा, त ई हमनी के मोडल भा नॉनमोडल (नॉनमोडल के ओर झुकल) के बीच चुने खातिर मार्गदर्शन करेला।
लपेटत बानी जब भी संभव होखे पूरा यूआई के ब्लॉक करे से बची। डायलॉग फ्लोटिंग होखे, आंशिक रूप से यूआई के कवर करे, लेकिन नेविगेशन, स्क्रॉल, आ कॉपी-पेस्टिंग के अनुमति देवे। या मोडल के सामग्री के साइड ड्रॉअर के रूप में देखावल जाला। या एकरा बदले ऊर्ध्वाधर अकॉर्डियन के इस्तेमाल करीं। या फिर प्रयोगकर्ता लोग के अलग पन्ना पर ले आवल जाय अगर रउआँ के बहुत बिस्तार से देखावे के जरूरत होखे। बाकिर अगर रउरा यूजर्स के दक्षता आ गति बढ़ावे के बा त हर हाल में मोडल से बची. इनहन के इस्तेमाल प्रयोगकर्ता लोग के धीमा करे खातिर, उनकर ध्यान बंडल करे खातिर, गलती रोके खातिर करीं। जइसन कि टेरेसा फेसेंडन नोट कइले बाड़ी कि केहू के टोकल पसंद ना होखे बाकिर अगर रउरा के टोकल जाए के पड़ी त सुनिश्चित करीं कि ई बिल्कुल एह लागत के लायक होखे. “स्मार्ट इंटरफेस डिजाइन पैटर्न” से मिलल जाव रउआँ स्मार्ट इंटरफेस डिजाइन पैटर्न में मोडल आ विकल्प के बारे में पूरा खंड पा सकत बानी, हमनी के 15h-वीडियो कोर्स जवना में वास्तविक जीवन के प्रोजेक्ट से 100s व्यावहारिक उदाहरण बा — एह साल के अंत में लाइव यूएक्स प्रशिक्षण के साथ। मेगा-ड्रॉपडाउन से ले के जटिल एंटरप्राइज टेबल तक सभ कुछ — हर साल 5 गो नया सेगमेंट जोड़ल जाला। एगो मुफ्त पूर्वावलोकन पर कूद जाईं. 15% छूट बचावे खातिर कोड BIRDIE के इस्तेमाल करीं। स्मार्ट इंटरफेस डिजाइन पैटर्न से मिलल जाव, इंटरफेस डिजाइन & यूएक्स पर हमनी के वीडियो कोर्स।
वीडियो + यूएक्स प्रशिक्षणकेवल वीडियो वीडियो + यूएक्स प्रशिक्षण$ 495.00 $ 699.00 बा
वीडियो + यूएक्स प्रशिक्षण25 वीडियो पाठ (15h) + लाइव यूएक्स प्रशिक्षण प्राप्त करीं।100 दिन के मनी-बैक-गारंटी।वीडियो केवल$ 300.00$ 395.00
वीडियो कोर्स40 वीडियो पाठ (15h) प्राप्त करीं। सालाना अपडेट होला।2 वीडियो कोर्स के साथ यूएक्स बंडल के रूप में भी उपलब्ध बा।
उपयोगी संसाधन के बारे में बतावल गइल बा
पॉपअप के अलग-अलग प्रकार, अन्ना केले के लिखल यूआई मोडल डिजाइन करे खातिर सर्वोत्तम प्रथा, Uxcel द्वारा हमनी के बहुत ढेर लानत मोडल के इस्तेमाल करेनी जा: यूएक्स गाइडलाइन, एड्रियन एगर के मोडल एंड नॉनमोडल डायलॉग, थेरेसा फेसेंडन के लिखल ह आधुनिक एंटरप्राइज यूआई डिजाइन: मोडल डायलॉग, जेम्स जैकबस द्वारा डिजाइन सिस्टम में मोडल के बारे में बतावल गइल बा
