डिजाइन पीआई: दूसरों की गलतियों से सीखना

लेखों के चक्र के बारे में संक्षेप में

इस लेख के साथ, मैं लेख "डिज़ाइन पीआई" की श्रृंखला शुरू करता हूं। वे उन लोगों के लिए उपयोगी होंगे जो परवाह करते हैं कि उनके आवेदन कैसे दिखते हैं, वे उपयोगकर्ता के संबंध में कैसे व्यवहार करते हैं - सोच डिजाइनर, प्रोग्रामर, डिजाइनर और जो इस दुनिया को थोड़ा बेहतर बनाना चाहते हैं :)

चक्र के लिए आगे

क्या आपने कभी सोचा है कि कुछ सॉफ्टवेयर उत्पाद अच्छे (यदि अधिक नहीं हैं) कार्यक्षमता और गुणवत्ता सफल नहीं होती है, जबकि अन्य, इसके विपरीत, तड़क रहे हैं? इस विरोधाभास का कारण अक्सर एक साधारण तथ्य है - सबसे अधिक बार ऐसा होता है क्योंकि पहला सॉफ़्टवेयर उत्पाद उपयोगकर्ता इंटरफ़ेस और प्रयोज्य के रूप में दूसरे से हार जाता है। सबसे महत्वपूर्ण उदाहरण Google Chrome ब्राउज़र और अन्य सभी ब्राउज़र हैं। उसके जन्म को इतना समय नहीं बीता है - यह सभी ब्राउज़रों का "सबसे छोटा" है - लेकिन यह उसे दृढ़ता से "ब्राउज़र परेड" की तीसरी पंक्ति को रखने से नहीं रोकता है और "सम्मानजनक" दूसरे स्थान से मोज़िला फाउंडेशन के दिमाग की उपज को धक्का दे रहा है। इस सफलता की व्याख्या करना बहुत आसान है - जिस क्षण से ब्राउज़र को रिलीज़ किया गया था, इसका उद्देश्य अधिकतम उपयोग में आसानी, न्यूनतम सेटिंग्स (हालांकि अब उनकी संख्या लगातार बढ़ रही है) और अधिकतम उपयोगकर्ता मित्रता है। और निश्चित रूप से, Google के इंजीनियरों ने लंबे समय तक ब्राउज़र बाजार का अध्ययन किया ताकि यह समझ सकें कि वास्तव में अन्य ब्राउज़रों के उपयोगकर्ताओं में प्रयोज्य और उपयोगकर्ता इंटरफ़ेस के संदर्भ में क्या कमी है - और ब्राउज़र "शॉट"। वह उपयोगकर्ताओं को आत्मविश्वास से लुभाता रहता है, संस्करण से संस्करण अधिक स्थिर, अधिक सुंदर और प्रयोग करने योग्य बन जाता है।

झूझू ने मजाक के साथ उत्तर दिया, "मैं तुम्हें एक विज्ञापन दिखाऊंगा!"

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







संख्या समस्या क्षेत्रों को दर्शाती है। आइए उनका विश्लेषण करें और उन्हें एक सूची में लिखें। तो, क्रम में:



1) एक नियंत्रण जो एक नेविगेशन श्रृंखला ( "ब्रेडक्रंब" ) की तरह व्यवहार करता है , संक्षेप में , एक नियंत्रण नहीं है, क्योंकि लगभग किसी भी मोड में यह श्रृंखला की शुरुआत में केवल एक लिंक जोड़ता है, जो हमेशा मुख्य पृष्ठ की ओर जाता है। इसके अलावा, नेविगेशन श्रृंखला के इस पतित मामले की उपस्थिति स्पष्ट नहीं है कि मुख्य मेनू नए रिकॉर्ड निर्माण मोड में उपलब्ध है ( "नया रिकॉर्ड" आइटम "जर्नल" मेनू में है ):





1 ') सूचना का दोहराव। इस डिजाइन तत्व का उपयोग करने का अर्थ आमतौर पर अस्पष्ट है।



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



3) वर्ग पहियों के साथ साइकिल। आज तक, वेब के लिए दिनांक चयनकर्ता और टाइम पिकर नियंत्रण के कार्यान्वयन का एक बेशुमार सेट है। वैसे, जब आप इस तत्व को बदलने के लिए लिंक पर क्लिक करते हैं तो इसका स्वरूप बदल जाता है:



और अगर उपयोगकर्ता को एक अलग तारीख चुनने की आवश्यकता होती है और उसी समय देखो कि सप्ताह के किस दिन यह गिरता है? सामान्य तौर पर - कोई टिप्पणी नहीं।



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



5) अंतर्निहित संपादक के लिए असंगत संकेत। संपादक का निर्माण कार्यक्षेत्र में असंगत इंडेंट के साथ किया जाता है जो धारणा की अखंडता का उल्लंघन करते हैं और उपस्थिति को खराब करते हैं। इसके अलावा, वे कारण हैं कि संदेश संपादक के टूलबार में पूर्ववत करें और फिर से करें निम्न पंक्ति पर "बाएं":



टूलबार के बाईं ओर विस्तारक भी प्रश्न उठाता है। वह क्यों है? एक कम से कम टूलबार ज्यादा जगह नहीं बचाएगा और यह तत्व केवल दृश्य शोर का परिचय देता है।



