ब्लॉग / इंजीनियरिंग

ट्रांसपेरेंट PNG AI अपस्केलर तोड़ देते हैं: डार्क हैलो बग

· बग अध्ययन, सुधार मापा हुआ · विषय: प्रोडक्शन ×4 पाइपलाइन

पारदर्शिता वाला PNG (कट-आउट फोटो, स्टिकर एक्सपोर्ट) लगभग किसी भी AI अपस्केलर को दें और एक खास दोष उभरता है: हर पारदर्शी किनारे से विषय के अंदर कुछ पिक्सेल तक रेंगता एक डार्क हैलो, जिसके पीछे एक हल्का चमकीला ओवरशूट रिंग होता है। यह गहरे प्रीव्यू पर छिप जाता है और सफेद पेजों पर चुभता है। हमने इसे अपनी ही पाइपलाइन पर दोहराया, इसका सटीक आकार मापा (−94 ल्यूमा की खाई, तीन मॉडल-पिक्सेल चौड़ी), इसकी जड़ वेब प्लेटफॉर्म के प्रीमल्टीप्लाइड-अल्फ़ा राउंड-ट्रिप में खोजी, और वह सुधार मापा जो हम शिप करते हैं: एक O(n) फ्लड फिल जो मॉडल के चलने से पहले ही 98% त्रुटि हटा देता है।

−93.9ल्यूमा त्रुटि, पहला पिक्सेल रिंगसीधा-सादा पाथ बनाम साफ रेफरेंस
≈3 pxमॉडल स्केल पर खाई की चौड़ाईफिर +17 का ओवरशूट रिंग
63×सुधार से त्रुटि में कमी−62.9 → 1.1 औसत, 0–3 px पट्टी
O(n)सुधार की लागतएक BFS पास, कोई अतिरिक्त इन्फरेंस नहीं

इस नोट का हर आँकड़ा प्रोडक्शन पाइपलाइन के कोड पर मापा गया: वही मॉडल, वही गणित। प्रति इमेज कच्चे रिकॉर्ड: e3_alpha.json.

1 · काला कहाँ से आता है

वेब का 2D कैनवास पिक्सेल प्रीमल्टीप्लाइड रखता है: (r, g, b, α) नहीं बल्कि (rα, gα, bα, α)। कम्पोज़िटिंग को यह फॉर्मैट बहुत पसंद है (Porter–Duff ऑपरेटर[1] एक-एक मल्टीप्लाई-ऐड बन जाते हैं), लेकिन यह ठीक एक जगह लॉसी है। पिक्सेल वापस पढ़ने का मतलब है रंग को α से भाग देना:

r = ⌊ rα / α ⌉, undefined at α = 0(1)

α = 0 पर वह 0/0 है, और प्लेटफॉर्म का जवाब[2] यह है कि वापस पाने को कुछ बचा ही नहीं: रंग कैनवास को छूते ही शून्य से गुणा हो गया था। getImageData हर पूरी तरह पारदर्शी पिक्सेल के नीचे RGB (0, 0, 0) लौटाता है। आपके कट-आउट का पारदर्शी क्षेत्र चुपचाप शुद्ध काले की झील बन चुका है।

इंसान को झील कभी नहीं दिखती: अल्फ़ा उसे छिपा लेता है। सुपर-रिज़ॉल्यूशन नेटवर्क इंसान नहीं है: वह RGB के तीन चैनल खाता है और कोई अल्फ़ा नहीं, इसलिए उसे वैंटाब्लैक में धँसी एक तस्वीर दिखती है, और सीमा के पास का हर आउटपुट पिक्सेल एक ऐसे रिसेप्टिव फील्ड से निकलता है जो झील में डुबकी लगाता है। काला अपनी जगह नहीं रहता; वह कन्वोल्यूशन स्टैक[3] से होकर अंदर की ओर फैलता है।

2 · हैलो को मापना

सीधा-सादा (कैनवास RGB=0)अल्फ़ा ब्लीड (हमारा)
-100-75-50-2502513581216विषय के अंदर L1 दूरी (px, मॉडल स्केल)रेफरेंस के मुकाबले Δ ल्यूमापरफेक्ट
चित्र 1. हैलो, प्रोफाइल किया हुआ। सीधा-सादा पाथ (बैंगनी): विषय के अंदर पहले पिक्सेल रिंग में −94 ल्यूमा की खाई, 2 px पर −90, 3 px पर −54, फिर 5 px पर +17 का ओवरशूट रिंग जो ~13 px तक शून्य हो जाता है; सीमित रिसेप्टिव फील्ड से गहरा संदूषण, जिसे GAN ने किनारे में तीखा कर दिया। प्रोडक्शन पाथ (हरा): कभी 1.5 ल्यूमा लेवल से बुरा नहीं। दूरियाँ मॉडल स्केल पर; आउटपुट पिक्सेल के लिए ×4।
तीन पैनल: चेकरबोर्ड पर दिखाया कट-आउट इनपुट, अंडाकार के चारों ओर गहरे किनारे वाला सीधा-सादा अपस्केल, और साफ अल्फ़ा-ब्लीड किया अपस्केल
चित्र 2. पारदर्शिता वाला इनपुट (बाएँ), सीधा-सादा पाथ (बीच), प्रोडक्शन पाथ (दाएँ), हल्की ज़मीन पर कम्पोज़िट किए हुए। बीच के पैनल का किनारा थंबनेल साइज़ पर एक हल्के “गंदे किनारे” जैसा पढ़ा जाता है, और ठीक इसीलिए यह बग इतनी बार शिप हो जाता है: यह तब तक छिपा रहता है जब तक कोई यूज़र स्टिकर को हल्के बैकग्राउंड पर नहीं रखता।

