बैज डिज़ाइनर

बैज डिज़ाइनर badges.ninja में अंतर्निर्मित एक विज़ुअल कैनवास एडिटर है जो आपको बिना किसी डिज़ाइन टूल के पेशेवर बैज छवियाँ बनाने देता है।

अवलोकन

जब आप बैज बनाते या संपादित करते समय image फ़ील्ड पर क्लिक करते हैं तो डिज़ाइनर खुलता है। यह एक कैनवास वर्कस्पेस प्रदान करता है जहाँ आप अपनी बैज छवि बनाने के लिए टेम्पलेट्स, टेक्स्ट और कस्टम पृष्ठभूमियों को मिला सकते हैं।

एक टेम्पलेट का चयन

डिज़ाइनर में दो आयामों में व्यवस्थित 80+ अंतर्निर्मित टेम्पलेट्स शामिल हैं ताकि आप जल्दी से एक खोज सकें:

• 8 आकार — Circle, Rounded square, Hexagon, Shield, Octagon, Diamond, Banner, Seal
• 8 रंग पैलेट — Gold, Silver, Bronze, Blue, Green, Crimson, Purple, Graphite

एक चुनने के लिए:

1. डिज़ाइनर टूलबार में Templates पर क्लिक करें।
2. सूची को संकुचित करने के लिए पिकर के शीर्ष पर Shape और Color फ़िल्टर का उपयोग करें। दाहिनी ओर काउंटर दिखाता है कि कितने टेम्पलेट मेल खाते हैं (जैसे 8 / 84)।
3. इसे कैनवास पर लागू करने के लिए एक टेम्पलेट पर क्लिक करें।

उत्पन्न टेम्पलेट्स जानबूझकर साफ़ हैं — एक आकार और पैलेट चुनें, फिर डिज़ाइनर में अपना स्वयं का टेक्स्ट, आइकन और रिबन जोड़ें।

आकार, रिबन और आइकन जोड़ना

टेम्पलेट्स के अलावा, डिज़ाइनर तीन अतिरिक्त एसेट लाइब्रेरियों के साथ आता है जिन्हें आप किसी भी टेम्पलेट के ऊपर लेयर कर सकते हैं:

• आकार — 80+ वेक्टर आकार (वृत्त, शील्ड, षट्भुज, तारे, मेडल, सील, माला, बैनर, ज्यामितीय रूप) श्रेणियों में समूहीकृत
• रिबन — 20 सजावटी रिबन ओवरले
• आइकन — 50 चित्रात्मक आइकन (atom, award, brain, briefcase, certificate, code, crown, diamond, diploma, graduation-cap, lightbulb, medal, rocket, shield-check, star, target, trophy, …)

किसी भी पॉपओवर से एक चुनें और यह वर्तमान रंग में कैनवास पर डाला जाता है। प्रत्येक पॉपओवर के अंदर Color bar आपको एसेट डालने से पहले उसे पुनः रंगने देता है — उपयोगी जब आप टूलबार डिफ़ॉल्ट से भिन्न रंग चाहते हैं।

एक कस्टम पृष्ठभूमि या छवि अपलोड करना

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

1. डिज़ाइनर टूलबार में Upload पर क्लिक करें।
2. अपने कंप्यूटर से एक छवि फ़ाइल चुनें (PNG या JPG अनुशंसित)।
3. छवि को कैनवास पर एक चयन योग्य ऑब्जेक्ट के रूप में रखा जाता है — इसे खींचें, स्केल करें, घुमाएँ, या अन्य तत्वों के पीछे भेजें।

एक छवि अपलोड करने से टेम्पलेट या कोई मौजूदा परत नहीं मिटती — यह बस ऊपर स्टैक होती है।

पूर्ण पृष्ठभूमि के लिए, कम से कम 600×600 पिक्सेल की वर्ग छवि का उपयोग करें।

टेक्स्ट जोड़ना

1. टूलबार में Text बटन पर क्लिक करें।
2. कैनवास पर एक नया टेक्स्ट तत्व दिखाई देता है।
3. टेक्स्ट को चुनने के लिए उस पर क्लिक करें, फिर अपनी सामग्री टाइप करें।
4. कैनवास पर स्थान देने के लिए टेक्स्ट तत्व को खींचें।

आप अपने बैज के विभिन्न हिस्सों (शीर्षक, प्राप्तकर्ता, तिथि, आदि) के लिए कई टेक्स्ट तत्व जोड़ सकते हैं।

फ़ॉन्ट बदलना

