इंटरफ़ेस एनीमेशन

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

स्क्रॉल एनीमेशन

हाइपरलिंक्स ने इंटरनेट में क्रांति ला दी है, लेकिन वे सिर्फ इसकी मुख्य समस्या बने हुए हैं। आपको कभी भी यह पता नहीं है कि वह आपको कहां ले जाएगी। यहां तक ​​कि साइट के पाद लेख के लिए हाइपरलिंक प्रारंभिक विचार से विचलित कर सकता है।



इन दो उदाहरणों की तुलना करें।



उपयोगकर्ता के लिए अचानक बदलाव मुश्किल है।

गतिशील स्विच

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



ऐसा स्विच काफी सुविधाजनक है, इसके अलावा, प्लस साइन सामग्री के रूप में उसी दिशा में घूमता है, जो सिस्टम के सही संचालन का एक अतिरिक्त संकेतक है।

ढहते टिप्पणियाँ

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



आप आगे जा सकते हैं: टिप्पणी क्षेत्र में विस्तार के बाद कर्सर का ध्यान केंद्रित करें।



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

ताज़ा करने के लिए खींचो

लॉरेन ब्रिचटर द्वारा विकसित लोकप्रिय "पुल टू रिफ्रेश" आईफोन ऐप
उपयोगकर्ता को कालानुक्रमिक क्रम में सामग्री को अपडेट करने की अनुमति देता है। आप इसे ट्विटर के उदाहरण पर देख सकते हैं।

स्टिकर

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



विधि उन स्थितियों के लिए महान है जहां बहुत सारी जानकारी है, लेकिन एक जटिल में इस पर विचार करना आवश्यक है।

नियंत्रण आमंत्रित करना

नीचे दिए गए उदाहरण पर एक नज़र डालें:



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

नियंत्रण छुपाना

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

ध्यान केन्द्रित करें

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

निष्कर्ष

उपरोक्त उदाहरण उपयोगकर्ता अनुभव को बेहतर बनाने के लिए हम क्या कर सकते हैं इसका एक छोटा सा हिस्सा हैं। लेकिन ये प्रतीत होता है नगण्य विवरण उपयोगकर्ता के अनुभव को एक नए, बेहतर स्तर पर ले जाने में सक्षम हैं।