डायलॉग आइकॉन

डायलॉग आइकॉन, पॉप-अप डायलॉग बॉक्स में दिखाए जाते हैं. ये बॉक्स, उपयोगकर्ता को इंटरैक्ट करने के लिए कहते हैं. इन्हें गहरे रंग के बैकग्राउंड पर हाइलाइट करने के लिए, हल्के रंग के ग्रेडिएंट और इनर शैडो का इस्तेमाल किया जाता है.

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

पहली टेबल. डायलॉग के खत्म होने की स्थिति में, तीन सामान्य स्क्रीन डेंसिटी के लिए आइकॉन डाइमेंशन की खास जानकारी.

ldpi (120 dpi)
(Low density screen)
mdpi (160 dpi)
(मीडियम डेंसिटी वाली स्क्रीन)
hdpi (240 dpi)
(High density screen)
xhdpi (320 dpi)
(Extra-high density screen)
डायलॉग आइकॉन का साइज़ 24 x 24 पिक्सल 32 x 32 पिक्सल 48 x 48 पिक्सल 64 x 64 पिक्सल

फ़ाइनल आर्ट को पारदर्शी PNG फ़ाइल के तौर पर एक्सपोर्ट किया जाना चाहिए. बैकग्राउंड का रंग शामिल न करें.

Adobe Photoshop में आइकॉन बनाने के लिए टेंप्लेट, आइकॉन टेंप्लेट पैक में उपलब्ध हैं.

Android के सभी वर्शन

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

संरचना

  • डायलॉग आइकॉन में 1 पिक्सल का सेफ़फ़्रेम होता है. बेस शेप, सेफ़फ़्रेम के अंदर फ़िट होना चाहिए. हालांकि, गोल शेप का एंटी-एलियास, सेफ़फ़्रेम से ओवरलैप हो सकता है.
  • इस पेज पर दिए गए सभी डाइमेंशन, Adobe Photoshop में 32x32 पिक्सल के आर्टबोर्ड साइज़ पर आधारित हैं. Photoshop टेंप्लेट में बाउंडिंग बॉक्स के चारों ओर एक पिक्सल की पैडिंग रखें.
डायलॉग आइकॉन के स्ट्रक्चर का व्यू.

पहली इमेज. डायलॉग आइकॉन के लिए सेफ़फ़्रेम और फ़िल ग्रेडिएंट. आइकॉन का साइज़ 32x32 है.

रोशनी, इफ़ेक्ट, और शैडो

डायलॉग आइकॉन फ़्लैट हैं और सामने से दिखाए गए हैं. इन्हें डार्क बैकग्राउंड से अलग दिखाने के लिए, हल्के ग्रेडिएंट और इनर शैडो का इस्तेमाल किया गया है.

डायलॉग आइकॉन के लिए लाइट, इफ़ेक्ट, और शैडो का व्यू.

दूसरी इमेज. डायलॉग आइकॉन के लिए लाइट, इफ़ेक्ट, और शैडो.

1.सामने का हिस्सा:ग्रेडिएंट ओवरले | ऐंगल 90°
नीचे: r 223 | g 223 | b 223
ऊपर: r 249 | g 249 | b 249
नीचे के रंग की जगह: 0%
ऊपर के रंग की जगह: 75%
2.इनर शैडो:black | 25% opacity |
angle -90° | distance 1px | size 0px

चरण-दर-चरण

  1. Adobe Illustrator जैसे टूल का इस्तेमाल करके, बुनियादी आकार बनाएं.
  2. शेप को Adobe Photoshop जैसे टूल में इंपोर्ट करें और पारदर्शी बैकग्राउंड पर 32x32 पिक्सल की इमेज के हिसाब से उसका साइज़ बदलें.
  3. सही फ़िल्टर के लिए, इमेज 2 में दिख रहे इफ़ेक्ट जोड़ें.
  4. आइकॉन को 32x32 साइज़ में, पारदर्शिता की सुविधा चालू करके PNG फ़ाइल के तौर पर एक्सपोर्ट करें.