कंटेंट पर जाएँ
charmotion
शुरू करें

लोगो को एनिमेटेड GIF में कैसे बदलें

Charmotion टीम द्वारा · अपडेट:

गाइड का कवर इलस्ट्रेशन: लोगो को एनिमेटेड GIF में कैसे बदलें, Charmotion डेमो कैरेक्टर के साथ

लोगो को एनिमेटेड GIF में बदलने के लिए पहले लोगो को एनिमेट करें, एक छोटा MP4 एक्सपोर्ट करें, फिर क्लिप से बने 256 रंगों के पैलेट के साथ उसे GIF में कन्वर्ट करें। PNG को .gif के रूप में सेव करने से सिर्फ़ एक स्थिर इमेज मिलती है। लूप को कुछ सेकंड तक रखें और उसी साइज़ पर एक्सपोर्ट करें जिस पर वह दिखेगा।

मुख्य बातें

  • GIF सिर्फ़ एक कंटेनर है: मोशन पहले बनाना होता है, किसी टेम्पलेट टूल, एनिमेशन ऐप या सर्विस में।
  • GIF में अधिकतम 256 रंग होते हैं और ट्रांसपेरेंसी सिर्फ़ पूरी तरह चालू या पूरी तरह बंद होती है, इसलिए ग्रेडिएंट में बैंडिंग आती है और मुलायम किनारे खुरदुरे दिखते हैं।
  • GIF का साइज़ उस जगह के हिसाब से रखें जहाँ वह चलेगा: ईमेल सिग्नेचर, Slack और Discord इमोजी, Discord स्टिकर और Product Hunt, सबकी सीमाएँ अलग हैं।
  • वेबसाइट पर, म्यूट किया हुआ लूपिंग वीडियो उसी एनिमेशन के GIF की तुलना में फ़ाइल साइज़ में कहीं छोटा होता है।

पहले से कोई कैरेक्टर या लोगो है? अपने कैरेक्टर को असली ऐप स्क्रीन में देखें: स्प्लैश, ऑनबोर्डिंग, लोडिंग और एम्प्टी स्टेट स्क्रीन। यह फ़्री है, आपके ब्राउज़र में चलता है और कुछ भी अपलोड नहीं होता।

क्या PNG लोगो को एनिमेटेड GIF में बदला जा सकता है?

हाँ, लेकिन फ़ाइल कन्वर्ट करना आखिरी स्टेप है, पहला नहीं। PNG में एक ही फ़्रेम होता है। उसका नाम बदलने या उसे PNG to GIF कन्वर्टर से चलाने पर आपको उसी एक फ़्रेम वाला GIF मिलता है, जिसमें कोई मोशन नहीं होता।

वह वर्कफ़्लो जिससे सच में चलता हुआ लोगो बनता है:

  1. लोगो को एनिमेट करें। किसी टेम्पलेट टूल में प्रीसेट लगाएँ, मोशन ऐप में कीफ़्रेम करें, या किसी से रिग और एनिमेट करवाएँ।
  2. वीडियो एक्सपोर्ट करें। सॉलिड बैकग्राउंड पर छोटा MP4 सबसे आसान सोर्स है।
  3. पैलेट के साथ GIF में कन्वर्ट करें। क्लिप से 256 रंगों का पैलेट बनाएँ और हर फ़्रेम को उससे मैप करें, अंतिम डिस्प्ले साइज़ पर।

वीडियो से शुरू करने पर आपको बेहतर फ़ॉर्मेट भी मुफ़्त में मिल जाते हैं: वही MP4 सोशल मीडिया और स्लाइड में काम करता है, और GIF सिर्फ़ उन्हीं जगहों के लिए बनता है जहाँ उसकी सच में ज़रूरत है।

GIF में मेरा लोगो खराब क्यों दिखता है?

क्योंकि GIF की दो सख्त सीमाएँ हैं जिनसे लोगो टकराते हैं। MDN की इमेज फ़ॉर्मेट गाइड के अनुसार GIF पैलेट में अधिकतम 256 एंट्री होती हैं, और पिक्सेल अपारदर्शी होते हैं, जब तक उनका रंग वह न हो जिसे ट्रांसपेरेंट मार्क किया गया है, उस स्थिति में वे "पूरी तरह ट्रांसपेरेंट" होते हैं। आंशिक ट्रांसपेरेंसी नहीं होती।