6) अतिरिक्त सूचना ब्लॉक का सिर्फ एक घृणित लेआउट। कोई टिप्पणी नहीं - मुझे लगता है कि यह स्पष्ट है।



7) बटन जो इस पैनल के संदर्भ से बाहर हैं। इन बटन को सेंड बटन के साथ समूहित करना तर्कसंगत होगा, क्योंकि वे रिकॉर्ड (पोस्ट) पर कार्रवाई के समूह में शामिल हैं।



8) जानकारी का दोहराव, अतिरेक, तत्व का नुकसान। पैनल के संदर्भ से इस प्रविष्टि तक पहुंच । इस रिकॉर्ड के लिए अभिगम नियंत्रण में लेबल में अनावश्यक जानकारी होती है - और इसलिए यह स्पष्ट है कि हम वर्तमान में केवल एक ( यह ) रिकॉर्ड संपादित कर रहे हैं। इस जानकारी को डुप्लिकेट करने की आवश्यकता नहीं है ( हो सकता है कि यह अनुवाद कठिनाई हो? )।

अपनी आस्तीन ऊपर रोल ...

क्या यह फॉर्म तय किया जा सकता है? बेशक, आप कर सकते हैं - आखिरकार, जो एक टूट गया वह दूसरे को ठीक कर सकता है। इसलिए, हम LJ लोगों को इस दुनिया को थोड़ा बेहतर बनाने में मदद करेंगे। यहाँ एक नया रिकॉर्ड बनाने के लिए फार्म की तरह लग सकता है:

इस समाधान के लाभ:

1) निश्चित तारीख / समय चयन नियंत्रण। यह एक अधिक सुविधाजनक और परिचित उपयोगकर्ता नियंत्रण द्वारा प्रतिस्थापित किया जाता है।

2) असाधारण तारीख नियंत्रण न केवल तारीख संपादन मोड में उपलब्ध हो गया है। उपयोगकर्ताओं से नियंत्रण छुपाना बहुत बुरा है। उन्हें हमेशा दिखाई देना चाहिए लेकिन उपलब्ध नहीं हो सकता है । इसके अलावा, यह किसी भी तरह से उपयोगकर्ता को समझाने के लिए वांछनीय है कि उसके पास लॉक नियंत्रण तक पहुंच क्यों नहीं है।

3) कंट्रोल मूड , अब आप कहां हैं , संगीत को अधिक तार्किक रूप से समूहित किया जाता है - शीर्षक के बाद, पोस्ट के अन्य मुख्य मापदंडों के बगल में।

4) एक अनावश्यक वस्तु के शीर्षक से हटाया गया, क्योंकि यह उपयोगकर्ता संदर्भ को बदलने का खतरा पैदा करता है।

5) अधिक सुविधाजनक लेबल संपादन संपादक। यह ध्यान दिया जाना चाहिए कि मैंने कुछ भी आविष्कार नहीं किया - मैंने इस संपादक को दूसरे रूप से लिया - संपादन लेबल का रूप ।

6) रिकॉर्डिंग नियंत्रण वर्तनी , पूर्वावलोकन और भेजें को एक पैनल में वर्गीकृत किया गया है, जो मूल संस्करण की तुलना में अधिक तार्किक दिखता है। चेक वर्तनी कार्रवाई को एक लिंक के रूप में डिज़ाइन किया गया है, ताकि कार्यों की दृश्य श्रृंखला पर बोझ न पड़े, और यह भी क्योंकि यह एक सहायक और वैकल्पिक कार्रवाई है, जिसका वजन अन्य दो कार्यों की तुलना में बहुत कम है।

7) अंतर्निहित संपादक इस तथ्य के कारण अधिक आकर्षक लगता है कि सभी उपकरण एक पैनल पर फिट होते हैं और विस्तारक को हटा दिया जाता है, जो केवल दृश्य शोर के स्रोत के रूप में कार्य करता है।

8) आकार ऊंचाई में थोड़ा छोटा हो गया है और इसके कारण अब यह 1280x1024 के रिज़ॉल्यूशन के साथ मॉनिटर स्क्रीन पर पूरी तरह से फिट बैठता है। यदि वांछित है, तो इसे कम किया जा सकता है ताकि यह पूरी तरह से मॉनिटर पर 1440x900 के रिज़ॉल्यूशन के साथ फिट हो जाए - संपादक की ऊंचाई और पैनल जिसमें टैग संपादक स्थित है, को कम करके।

9) यूजर इंटरफेस थोड़ा सुधरा है।

इस समाधान के नुकसान:

1) संगीत नियंत्रण का विवादास्पद संरेखण। यह बहुत स्वागत योग्य है अगर कोई और अधिक सुंदर समाधान की पेशकश कर सकता है। मैंने यह केवल इसलिए किया क्योंकि मैंने शीर्षक में voids से बचने की कोशिश की थी। मेरा मानना ​​है कि यह हेडिंग केवल ऐसा मामला है जब नियम "खाली जगहों से डरो मत" काम नहीं करता है

2) सूचना के प्रवाह के घनत्व को कम करने में विफल - रूप अभी भी एक गड़बड़ की तरह दिखता है। यह अब थोड़ा व्यवस्थित रूप से दलिया जैसा दिखता है :)

अंतभाषण

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