Google ने पिछले सितंबर में ही नवीनतम Android 10 जारी किया था, और जबकि यह केवल कुछ मुट्ठी भर नवीनतम, सबसे प्रीमियम फ़ोनों पर उपलब्ध है, बहुत सारे फ़ोन निर्माताओं से अपेक्षा की जाती है कि वे निकट में अपने कुछ सबसे हाल के फ़ोनों पर Android 10 को रोल आउट करें। भविष्य।
इसी तरह पढ़ता है:ग्राफिक्स डिजाइन के लिए सर्वश्रेष्ठ कंप्यूटर
एंड्रॉइड 10 कुछ हद तक अपडेट और शानदार फीचर्स लेकर आया, जैसे कि सिस्टम-वाइड डार्क मोड, लेकिन किसी भी वास्तविक यूआई अपडेट के रास्ते में बहुत कम। Google सामग्री डिज़ाइन के साथ अटका हुआ है क्योंकि यह बहुत अच्छी तरह से काम करता है, इसलिए यह मार्गदर्शिका पिछले Android संस्करणों (Oreo, Pie, आदि) के लिए भी लागू होगी।
मटीरियल डिज़ाइन के लिए UI तत्वों को ठीक से डिज़ाइन करने का तरीका जानने से, Android डिवाइस पर अच्छा प्रदर्शन करने वाले ऐप्स विकसित करने से लेकर, सैमसंग थीम स्टोर जैसे थीम स्टोर में आपकी कस्टम थीम स्वीकार करने तक, बहुत सी चीज़ों में मदद मिलेगी।
आप इन अन्य विषयों को Appuals पर भी पढ़ सकते हैं, जिससे आपको इस विषय से संबंधित बहुत सी अतिरिक्त जानकारी मिलेगी:
- अपने Android ऐप में डार्क थीम कैसे शामिल करें
- विजुअल स्टूडियो 2017 में Android ऐप्स विकसित करना कैसे प्रारंभ करें
- एंड्रॉइड ओपन सोर्स प्रोजेक्ट से कस्टम रोम कैसे बनाएं | पं. 2
- मैन्युअल रूप से एंड्रॉइड सिस्टम यूआई को थीम कैसे करें (एंड्रॉइड 9 / एंड्रॉइड 10 के लिए कुछ चरण पुराने हो सकते हैं, लेकिन समग्र जानकारी अभी भी बहुत उपयोगी है।)
मटेरियल डिज़ाइन का एक सिंहावलोकन
मटीरियल डिज़ाइन कुछ महत्वपूर्ण चीज़ों के इर्द-गिर्द घूमता है। यदि आप थीम डिज़ाइन कर रहे हैं, तो रंग पैलेट, प्रतिक्रियाशील ग्रिड लेआउट, और Android सिस्टम UI के बारे में अपना तरीका जानना। ऐप्स विकसित करने के लिए, आपको उपरोक्त सभी के साथ-साथ एंड्रॉइड रनटाइम अनुमतियों और अनुरोधों जैसी चीजों के बारे में पता होना चाहिए, यदि आपका ऐप उपयोगकर्ता के स्टोरेज फ़ोल्डर्स, कैमरा इत्यादि तक पहुंच जाएगा।
आधिकारिक Android डेवलपर पर यह पृष्ठ गोपनीयता और अनुमति परिवर्तनों में बहुत गहराई तक जाता है, जिनके बारे में ऐप डेवलपर्स को Android 10 के बारे में पता होना चाहिए। लेकिन अधिकांश भाग के लिए, हम थीमिंग, पर ध्यान केंद्रित करने जा रहे हैं। इस लेख के लिए वास्तविक ऐप विकास नहीं।
रंग पैलेट
मटीरियल डिज़ाइन रंग पैलेट के लिए, Google विभिन्न प्रकार के "दो रंग" प्रणाली को प्राथमिकता देता है:
तो उदाहरण के लिए, जैसे इस फोटो में। आपका प्राथमिक रंग बैंगनी होगा, आपका द्वितीयक रंग सियान होगा। और फिर अपने UI के अन्य तत्वों के लिए, आप बैंगनी और सियान के शेड वेरिएंट का उपयोग करेंगे, ताकि सब कुछ एक साथ मिल जाए।
यह सामग्री डिज़ाइन संपादक एक बहुत ही उपयोगी उपकरण है जो आपको रंग विविधताओं को एक साथ रखने में मदद करता है। आप पेशेवर UI/UX डिज़ाइन एजेंसियों जैसे क्ले, या 2019 में शीर्ष-रेटेड वेब डिज़ाइन कंपनियों की इस सूची से प्रेरणा प्राप्त कर सकते हैं।
रिस्पॉन्सिव ग्रिड लेआउट
रिस्पॉन्सिव ग्रिड लेआउट को समझने का मतलब है कि यह समझना कि पिक्सेल घनत्व और स्वचालित स्क्रीन अनुकूलन कैसे काम करता है। अधिकांश भाग के लिए, औसत Android फ़ोन DPI कहीं 300 से 480 DPI के बीच है।
इसे ध्यान में रखते हुए, एक 300 DPI स्क्रीन आमतौर पर 4 कॉलम तक प्रदर्शित करने में सक्षम होगी:
जबकि 600 dpi वाली एक स्क्रीन 8 कॉलम तक प्रदर्शित करेगी।
प्रत्येक कॉलम के बीच "गटर" होते हैं, मूल रूप से वे क्षेत्र जो प्रत्येक कॉलम को अलग करते हैं। तो 360dp वाले मोबाइल पर, प्रत्येक गटर लगभग 16dp का होगा।
स्क्रीन DPI को समझना
UI डिज़ाइन करते समय, चाहे वह सिस्टम UI हो या आपके ऐप का UI, आपको विभिन्न फ़ोन आकारों की विभिन्न पिक्सेल घनत्वों को ध्यान में रखना होगा। यहां सबसे आम स्क्रीन रिज़ॉल्यूशन और पिक्सेल घनत्व का चार्ट दिया गया है:
तो एक नियम के रूप में, "वैश्विक" थीम या ऐप डिज़ाइन करते समय, और किसी एक डिवाइस के लिए थीम बनाने पर ध्यान केंद्रित नहीं करते हुए, आपको सबसे कम घनत्व से शुरू करना चाहिए। ऐसा इसलिए है क्योंकि यदि आप अपना डिज़ाइन 1x पर शुरू करते हैं, तो आपको केवल पिक्सेल में माप लेना होगा, और मान सभी DP में समान रहेंगे।
हालाँकि, यदि आप 3.5x के लिए डिज़ाइन करते हैं, तो आपको अन्य घनत्वों के अनुकूल होने के लिए सभी मानों को 3.5 से विभाजित करने की आवश्यकता होती है, और फिर यह कई DP मानों की गणना करने का सिरदर्द बन जाता है।
Android 10 UI/UX डिज़ाइन के लिए अतिरिक्त टिप्स
यदि आपको रेडियो, बटन, चेकबॉक्स आदि जैसे थीम घटकों के लिए एक कस्टम रंग की आवश्यकता है, तो आपको नहीं चाहिए विभिन्न राज्यों को दिखाने के लिए ड्रॉबल्स का उपयोग करें (चेक किया गया, क्लिक किया गया, आदि) . क्योंकि जब आप ड्रॉएबल का उपयोग करते हैं, तो आप मूल सामग्री डिज़ाइन प्रभाव खो देते हैं (जैसे लहर) जिसे Google ने Android 9 और Android 10 में व्यापक रूप से अपडेट किया है।
मटीरियल डिज़ाइन के साथ काम करते समय, Google में बहुत सी अच्छाइयाँ शामिल होती हैं जिनका आप लाभ उठा सकते हैं, और वे आपके UI/UX के साथ अधिक स्वाभाविक रूप से प्रवाहित होंगी।
इसलिए उदाहरण के लिए, यहां अंतर्निहित सामग्री डिज़ाइन तत्वों वाले थीम घटकों के लिए कुछ कीवर्ड दिए गए हैं, और आपका ऐप या UI/UX अभी भी मूल सिस्टम व्यवहार और UI स्थितियों का आनंद लेगा।
Button with custom colour android:backgroundTint="@color/red" ----- Radio Button with custom colour android:buttonTint="@color/red" ----- Images & Icons android:drawableTint="@color/red" ----- ProgressBar with custom colour android:progressTint="@color/red"
कार्डव्यू मोड जैसे घटकों के नीचे एक साधारण छाया दिखाने के लिए, आपको केवल उन्नयन संपत्ति का उपयोग करने की आवश्यकता है।
android:elevation="1dp"
आपको बेहतर नियंत्रण और प्रबंधनीय XML फ़ाइलें देने के लिए टैग और मूल गुणों को मर्ज करना अत्यंत उपयोगी है।
<LinearLayout> <include layout="@layout/light_expanded_card" /> <include layout="@layout/light_collapsed_card" /> <include layout="@layout/color_indicator_strip" /> </LinearLaout>
एनिमेटेड लेआउट परिवर्तन वास्तव में आपके UX में सुधार कर सकते हैं, और लगभग सभी ViewGroup इसका सम्मान करेंगे। इसलिए जब भी व्यू पदानुक्रम में कोई बदलाव होता है, तो यह एक एनीमेशन के साथ आएगा। थोड़ी सी जानकारी के साथ, आप कस्टम ट्रांज़िशन प्रभाव भी डिज़ाइन कर सकते हैं।
android:animateLayoutChanges="true"