रास्टर बनाम वेक्टर: इमेज ट्रेसिंग क्या कर सकती है, क्या नहीं

रास्टर (या बिटमैप) इमेज — PNG, JPG, GIF, WebP, BMP, फोटो, स्क्रीनशॉट — पिक्सल का आयत है, हर पिक्सल एक रंग। 1000 × 1000 का लोगो दस लाख संख्याएं हैं। फाइल में न गोले होते हैं न अक्षर, सिर्फ बिंदु जो उस साइज़ पर गोले और अक्षर जैसे दिखते हैं। बड़ा करें तो बिंदु बड़े हो जाते हैं; रेंडरर उनके बीच धुंधलापन ला सकता है, पर उसे नहीं पता कि किनारा असल में कहां होना था।

वेक्टर इमेज — SVG, EPS, PDF, AI — खुद आकार रखती है: "(100, 100) पर 40 त्रिज्या का गोला, नीले से भरा", या आम तौर पर सीधी रेखाओं और बेज़ियर कर्व का एक पाथ। इसमें रेज़ोल्यूशन होता ही नहीं। वेक्टर लोगो 16 पिक्सल के फेविकॉन और 10 मीटर के बैनर पर एक जैसा रेंडर होता है, और जो लोगो PNG में 200 KB का होता है वह SVG में अक्सर 5 KB का।

दो खास फॉर्मेट की तुलना करनी है? PNG vs SVG गाइड में फाइल साइज़, ब्राउज़र सपोर्ट और कब कौन सा चुनें, यह बताया है।

जो ट्रेसर इमेज को पहले सादे रंगों में घटाकर शुरू करता है, वह हर नरम ट्रांज़िशन पहले ही खो चुका होता है। आसमान, गोले पर हाइलाइट, गुब्बारे की पट्टी की शेडिंग — हर एक दो, चार या आठ सादी पट्टियों की सीढ़ी बन जाती है जिनके बीच तीखे किनारे होते हैं, और जितने ज़्यादा रंग की इजाज़त दें, उतनी ज़्यादा पट्टियां और उतनी बड़ी फाइल।

AnyToSVG रंग समेटने से पहले एक अतिरिक्त पास चलाता है। जो पिक्सल अपने चारों पड़ोसियों से थोड़े ही अलग हैं उन्हें स्मूद इलाकों में समूहित किया जाता है (एंटी-एलियास्ड किनारे दीवार का काम करते हैं, इसलिए इलाका बगल के आकार में नहीं घुसता)। फिर हर बड़े इलाके पर कलर मॉडल बैठाया जाता है: लीनियर (बदलाव की दिशा और उस पर रंग-स्टॉप) या रेडियल (एक केंद्र और दूरी के हिसाब से स्टॉप)। मॉडल पिक्सल को अच्छी तरह समझाए, तो पूरा इलाका एक ही आकार के रूप में ट्रेस होता है और असली <linearGradient> या <radialGradient> से भरा जाता है। कर्व के साथ मुड़ने वाली शेडिंग — जिसे कोई एक-आयामी ग्रेडिएंट नहीं पकड़ सकता — कुछ टुकड़ों में बांटी जाती है, हर टुकड़े का अपना ग्रेडिएंट, उन जोड़ों पर जहां पड़ोसी मॉडल आपस में मेल खाते हैं।

जो अब भी पट्टियां बनती है: जटिल आकार का पीछा करती शेडिंग, कई ओवरलैप होती नरम परछाइयां, या फोटो जैसा टेक्सचर। ये इलाके मॉडल की परीक्षा में फेल होकर सादे रंगों पर लौट आते हैं, जहां रंगों की संख्या वाला स्लाइडर काम संभालता है।

ट्रेस करें जब बिटमैप ऐसे डिज़ाइन की वफादार रेंडरिंग हो जो शुरू से सादा था — आप वह वेक्टर वापस पा रहे हैं जो कभी था। दस सेकंड, हो गया।

ट्रेस करें, फिर संवारें जब सोर्स थोड़ा खुरदरा हो: वेबसाइट का 300 px का लोगो, स्कैन किया सिग्नेचर, फोटो खींचा हुआ स्केच। ट्रेस 90 % दे देती है और वेक्टर एडिटर बाकी — कोई बेकार आकार हटाना, लाइन सीधी करना, कोना जमाना।

दोबारा बनाएं जब बिटमैप चीज़ की फोटो हो, खुद चीज़ नहीं: दुकान के बोर्ड पर लगा लोगो, लैंप के नीचे रखा बिज़नेस कार्ड, कढ़ाई वाला पैच। वहां पिक्सल में परिप्रेक्ष्य, रोशनी और टेक्सचर होता है जिसे कोई ट्रेसर दोहराए नहीं, और ट्रेस को आपकी अपनी ड्रॉइंग के नीचे टेम्पलेट की तरह इस्तेमाल करना सबसे अच्छा है।

तीनों हालात में प्रीव्यू कुछ भी डाउनलोड करने से पहले बता देता है कि आप किसमें हैं — और प्रीव्यू होने का मकसद यही है।