उपयोगकर्ता अनुभव खेल और वेबसाइट और आवेदन की गति

इस लेख में मैं विभिन्न डिज़ाइन दृष्टिकोणों के बारे में बात करूंगा जो इस धारणा को बनाने में मदद करेंगे कि साइट (या एप्लिकेशन) तेज है।

नोट। लेख एडा तोप के साथ एक बातचीत से प्रेरित है, जो सैमसंग इंटरनेट परियोजना में डेवलपर्स के हितों और हमारे Google क्रोम डेवलपर्स यूट्यूब वीडियो "डिजाइनर और डेवलपर" की श्रृंखला में रक्षा करता है। आप इसे डाउनलोड करके या iTunes प्लेटफ़ॉर्म या Google Play संगीत पर हमारे पॉडकास्ट की सदस्यता लेकर वार्तालाप की पूरी रिकॉर्डिंग सुन सकते हैं।

कभी आपने सोचा है कि जब आप समर्थन में कहीं बुलाते हैं, तो क्या आप प्रतीक्षा करते समय संगीत शामिल करते हैं? और आप अपनी भावनाओं की कल्पना करते हैं, अगर संगीत के बजाय मृत चुप्पी होगी। CNN ने एक सर्वेक्षण किया, जिसमें दिखाया गया कि यदि किसी ग्राहक की कॉल को होल्ड पर रखा जाता है, तो 70 प्रतिशत मामलों में कॉलर 60 सेकंड की मौन स्थिति में लटका रहेगा: वह सोच सकता है कि कॉल समाप्त हो गई है, और प्रतीक्षा अब और लंबी लगती है। इसलिए, "संगीत" का अर्थ अपेक्षा के साथ कुछ भरना और ग्राहक का समय लेना है।

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

Alconost में अनुवादित

समय की धारणा

किसी व्यक्ति को समय कैसे लगता है, यह चिंता के स्तर पर निर्भर करता है कि व्यक्ति घर पर है या नहीं। Google में किए गए एक अध्ययन में, यह पता चला: यदि उपयोगकर्ता घर पर थे, तो उनमें से 75 प्रतिशत ने सोचा कि साइट जल्दी से काम कर रही है, लेकिन घर के बाहर, यह आंकड़ा घटकर 52% हो गया। युवा उपयोगकर्ताओं के लिए, साइट लोडिंग पुराने लोगों की तुलना में धीमी लगती है। सामान्य तौर पर, लोड होने पर हमें जो देरी होती है, वह वास्तविकता से 80 मिलीसेकंड अधिक लंबी होती है। और अगर आप सिर्फ इंतजार करने के लिए मजबूर हैं, तो ऐसा लगता है कि समय भी धीमा चल रहा है।

वेबसाइटों और एप्लिकेशन धीरे-धीरे लोड होंगे और भले ही वे अनुकूलित हों, और 30 प्रतिशत उपयोगकर्ता अभी भी सोचेंगे कि वे वास्तव में हैं की तुलना में धीमी हैं। इसके बारे में क्या करना है? जाहिर है: कुछ चीजों के साथ उपयोगकर्ता को कब्जा करने के लिए।

लदान

आप एक रिक्त स्क्रीन नहीं दिखा सकते हैं, आप किसी व्यक्ति को एप्लिकेशन से किसी भी प्रतिक्रिया के बिना प्रतीक्षा करने के लिए मजबूर नहीं कर सकते - लेकिन डाउनलोड संकेतक में कमियां भी हैं।

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

स्क्रीन भरें

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

चरण-दर-चरण लोड हो रहा है

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



लोडिंग समय को छिपाने के लिए, आप चरण-दर-चरण एनिमेशन भी बना सकते हैं - उदाहरण के लिए, हम इसे नीचे "भौतिक" डिज़ाइन उदाहरणों में कैसे करते हैं।




"सामग्री" डिजाइन के उदाहरणों में चरण-दर-चरण एनीमेशन

चरण-दर-चरण लोडिंग अच्छी तरह से काम करती है, क्योंकि यह वास्तव में सामग्री में जाने से पहले उपयोगकर्ता हित का कारण बनता है - अच्छी तरह से, और निश्चित रूप से प्रतीक्षा से विचलित होता है।




चरण-दर-चरण एनीमेशन महत्वपूर्ण संक्रमण को सुचारू करता है

नेविगेशन

Facebook , RedBooth , Spotify और Google Plus ने अध्ययन किया जिसमें पाया गया कि यदि आप मेनू आइटम नहीं दिखाते हैं, तो उपयोगकर्ता उन्हें खोज और उनका उपयोग नहीं करेगा। इसके अलावा, फेसबुक ने सीखा कि लोअर नेविगेशन बार के साथ एप्लिकेशन तेज़ हो रहा है । क्योंकि, सबसे पहले, दृष्टि से बाहर - मन से बाहर, और दूसरी बात - जितनी तेजी से आप सही आइटम पा सकते हैं, उतना ही बेहतर होगा। इसलिए, मुख्य नेविगेशन बटन को उसी स्थान पर दृष्टि में रखें। "सामग्री" उल्लू डिजाइन में आवेदन के साथ उदाहरण से, आप देख सकते हैं कि यह दृष्टिकोण मूल डिजाइन में हस्तक्षेप नहीं करता है। इसके अलावा, मोबाइल उपकरणों पर, नीचे से नेविगेशन अधिक सुविधाजनक है: उपयोगकर्ता एक हाथ से वांछित अनुभाग पर जा सकता है, और एप्लिकेशन के साथ काम करना तेज और अधिक प्राकृतिक लगता है।

प्रतिक्रिया और संचार

उपयोगकर्ता को यह बताना बहुत महत्वपूर्ण है कि आगे क्या होगा, लेकिन आपको उपयोगकर्ता द्वारा किए गए कार्यों पर प्रतिक्रिया देने की आवश्यकता है - इसलिए यह उसे प्रतीत होगा कि आवेदन (या साइट) तेज है। उपयोगकर्ता को सूचित करने के लिए कि वांछित कार्रवाई की जा रही है, आप गति, मार्गदर्शन और लहर एनिमेशन का उपयोग कर सकते हैं।



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

अनुवादक के बारे में

लेख का अनुवाद अल्कोनोस्ट ने किया था।

Alconost 70 भाषाओं में खेल , एप्लिकेशन और साइटों को स्थानीय करता है। मूल भाषा के अनुवादक, भाषाई परीक्षण, एपीआई के साथ क्लाउड प्लेटफ़ॉर्म, निरंतर स्थानीयकरण, परियोजना प्रबंधक 24/7, स्ट्रिंग संसाधनों का कोई भी प्रारूप।

हम विज्ञापन और प्रशिक्षण वीडियो भी बनाते हैं - Google Play और ऐप स्टोर के लिए बिक्री, छवि, विज्ञापन, प्रशिक्षण, टीज़र, खोजकर्ता, ट्रेलरों के लिए।

अधिक जानकारी