लोगो की खासियतGIF में क्या होता हैक्या मदद करता है
ग्रेडिएंट और 3D शेडिंगबैंडिंग: स्मूद टोन दिखने वाली सीढ़ियों में बदल जाते हैंक्लिप से बना पैलेट; हल्की डिथरिंग; लोगो का ज़्यादा फ़्लैट वर्ज़न
मुलायम शैडो और ग्लोगायब हो जाते हैं, या सख्त किनारों वाले धब्बे बन जाते हैंशैडो को सॉलिड बैकग्राउंड पर रखें
ट्रांसपेरेंसी पर anti-aliased किनारेखुरदुरे किनारे या हल्का या गहरा हेलोऐसा सॉलिड बैकग्राउंड जो GIF की जगह से मेल खाए
छोटा टेक्स्टछोटा करने पर धुँधला हो जाता हैअंतिम साइज़ पर रेंडर करें; टेक्स्ट बड़ा रखें

फ़्लैट, सॉलिड रंग वाले लोगो लगभग पूरी तरह सही कन्वर्ट होते हैं। ग्रेडिएंट, ग्लास, मेटल या AI से बनी लाइटिंग वाले लोगो सबसे ज़्यादा खोते हैं, इसीलिए जहाँ भी इजाज़त हो वहाँ वीडियो फ़ॉर्मेट आमतौर पर बेहतर रहता है।

ईमेल, Slack और Discord के लिए लोगो GIF का साइज़ कितना हो?

हर जगह के अपने नियम हैं। ये वे प्रकाशित सीमाएँ हैं जिनकी हम पुष्टि कर पाए:

कहाँफ़ॉर्मेट और साइज़सोर्स
ईमेल सिग्नेचरकोई स्टैंडर्ड नहीं। सिग्नेचर वेंडर Xink लगभग 10 से 15 फ़्रेम के साथ करीब 200 KB से कम का सुझाव देता हैXink
Slack कस्टम इमोजीJPG, PNG या GIF; 128 KB से कम की स्क्वेयर इमेज "सबसे अच्छी काम करती हैं"; GIF में अधिकतम 50 फ़्रेमSlack Help Center
Discord इमोजी256 KB से कम; JPEG, PNG, GIF या WebPDiscord Support
Discord स्टिकरPNG, APNG, GIF या Lottie; 320×320; अधिकतम 5 सेकंड; 512 KiBDiscord API docs
Discord सर्वर आइकनएनिमेटेड GIF के लिए Boost Level 1 ज़रूरी; सर्वर आइकन गाइड देखेंDiscord Support
Product Hunt थंबनेलस्क्वेयर, 240×240 सुझाया गया; GIF 3 MB से कम; hover करने पर एनिमेट होता हैProduct Hunt Help Center

दो नियम हर जगह लागू होते हैं। GIF को उसी साइज़ में एक्सपोर्ट करें जिसमें वह असल में दिखेगा (या शार्प स्क्रीन के लिए उसका दोगुना, अगर फ़ाइल लिमिट इजाज़त दे), और लूप छोटा रखें। फ़ाइल साइज़ फ़्रेम की संख्या पर निर्भर करता है, इसलिए लोगो के लिए आमतौर पर 12 से 15 फ़्रेम प्रति सेकंड काफ़ी होते हैं।

प्लेटफ़ॉर्म की जानकारी: एनिमेटेड ईमेल सिग्नेचर, Slack कस्टम इमोजी, Discord इमोजी और स्टिकर, Discord एनिमेटेड सर्वर आइकन और Product Hunt।

क्या लोगो GIF का बैकग्राउंड ट्रांसपेरेंट हो सकता है?

हाँ, लेकिन सिर्फ़ on-या-off ट्रांसपेरेंसी के साथ: हर पिक्सेल या तो पूरी तरह पारदर्शी होता है या पूरी तरह ठोस। लोगो के चारों ओर की नरम, anti-aliased किनारी को इन दोनों में से किसी एक पर ले जाना पड़ता है, इसलिए किनारा या तो खुरदरा दिखता है या उस रंग की एक पतली झालर रह जाती है जिसके ऊपर उसे flatten किया गया था।

