बटन

बटन, उपयोगकर्ता की कार्रवाइयों के लिए मुख्य विज़ुअल इंडिकेटर होते हैं.

सिद्धांत

कार्रवाई के लिए तैयार: बटन से साफ़ तौर पर पता चलना चाहिए कि वे किसी कार्रवाई को ट्रिगर करते हैं.

साफ़ तौर पर दिखने वाला फ़ीडबैक: बटन की बनावट, इंटरैक्शन की अलग-अलग स्थितियों (होवर, दबाना, फ़ोकस) में अलग-अलग दिखनी चाहिए, ताकि तुरंत फ़ीडबैक मिल सके.

एक जैसे: सभी बटन एक जैसे दिखने चाहिए, ताकि उन्हें तुरंत पहचाना जा सके.

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

इस्तेमाल और प्लेसमेंट

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

check_circle

यह करें

कम काम की कार्रवाइयों को दिखाने के लिए, प्रोग्रेसिव डिसक्लोज़र का इस्तेमाल करें.

cancel

यह न करें

बहुत सारे बटन दिखाकर, उपयोगकर्ता को परेशान करना.

check_circle

यह करें

कार्रवाई करने के लिए, बटन का इस्तेमाल करें. इसके अलावा, किसी स्टैटिक एलिमेंट के लिए टाइटल चिप का इस्तेमाल करें.

cancel

यह न करें

बटन का इस्तेमाल स्टैटिक डेकोरेटिव एलिमेंट के तौर पर किया जाता है.

शरीर-रचना विज्ञान

पसंद के मुताबिक बनाएं

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