बेहतर यूजर एंगेजमेंट के लिए डिज़ाइन किए गए इंटरफेसेस को डिज़ाइन करना

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

यह किया गया की तुलना में बहुत आसान है, लेकिन अगर आप कुछ बुनियादी बातों को सीखते हैं तो आपको क्राफ्टिंग करने में कोई समस्या नहीं होगी महान सामग्री के साथ यूआई केंद्रित अपनी परियोजनाओं के लिए.

इस पोस्ट में, मैं आपको दिखाता हूँ कि कैसे बढ़ाएँ उपयोगकर्ता सहभागिता और सामग्री सहभागिता वेब-आधारित इंटरफेस पर। ये एक आगंतुक को संलग्न करने के दो सबसे सामान्य तरीके हैं, और यदि आप कर सकते हैं अनुभव का अनुकूलन करें पेज मेट्रिक पर उस आकर्षक समय को बढ़ाने में आपको कोई समस्या नहीं होगी.

नवीनता पर कब्जा

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

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

एक सामान्य उदाहरण अधिकांश लैंडिंग पृष्ठों पर कॉल टू एक्शन बटन है। आप के साथ नवीनता का निर्माण भी कर सकते हैं पृष्ठभूमि तस्वीरें, चित्र, या एप्लिकेशन स्क्रीनशॉट, जैसे कि उबेर फॉर बिजनेस लैंडिंग पृष्ठ.

इस पृष्ठ में कॉल टू एक्शन बटन है लेकिन मेरा ध्यान तुरंत है स्क्रीनशॉट पर जाता है. जब वे पहली बार लोड होते हैं तो यह चेतन होता है गति के साथ डिजाइन की नवीनता ध्यान आकर्षित करना.

एक विकल्प का उपयोग करके GiftRocket होगा लिंक के रूप में सचित्र प्रतीक साइट में और आगे जाने के लिए.

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

डिजाइन है पहली बात आगंतुक देखते हैं, और आपको उनका ध्यान आकर्षित करने की आवश्यकता है कुछ ही क्षणों में आगे सगाई को प्रोत्साहित करने के लिए.

स्केलेबल टाइपोग्राफी

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

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

1. सामग्री विभाजित करें स्पष्ट उपशीर्षक के साथ
2. पैराग्राफ तोड़ो उन्हें छोटा करने के लिए
3. बुलेटेड सूचियों का उपयोग करें अपने अंक जल्दी साझा करने के लिए

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

इस लेखन शैली के उदाहरण के लिए क्विक स्प्राउट ब्लॉग देखें। सामग्री नील पटेल द्वारा लिखी गई है और वह अक्सर बहुत लंबी सामग्री लिखते हैं, लेकिन वह पैराग्राफ को तोड़ता है प्रत्येक वाक्य में 1-3.

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

टेक्स्ट को डिज़ाइन करें ताकि यह वास्तव में हो पढ़ने में मज़ा आता है. बोरिंग कॉपी लुभाएगी नहीं, लेकिन न तो मजा आएगा कि कॉपी बहुत छोटी है या कंट्रास्ट की कमी है.

आंख पकड़ने वाली छवियां

Backlinko द्वारा हाल ही में किए गए एक केस स्टडी से पता चलता है कि पेज कम से कम एक छवि के साथ आम तौर पर उच्च रैंक बिना छवियों वाले पृष्ठों की तुलना में। यह एक एसईओ दृष्टिकोण से महान है.

लेकिन क्या उपयोगकर्ता सगाई के बारे में? यदि आप उस एक छवि को रख सकते हैं मुड़ाव के ऊपर या शीर्ष के करीब इससे पहले कि वे उछलें, यह आगंतुकों का ध्यान आकर्षित करेगा। याद रखें कि उपन्यास पृष्ठ तत्व आकर्षित करते हैं.

जब आपके पास पूरे पृष्ठ में एक छवि (या कई छवियां) होती हैं, जो आपके पास होती हैं एकरसता को तोड़ो उबाऊ पाठ ब्लॉक के। उपयोगकर्ता कर सकते हैं पढ़ने से थोड़ा विश्राम करें छवि की सराहना करने के लिए, या छवि और लिखित सामग्री के बीच संबंध बनाएं। लेकिन अधिकांश डिजाइन तकनीकों के साथ, गुणवत्ता मात्रा की तुलना में अधिक मूल्यवान है.

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

TechCrunch उनके लेखों में विशेष रुप से छवियों के साथ ऐसा करता है जहां आप अक्सर पाएंगे तह के ऊपर चित्रित फोटो.

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