यही झालर वह "halo" है जो लोगों को तब दिखती है जब सफ़ेद पेज के लिए बनाया गया ट्रांसपेरेंट GIF किसी डार्क पेज पर लगाया जाता है। इससे बचने के दो तरीके:

  • ठोस बैकग्राउंड इस्तेमाल करें जो उस जगह से मेल खाए जहाँ GIF दिखेगा, जैसे ज़्यादातर ईमेल सिग्नेचर के लिए सफ़ेद। इससे सबसे साफ़ नतीजा मिलता है।
  • हर बैकग्राउंड के लिए एक अलग ट्रांसपेरेंट GIF बनाएँ, जिसे ट्रांसपेरेंट सोर्स वीडियो से convert किया गया हो ताकि किनारे सही रंग के साथ matte हों।

अगर जहाँ लगाना है वह जगह कोई बेहतर फ़ॉर्मेट स्वीकार करती है, तो वही इस्तेमाल करें। एनिमेटेड WebP और APNG स्मूद ट्रांसपेरेंसी बनाए रखते हैं, और वेबसाइट पर एक ट्रांसपेरेंट WebM के साथ HEVC-alpha MOV हर बड़े ब्राउज़र को कवर कर लेता है (देखें वेबसाइट पर ट्रांसपेरेंट वीडियो)।

लोगो वीडियो को बिना बैंडिंग के GIF में कैसे कन्वर्ट करें?

दो-पास पैलेट इस्तेमाल करें। FFmpeg का palettegen फ़िल्टर आपकी क्लिप के लिए सबसे अच्छे 256 रंग तैयार करता है, और paletteuse हर फ़्रेम को उन्हीं रंगों पर मैप करता है। एक-स्टेप कन्वर्ज़न एक सामान्य पैलेट इस्तेमाल करता है और उसमें बैंडिंग कहीं ज़्यादा होती है।

ffmpeg -i logo.mp4 \
  -vf "fps=15,scale=480:-1:flags=lanczos,split[a][b];[a]palettegen[p];[b][p]paletteuse" \
  -loop 0 logo.gif
  • fps=15 फ़्रेम की संख्या कम रखता है।
  • scale=480:-1 चौड़ाई तय करता है; वही चौड़ाई रखें जिसमें GIF दिखेगा।
  • -loop 0 हमेशा लूप करता है। जो लोगो एक बार चलकर रुक जाए, उसके लिए -loop -1 इस्तेमाल करें।

अगर फ़ाइल बहुत बड़ी है, तो frame rate कम करें, क्लिप छोटी करें, साइज़ घटाएँ या palettegen=max_colors=128 जोड़ें। ऑनलाइन कन्वर्टर भी काम करते हैं; ऐसा चुनें जिसमें साइज़ और frame rate सेट कर सकें। साइज़ बजट के साथ एक पूरा उदाहरण Product Hunt GIF गाइड में है।

एनिमेटेड लोगो के लिए GIF इस्तेमाल करें या वीडियो?

GIF सिर्फ़ वहीं इस्तेमाल करें जहाँ वीडियो नहीं चल सकता: मुख्य रूप से ईमेल, चैट इमोजी और कुछ पुराने टूल्स। बाकी हर जगह वीडियो छोटा होता है और बेहतर दिखता है।

कहाँबेस्ट फ़ॉर्मेट
ईमेल सिग्नेचर या न्यूज़लेटरGIF
Slack और Discord इमोजीGIF (Discord WebP भी लेता है)
वेबसाइट हेडर या हीरोम्यूट लूपिंग MP4, या ट्रांसपेरेंट WebM के साथ HEVC MOV
सोशल पोस्टMP4
वीडियो एडिटMP4 या ट्रांसपेरेंट MOV
स्लाइड्सGIF सबसे सुरक्षित है; देखें प्रेज़ेंटेशन गाइड

साइज़ का फ़र्क बहुत बड़ा है। web.dev के उदाहरण में 3.7 MB का GIF 551 KB का MP4 और 341 KB का WebM बन गया। वेब पेज पर लोगो वीडियो या Rive फ़ाइल होना चाहिए, GIF नहीं (ज़्यादा जानकारी GIF vs WebM vs MP4 vs Rive में)।