डिज़ाइनर में 11 फ़ॉन्ट शामिल हैं (Arial, Georgia, Times New Roman, Pacifico, Roboto, Open Sans, Montserrat, Lato, Raleway, Oswald, Playfair Display):

1. कैनवास पर एक टेक्स्ट तत्व चुनें।
2. टूलबार में Font ड्रॉपडाउन पर क्लिक करें।
3. उपलब्ध फ़ॉन्ट्स में से चुनें।

फ़ॉन्ट पूर्वावलोकन दिखाता है कि चयन करने से पहले प्रत्येक विकल्प कैसा दिखता है।

रंग बदलना

टूलबार Color पिकर एक साथ दो चीज़ें नियंत्रित करता है:

• चयनित टेक्स्ट — किसी चयनित टेक्स्ट तत्व के लिए भरण रंग चुनता है।
• डिफ़ॉल्ट इन्सर्ट रंग — आगे डाले गए आकार, रिबन और आइकन के लिए, साथ ही चयनित SVG ऑब्जेक्ट्स के लिए (स्थान पर स्ट्रोक्स और भरावों को पुनः रंगता है)।

पैलेट से एक रंग चुनें या एक हेक्स कोड दर्ज करें। प्रत्येक आकार/रिबन/आइकन पॉपओवर के अंदर एकल रंग विकल्पों के लिए एक छोटा Color bar भी है जो टूलबार डिफ़ॉल्ट को नहीं बदलता।

तत्वों को संरेखित करना

6-बटन संरेखण पंक्ति कैनवास के सापेक्ष चयनित ऑब्जेक्ट(s) पर काम करती है:

बटन	क्रिया
Align left	कैनवास के बाएँ किनारे पर पिन करें
Center horizontally	कैनवास के X अक्ष पर केंद्रित करें
Align right	कैनवास के दाएँ किनारे पर पिन करें
Align top	कैनवास के शीर्ष किनारे पर पिन करें
Center vertically	कैनवास के Y अक्ष पर केंद्रित करें
Align bottom	कैनवास के निचले किनारे पर पिन करें

जब आप किसी तत्व को कैनवास केंद्र के पास खींचते हैं, तो धराशायी बैंगनी स्नैप गाइड दिखाई देते हैं और ऑब्जेक्ट पूर्ण संरेखण में स्नैप हो जाता है।

बहु-चयन और लेयरिंग

• कई ऑब्जेक्ट चुनने के लिए Shift दबाकर क्लिक करें, या कैनवास पर एक चयन बॉक्स खींचें।
• z-क्रम नियंत्रित करने के लिए Send to back / Bring to front का उपयोग करें।
• चयन हटाने के लिए Delete दबाएँ या टूलबार Delete बटन पर क्लिक करें।
• Undo / Redo (या Ctrl+Z / Ctrl+Shift+Z) पिछले 20 परिवर्तनों में से गुज़रते हैं।

तत्व हटाना

1. वह तत्व चुनें जिसे आप हटाना चाहते हैं (या कई के लिए shift-क्लिक)।
2. टूलबार में Delete बटन पर क्लिक करें, या Delete कुंजी दबाएँ।

अच्छे बैज डिज़ाइन के लिए युक्तियाँ

• इसे सरल रखें — स्पष्ट टेक्स्ट का उपयोग करें और अव्यवस्था से बचें। बैज अक्सर छोटे आकार में प्रदर्शित होगा।
• उच्च कंट्रास्ट का उपयोग करें — सुनिश्चित करें कि टेक्स्ट पृष्ठभूमि के विरुद्ध पठनीय हो।
• बैज का नाम शामिल करें — प्राप्तकर्ताओं और दर्शकों को एक नज़र में क्रेडेंशियल समझ में आना चाहिए।
• वर्ग प्रारूप — बैज वर्गाकार छवियों के रूप में सबसे अच्छे दिखते हैं।
• ब्रांड संगति — अपने सभी बैज में अपने संगठन के रंग और फ़ॉन्ट का उपयोग करें।
• छोटे आकारों पर परीक्षण करें — पठनीयता सुनिश्चित करने के लिए अपने बैज का 100x100 पिक्सेल पर पूर्वावलोकन करें।

बैज छवि सहेजना

जब आप अपने डिज़ाइन से संतुष्ट हों, तो डिज़ाइनर में Done या Save पर क्लिक करें। छवि कैनवास से कैप्चर की जाती है और आपके बैज से जोड़ी जाती है। जब आप बैज बनाते या सहेजते हैं तो इसे IPFS पर अपलोड किया जाएगा।