कंट्रास्टिंग पेज एलिमेंट्स

यदि आपको एक पृष्ठ पर एक विशेष क्षेत्र पर ध्यान देने की आवश्यकता है विषमता तुम्हारा सबसे अच्छा दोस्त है. विरोध एक डिजाइन के विशिष्ट क्षेत्रों या सामग्री के कुछ ब्लॉकों के बीच एक कठिन कील चलाता है.

आगंतुक स्वाभाविक रूप से कंट्रास्ट के विपरीत क्योंकि यह अलग है। रंग, आकार, या व्हाट्सएप के बड़े रस-विन्यास आंख को आकर्षित करते हैं क्योंकि यह सब कुछ के सांचे को तोड़ता है लेआउट में.

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

खरीद बटन एक पूर्ण पृष्ठभूमि रंग का उपयोग करता है बहुत उज्जवल हैडर में अन्य रंगों की तुलना में। नि: शुल्क परीक्षण बटन की तुलना में बटन पाठ भी उज्जवल है। यह आगंतुकों को अभी खरीदें बटन की ओर ले जाता है पूरी तरह से दृश्य उत्तेजनाओं से.

आप नोटिस करेंगे इसी तरह की तकनीक ऑप्टिन मॉन्स्टर के मुख पृष्ठ पर। इस शीर्ष लेख में केवल एक बटन है, जिस पर OptinMonster Now अंकित है। यह नीले रंग की पृष्ठभूमि पर एक चमकदार हरे रंग का बटन है, जो दृष्टि में कोई अन्य हरे रंग के तत्वों के साथ नहीं है.

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

एक ब्लॉग के लिए, आपके पास उपयोगकर्ता सहभागिता के लिए अलग-अलग योग्यताएँ हो सकती हैं। एक आम पसंद एक है न्यूज़लेटर साइनअप फॉर्म इस तरह के Aeolidia पर उदाहरण के रूप में.

यदि आप उस सामग्री के नीचे स्क्रॉल करते हैं जिसे आप नोटिस करेंगे फैंसी-शेमेंसी साइनअप बॉक्स सिर्फ न्यूजलेटर फॉर्म के लिए बनाया गया है। यह शेष पृष्ठ से बाहर है एक अद्वितीय पृष्ठभूमि रंग, मजेदार टाइपोग्राफी और एक प्यारा राजा ट्राइटन आइकन.

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

उपयोगकर्ता सहभागिता को प्रोत्साहित करें

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

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

जब यह आता है गतिशील इंटरफेस, साइट का उद्देश्य आमतौर पर उपयोगकर्ता जुड़ाव को प्रोत्साहित करना है। सबसे बड़ी बाधा है उपयोगकर्ताओं को पढ़ाना साइट कैसे काम करती है, और इंटरफ़ेस के साथ ठीक से कैसे जुड़ना है.

उपयोगकर्ता सगाई की तकनीकों के बारे में बात करते हुए KissMetrics द्वारा इस पोस्ट को देखें। मुझे मिली सबसे अच्छी रणनीतियों में से एक है निर्देशित यात्रा डिजाइन करें जो आगंतुकों के माध्यम से जाता है प्राथमिक सुविधाओं में से प्रत्येक.

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

“सुझावों का पालन करें” साइनअप के दौरान बॉक्स नए उपयोगकर्ताओं की मदद करता है ट्विटर कैसे काम करता है, उससे परिचित हों. यह सुविधा नए उपयोगकर्ताओं के लिए पूर्वसूचक करती है उलझाने लगते हैं मंच के साथ, और सुविधाओं के साथ प्रयोग करें जैसे कि, ट्वीट और निजी संदेश.

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

इन सभी तकनीकों को समझने से, आपके पास एक आसान समय निर्माण इंटरफेस होगा उपयोगकर्ताओं की समस्याओं को हल करें, तथा नए उपयोगकर्ताओं को जुड़ने के लिए प्रोत्साहित करें. यदि आप अधिक की तलाश कर रहे हैं UX डिजाइन सगाई युक्तियाँ इन संबंधित पोस्ट की जाँच करें:

• सगाई बढ़ाने के लिए एक उपयोगकर्ता ऑनबोर्डिंग रणनीति (Thinkapps.com)
• ग्रैजुएशन एंगेजमेंट में एक पाठ (Uxbooth.com)
• यह मत मानिए कि नए उपयोगकर्ता आपके उत्पाद का उपयोग करना सीखना चाहते हैं (Uxdesign.cc)