नवीनतम एंड्रॉइड 9 और 10 अपडेट के लिए यूआई / यूएक्स कैसे डिज़ाइन करें

रंगों के प्रकार

सामग्री डिज़ाइन रंग पैलेट के लिए, Google एक 'दो रंग' प्रणाली पसंद करता है:

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

यह सामग्री डिजाइन संपादक एक बहुत ही उपयोगी उपकरण है जो आपको रंग विविधताओं को एक साथ रखने में मदद करता है। आप पेशेवर UI / UX डिज़ाइन एजेंसियों जैसे प्रेरणा से भी देख सकते हैं चिकनी मिट्टी , या की यह सूची टॉप रेटेड वेब डिज़ाइन कंपनियां 2019 में।

उत्तरदायी ग्रिड लेआउट

उत्तरदायी ग्रिड लेआउट को समझने का अर्थ है कि कैसे पिक्सल घनत्व और स्वचालित स्क्रीन रूपांतरण कार्य करता है। अधिकांश भाग के लिए, औसत Android फ़ोन DPI कहीं 300 से 480 DPI के बीच है।

इसे ध्यान में रखते हुए, एक 300 डीपीआई स्क्रीन आमतौर पर 4 कॉलम तक प्रदर्शित करने में सक्षम होगी:

जबकि 600 डीपीआई वाली स्क्रीन 8 कॉलम तक प्रदर्शित होगी।

प्रत्येक स्तंभ के बीच 'गटर' होते हैं, मूल रूप से प्रत्येक स्तंभ को अलग करने वाले क्षेत्र। तो 360dp वाले मोबाइल पर, प्रत्येक गटर लगभग 16dp का होगा।

स्क्रीन डीपीआई को समझना

यूआई को डिजाइन करते समय, चाहे वह सिस्टम यूआई हो या आपके ऐप का यूआई, आपको अलग-अलग फोन साइज के अलग-अलग पिक्सल डेंसिटी को ध्यान में रखना होगा। यहाँ सबसे आम स्क्रीन रिज़ॉल्यूशन और पिक्सेल घनत्व का एक चार्ट है:

इसलिए, 'वैश्विक' थीम या ऐप डिज़ाइन करते समय, अंगूठे के एक नियम के रूप में, और एक डिवाइस के लिए थीम बनाने पर ध्यान केंद्रित नहीं करना चाहिए, आपको सबसे कम घनत्व पर शुरू करना चाहिए। ऐसा इसलिए है क्योंकि यदि आप 1x पर अपना डिज़ाइन शुरू करते हैं, तो आपको बस पिक्सेल में माप लेना होगा, और मान डीपी में समान रहेंगे।

हालांकि, यदि आप 3.5x के लिए डिज़ाइन करते हैं, तो आपको अन्य घनत्वों के अनुकूल होने के लिए सभी मूल्यों को 3.5 से विभाजित करने की आवश्यकता है, और फिर यह सिर्फ कई डीपी मूल्यों की गणना का सिरदर्द बन जाता है।

एंड्रॉइड 10 यूआई / यूएक्स डिजाइन के लिए अतिरिक्त सुझाव

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

मटेरियल डिज़ाइन के साथ काम करते समय, Google में बहुत सारी अच्छाइयाँ शामिल हैं जिनका आप लाभ उठा सकते हैं, और वे आपके UI / UX के साथ स्वाभाविक रूप से अधिक प्रवाहित होंगे।

इसलिए, उदाहरण के लिए, अंतर्निहित सामग्री डिज़ाइन तत्वों के साथ थीमिंग घटकों के लिए कुछ कीवर्ड दिए गए हैं, और आपका ऐप या UI / UX अभी भी मूल सिस्टम व्यवहार और UI राज्यों का आनंद लेगा।

कस्टम रंग Android के साथ बटन: पृष्ठभूमि रंग = '@ रंग / लाल' ----- रेडियो रंग कस्टम रंग के साथ Android: बटन रंग = '@ रंग / लाल' ----- छवियाँ और प्रतीक Android: drawableTint = '@ रंग / लाल '----- प्रोग्रेसबार कस्टम रंग के साथ android: प्रगतिटाइन =' @ रंग / लाल '

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

एंड्रॉयड: ऊंचाई = '1DP'

आपको बेहतर नियंत्रण और प्रबंधनीय XML फ़ाइलों को देने के लिए टैग और मूल गुणों को विलय करना बेहद उपयोगी है।

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

एंड्रॉयड: animateLayoutChanges = 'सही'