क्या मैं खुद एनिमेट किए बिना लोगो GIF पा सकता हूँ?

हाँ। टेम्पलेट टूल्स आपकी फ़ाइल पर एक preset लगाते हैं, फ़्रीलांसर ब्रीफ़ के हिसाब से उसे एनिमेट करते हैं, और कुछ सर्विस आपकी इमेज से मोशन जनरेट करती हैं।

अगर आपका लोगो कोई मार्क, एम्ब्लम या 3D या ग्रेडिएंट इमेज है, तो Charmotion एक विकल्प है। एक PNG, JPEG या WebP अपलोड करें और यह आपके मूल पिक्सेल को दोबारा बनाए बिना एनिमेट करता है: 17 एनिमेशन, जिनमें आपके रुके हुए लोगो पर खत्म होने वाला एक लॉन्च इंट्रो शामिल है। हर सेट में 480 px GIF प्रीव्यू और 1080×1080 MP4 शामिल हैं। दोनों सॉलिड बैकग्राउंड पर आते हैं; Charmotion ट्रांसपेरेंट GIF नहीं देता, और ट्रांसपेरेंट फ़ाइलें पेड प्लान के WebM और MOV हैं। सेट में वर्डमार्क पूरा एक साथ हिलता है; लोगो एनिमेशन अक्षरों को एक-एक करके ला सकता है।

PNG लोगो को एनिमेटेड GIF में कैसे बदलें

  1. सबसे अच्छी फ़ाइल से शुरू करें. आपके पास लोगो की जो सबसे बड़ी PNG या SVG फ़ाइल है, उसे साफ़ बैकग्राउंड के साथ इस्तेमाल करें।
  2. लोगो एनिमेट करें. किसी टेम्पलेट टूल में preset लगाएँ, किसी मोशन ऐप में keyframe करें, या कोई सर्विस इस्तेमाल करें, और लूप कुछ सेकंड का रखें।
  3. वीडियो एक्सपोर्ट करें. ठोस बैकग्राउंड पर एक छोटा MP4 export करें जो उस जगह से मेल खाए जहाँ GIF दिखाया जाएगा।
  4. palette के साथ कन्वर्ट करें. क्लिप से बने palette का इस्तेमाल करते हुए, display साइज़ और 12 से 15 fps पर GIF में convert करें।
  5. सीमाएँ जाँचें. पक्का करें कि फ़ाइल साइज़ और डाइमेंशन उस ईमेल क्लाइंट, चैट ऐप या साइट की लिमिट के अंदर हैं जहाँ आप अपलोड कर रहे हैं।

अक्सर पूछे जाने वाले सवाल

मेरा लोगो GIF धुँधला या banded क्यों है?

GIF में ज़्यादा से ज़्यादा 256 रंग हो सकते हैं, इसलिए ग्रेडिएंट और शेडिंग साफ़ दिखने वाली सीढ़ियों में बदल जाते हैं, और convert करने के बाद resize करने से किनारे धुँधले हो जाते हैं। palette क्लिप से ही बनाएँ, फ़ाइनल display साइज़ पर render करें, और नरम shadow वाले लोगो के लिए ठोस बैकग्राउंड इस्तेमाल करें।

क्या मैं MP4 लोगो एनिमेशन को फ़्री में GIF में convert कर सकता हूँ?

हाँ। FFmpeg फ़्री है और अपने palettegen और paletteuse फ़िल्टर के साथ सबसे अच्छा कंट्रोल देता है। कई फ़्री ऑनलाइन converter भी काम करते हैं; ऐसा चुनें जिसमें चौड़ाई और frame rate सेट कर सकें ताकि फ़ाइल छोटी रहे।

क्या मेरा लोगो GIF हमेशा लूप होना चाहिए?

चैट इमोजी और Product Hunt thumbnail में, हाँ। ईमेल सिग्नेचर या डॉक्यूमेंट में, एक बार चलकर पूरे लोगो पर रुकने वाला GIF ज़्यादा शांत लगता है, और Windows पर Microsoft 365 वाला Outlook वैसे भी तीन लूप के बाद रुक जाता है।

इस गाइड से झटपट जवाब

स्रोत

संबंधित गाइड