एक सचमुच सहज बुद्धि के उलट माप: हमें उम्मीद थी कि मॉडल पारदर्शी क्षेत्र के अंदर कचरा गढ़ेगा, “खालीपन को एन्हांस करेगा।” वह ऐसा नहीं करता। सपाट काला अंदर, सपाट काला बाहर (ग्रेडिएंट एनर्जी 0.1)। नुकसान वह नहीं है जो मॉडल खालीपन में गढ़ता है; नुकसान वह है जो खालीपन सीमा के पार विषय के साथ करता है। यह इसलिए मायने रखता है क्योंकि इसका मतलब है कि आउटपुट को मास्क करना आपको बचा नहीं सकता: खराब पिक्सेल दिखते क्षेत्र के अंदर हैं, α > 0 के नीचे।

3 · सुधार: खालीपन को विश्वसनीय रंग से भर दें

अगर मॉडल को α = 0 के नीचे RGB देखना ही है, तो उसे ऐसा RGB बनाएँ जो विषय को आगे बढ़ाए। इन्फरेंस से पहले हम अल्फ़ा ब्लीडिंग चलाते हैं: हर गैर-पारदर्शी पिक्सेल से एक मल्टी-सोर्स ब्रेड्थ-फर्स्ट फ्लड, जहाँ हर पारदर्शी पिक्सेल अपने पहले से रंगे 4-पड़ोसियों का औसत रंग ले लेता है:

c(p) = mean{ c(q) : q ∈ N₄(p), q colored },  p in BFS order(2)

कतार को सीमा वाले रिंग से सीड करना और FIFO क्रम में प्रोसेस करना गारंटी देता है कि हर निकाले गए पिक्सेल का कम से कम एक रंगा हुआ पड़ोसी है (जिसने उसे कतार में डाला, वह पहले पूरा हुआ), इसलिए एक O(n) पास पूरा खालीपन रंग देता है: असीमित दूरी, बंद छेद समेत। अल्फ़ा बाइट कभी छुए नहीं जाते; अर्ध-पारदर्शी पिक्सेल अपना रंग खुद रखते हैं। मॉडल को फिर खाई के बजाय एक चिकना सिलसिला दिखता है, और अल्फ़ा (अलग से अपस्केल किया हुआ) निकलते समय फिर से लगा दिया जाता है। मापा गया असर: 0–3 px पट्टी की त्रुटि -62.9 से गिरकर 1.1 ल्यूमा लेवल, 63× की कमी, बिना किसी मापने लायक रनटाइम लागत के।

सीधे-सादे और ब्लीड किए रीकंस्ट्रक्शन के किनारे की डिटेल, साथ में एक बढ़ाया हुआ अंतर हीट मैप जो अल्फ़ा सीमा से चिपके हैलो को दिखाता है
चित्र 3. किनारे की डिटेल: सीधा-सादा पाथ (बाएँ) ब्लीड किए पाथ (बीच) के बगल में, और दाएँ दोनों रीकंस्ट्रक्शन के बीच का |अंतर|, ×8 बढ़ाया हुआ। हैलो अल्फ़ा सीमा का पीछा करता है और किसी और चीज़ का नहीं; किनारे से दूर आउटपुट एक जैसे हैं, यानी सुधार ठीक वैसे काम कर रहा है जैसा डिज़ाइन किया गया।

4 · आपकी इमेज के लिए इसका क्या मतलब है

अगर आप यह साइट इस्तेमाल करते हैं: कुछ नहीं; पारदर्शी PNG क्लाउड पाइपलाइन और ब्राउज़र के अंदर वाले फ़ॉलबैक इंजन, दोनों में ऊपर मापा गया पाथ लेते हैं, क्योंकि दोनों वही शुद्ध लाइब्रेरी साझा करते हैं। अगर आप इमेज टूल बनाते हैं: हर सिर्फ-RGB मॉडल को प्रीमल्टीप्लाइड शून्यों से एलर्जिक मानें: इन्फरेंस से पहले ब्लीड करें (ऊपर का फ्लड ~30 डिपेंडेंसी-मुक्त लाइनें है), या किसी ठोस रंग पर मैट करें और मैट का झुकाव स्वीकार करें। और अगर आप किसी के एन्हांसर आउटपुट में रहस्यमय गहरे किनारे की जाँच कर रहे हैं, तो अब आप फिंगरप्रिंट जानते हैं: कुछ पिक्सेल चौड़ी खाई, उसके पीछे एक ओवरशूट रिंग, और अल्फ़ा सीमा से परफेक्ट सहसंबंध। याद रखने के तीन आँकड़े: −94, 3 px, 63×।

संदर्भ

  1. Porter, T., & Duff, T. (1984). Compositing Digital Images. SIGGRAPH '84, Computer Graphics 18(3), 253–259. (The premultiplied-alpha compositing algebra.) dl.acm.org
  2. WHATWG HTML Living Standard, the 2D canvas element: premultiplied backing stores and the lossy getImageData round-trip for non-opaque pixels. html.spec.whatwg.org
  3. Wang, X., Xie, L., Dong, C., & Shan, Y. (2021). Real-ESRGAN: Training Real-World Blind Super-Resolution with Pure Synthetic Data. ICCV Workshops. arXiv:2107.10833. arxiv.org
  4. Lange, D. (1936). “Migrant Mother” (Destitute pea pickers in California), Farm Security Administration. Public domain, via Wikimedia Commons. commons.wikimedia.org
  5. ONNX Runtime: the inference engine both our server (CPU) and in-browser (WebGPU/WASM) engines run on. onnxruntime.ai