रंग गुणवत्ता खोने के बिना खिलाड़ियों को "डाई" छवियों को अनुमति देने के लिए सबसे अच्छा तरीका है?

Question

मैं एक 2.5D आइसोमेट्रिक (2D इमेजेज) गेम बना रहा हूं।

मैं चाहता हूं कि खिलाड़ी अपने कवच, कपड़े और अन्य चीजों को "डाई" करने में सक्षम हों। मुझे लगता है कि सब कुछ grayscaling अधिक "प्राकृतिक" रंग के कुछ पर खोने के लिए जाता है। उदाहरण के लिए, लाल / पीले ग्रेस्केल के साथ एक ड्रैगन बनाना और फिर ओवरले रंग लागू करना, माध्यमिक रंग के सभी नुकसान के साथ विशुद्ध रूप से लाल ड्रैगन की ओर जाता है। इस बीच, उसी लाल / पीले ड्रैगन ब्लू को मरते हुए, यह ब्लू / व्हाइट बनाता है जो बहुत अच्छा लगता है।

मेरे खेल के पात्रों में उपकरणों की एक विशाल विविधता नहीं है। खेल के करीब है कि लीग ऑफ लीजेंड कैसे पात्रों और ग्राफिक्स को संभालता है। एक ही प्रकार का चरित्र हो सकता है (पूर्व नायक) लेकिन विकल्प के रूप में चरित्र के लिए कई संगठन। मैं चाहता हूं कि खिलाड़ी "आउटफिट्स" और पात्रों की सीमित संख्या में अधिक से अधिक अनुकूलन कर सकें।

इसलिए मैं चाहता हूं कि खिलाड़ी एक चरित्र का चयन करने में सक्षम हों, कई हथियारों में से एक चुनें, एक मुट्ठी भर पोशाक विकल्पों के बीच वैकल्पिक (पात्रों पर स्तरित), और फिर सब कुछ डाई करें (हथियारों के लिए एक विशिष्ट धातु रंग चुनें, कोई भी रंग चुनें कपड़ों के लिए बिल्कुल भी)।

अगर मैं कुछ रंग खोने के बिना ग्रेस्केल का उपयोग करने में सक्षम था, तो मैं करूंगा।

यहाँ एक उदाहरण है कि मैं किस बारे में बात कर रहा हूँ:

ड्रैगन को "डाई" करना भी संभव नहीं है, चाहे मैं फ़ोटोशॉप के "कलर ओवरले" विकल्पों में उपयोग करूं। जाहिर है, मैं इसे गलत कर रहा हूं अगर ग्रेस्केल का उपयोग करके इसे बेहतर ढंग से रंगना संभव है। ग्रीन या यलो या लाइटर पर्पल जैसे रंग के लिए, यह ठीक काम करता है। किसी भी अन्य रंग के लिए, यह कला को नष्ट कर देता है।

हालाँकि, यह बहुत अच्छा लगता है अगर मैं इसे ग्रेस्केल नहीं करता हूं, और इसके बजाय मूल (लाल / पीला) छवि के लिए "HUE" रंग लागू करता हूं।

रेड ह्यू

बैंगनी रंग

अब खिलाड़ी ड्रैगन को किसी भी रंग में रंग सकते हैं, और यह अभी भी बहुत अच्छा लगेगा! (पीला सफेद हो जाता है, जबकि लाल इंद्रधनुष के किसी भी रंग में बदल जाता है।)

क्या इसका मतलब है कि सफेद या काला सबसे अच्छा माध्यमिक रंग है? फिर कुछ अलग करने के लिए सफेद (द्वितीयक) रंग को बदलने के लिए किसी प्रकार की विधि या शेडर का उपयोग करें?

क्या एकल छवि लेने की इस जटिल पद्धति पर कोई लेख है, और रंग, डाई अलग-अलग पिक्सेल पर आधारित है?

ड्रैगन के लिए, यह एक सफेद / काले उच्च कंट्रास्ट ड्रैगन के रूप में सबसे अच्छा काम करेगा? क्या लाल / पीला सबसे अच्छा रंग सेट है? यह मेरे द्वारा आजमाए गए कुछ अन्य रंगों की तुलना में छवियों के लिए बहुत बेहतर है। क्या ग्रेस्केल अभी भी श्रेष्ठ है?

क्या फ़ोटोशॉप के "सम्मिश्रण विकल्प" में वीडियो गेम के लिए उचित रूप से "डाई" छवियों को शामिल करने की विधि शामिल नहीं है? क्या ऐसे जटिल शेड / तरीके हैं जो मुझे बेहतर सफलता प्राप्त करने की अनुमति देते हैं?

नोट: अगर ग्रेस्केल मुझे अपनी छवियों की रैम खपत को कम करने, या हानिपूर्ण संपीड़न के दौरान गुणवत्ता के नुकसान को रोकने की अनुमति देता है, तो ऐसा कुछ होगा जिसे मैं गंभीरता से विचार करूंगा।

Comments

यह वैध रूप से दिलचस्प है। मैं इसे वोट देने जा रहा हूं और आशा करता हूं कि इस पर कुछ और ध्यान जाएगा। रंग सिद्धांत एक महान विषय है।

— इवान

ह्यू रोटेशन एक संभावना है, 2 डी के लिए - मुझे नहीं पता कि यह 3 डी में काम करेगा।

— ashes999

धन्यवाद इवान। मैं यह भी मानता हूं कि यह बेहद दिलचस्प है, और मैंने अपने समय पर शोध किया है। इस तरह का काम, मैं कल्पना करता हूं, शायद ही कभी किया जाता है क्योंकि इसके लिए एक कलाकार की आवश्यकता होती है- लेकिन किसी भी कलाकार को नहीं- एक कलाकार जो रंग सिद्धांत, वीडियो गेम शेड्स या यहां तक ​​कि एक कलाकार-कोडर के साथ काम करता है। मैं केवल कल्पना कर सकता हूं कि कोई व्यक्ति जो कला और प्रोग्रामिंग दोनों में उत्कृष्ट है, उसे खोजना दुर्लभ है। Google पर इस विषय के बारे में कोई खोज करने योग्य शोध नहीं हुआ है। विशेष रूप से किसी के लिए जो अनुसंधान के लिए महत्वपूर्ण शब्द नहीं पता है। मैं निश्चित रूप से कलाकार नहीं हूं।

— कार्टर 81१

Answer 1

ह्यू-शिफ्टिंग एक संभावना है जो आपको रंग विवरण खोए बिना रंगों की एक सीमा प्राप्त करने देगा। मूल विचार प्रत्येक पिक्सेल को RGB से HSV स्पेस में परिवर्तित करना है, फिर उपयोगकर्ता-निर्धारित राशि से ह्यू को ऑफसेट करें, फिर वापस RGB में कनवर्ट करें। वास्तव में, यह आरजीबी मूल्यों के लिए एक रोटेशन मैट्रिक्स लागू करके अधिक कुशलता से किया जा सकता है: एक मैट्रिक्स बनाएं जो उपयोगकर्ता द्वारा परिभाषित ह्यू कोण द्वारा (1, 1, 1) अक्ष के चारों ओर घूमता है। तब आप इस मैट्रिक्स को अपने पिक्सेल shader में प्रत्येक RGB मान पर लागू कर सकते हैं।

यह लाल-पीले ड्रैगन को पीले-हरे, हरे-सियान, सियान-नीले, नीले-मैजेंटा, या मैजेंटा-लाल ड्रैगन में स्थानांतरित करने की अनुमति देगा। यह थोड़ा प्रतिबंधात्मक है क्योंकि इस दृष्टिकोण के साथ दो रंगों को स्वतंत्र रूप से नहीं बदला जा सकता है। मूल छवि में लेखक के रूप में वे अपने रिश्तेदार रंग बनाए रखेंगे। कुछ ऐसे रंग भी हैं जिन्हें आप एक्सेस नहीं कर सकते हैं, उदाहरण के लिए आप इस तरह से एक काला-सफेद ड्रैगन नहीं बना सकते। फिर भी, यह आपके उद्देश्यों के लिए पर्याप्त हो सकता है।

एक और संभावना है, अगर आपके मॉडल में दो या तीन "कुंजी रंग" (लाल और पीले यहां) हैं, तो आप प्रत्येक कुंजी रंग के लिए एक अलग रंग चैनल का उपयोग करके मूल छवि को लेखक कर सकते हैं। इस मामले में, आप ड्रैगन को लाल और पीले के बजाय लाल और हरे रंग में लिखेंगे, और यदि आपके पास तीसरा रंग है तो आप इसे नीले रंग में लिख सकते हैं। फिर, आप उपयोगकर्ता को तीन प्रमुख रंगों को चुनने दे सकते हैं, और छवि में लाल, हरे और नीले मूल्यों का उपयोग कर सकते हैं, ताकि उपयोगकर्ता द्वारा परिभाषित रंगों की मात्रा में मिश्रण हो सके। इसलिए आपका पिक्सेल शेड कुछ ऐसा दिखाई देगा।

finalColor = image.r * userColor1 + image.g * userColor2 + image.b * userColor3;

यह उपयोगकर्ताओं को किसी भी रंग संयोजन को चुनने देगा, जिसमें काले और सफेद, या बैंगनी और सोने जैसी चीजें शामिल हैं।

Comments

न केवल एक अच्छे उत्तर के लिए, बल्कि एक दुर्लभ विषय (रंग सिद्धांत) पर एक उत्तर के लिए। मुझे नहीं पता कि मैंने पहले क्यों नहीं सोचा। आरजीबी। लाल हरा नीला। ओह! व्यक्तिगत चैनलों को हेरफेर करने की क्षमता के कारण, उपयोग करने के लिए सबसे अच्छे रंग संभवतः उन सटीक तीन रंग हैं।

— कार्टर 81१

कलर शिफ्टिंग एक बहुत ही मुश्किल विषय है क्योंकि अधिकतर इमेज की जानकारी ब्राइटनेस द्वारा दी जाती है और सिंपल ह्यू शिफ्टिंग ब्राइटनेस को संरक्षित नहीं करती है। अलग-अलग hues में विभिन्न अंतर्निहित चमक मान हैं। उसके लिए आपको अधिक परिष्कृत एल्गोरिदम की आवश्यकता है।

— एपीआई-जानवर

Answer 2

आप जिस समस्या का सामना कर रहे हैं, वह यह है कि आप पूरी छवि को "टिंट" नहीं कर सकते हैं, आप जो दिखते हैं वह सिर्फ आधार रंग से अधिक है। एक के लिए आपके पास एक सामग्री से दूसरे में ठीक ग्रेडिएंट हैं, लेकिन इससे भी महत्वपूर्ण बात यह है कि आपके पास प्रतिबिंब, हाइलाइट और छाया भी हैं, जो आधार रंग से प्रभावित नहीं हैं। (वे मूल रूप से इसके शीर्ष पर जोड़े जाते हैं।)

तो आपको छवि को घटकों में विघटित करने की आवश्यकता है।

एक उदाहरण :

इस मामले में हमारे पास 3 परतें हैं:

• पृष्ठभूमि - इसमें ऐसे तत्व शामिल हैं जो रंगीन नहीं होने चाहिए।
• वह भाग जो रंगीन होना चाहिए - यह रंग से गुणा किया जाता है। (यदि आप सफेद के अलावा किसी अन्य रंग को निर्दिष्ट करते हैं तो ओपनजीएल डिफ़ॉल्ट रूप से गुणा करता है।)
• हाइलाइट्स - ये पूरी छवि पर एडिक्टिव हैं। यह सफेद नहीं है, लेकिन पीले रंग का है, एक रंग बदलने का अनुकरण करने के लिए। ऑब्जेक्ट सिर्फ एक रंग नहीं हैं, चमक चमक के साथ बदल जाती है।

Comments

+1। लेकिन "आप बस पूरी तरह से" टिंट "नहीं कर सकते हैं" छवि थोड़ा भ्रामक है। यह सब उसके खेल के लिए ओपी की पसंद पर निर्भर करता है। उदाहरण के लिए डियाब्लो II ने किया। तो मैं "आप नहीं कर सकते / आप की जरूरत है" भागों के साथ इतना सख्त नहीं होगा। यह सिर्फ एक विकल्प है, बेहतर दिखने वाला लेकिन अधिक रैम लेने वाला।

— Kromster का कहना है कि

@ क्रॉमस्टर्न पॉइंट है, यह भयानक लगता है यदि आप इसे करते हैं, हमेशा।

— एपीआई-जानवर

बहुत बढ़िया जवाब। हालांकि, स्वचालन के माध्यम से यह संभव है? यदि किसी एकल चरित्र के लिए हजारों एनिमेटेड छवियां हैं, तो प्रत्येक परत को हाथ से चुनना या छवि को एक बार में विघटित करना संभव नहीं है। फिर भी, मैं 3 डी से मास्किंग का उपयोग करते हुए इसे स्वचालित करने में मदद करने के लिए कुछ वर्कअराउंड देख सकता हूं, लेकिन इसकी परवाह किए बिना यह अभी भी एक महान जवाब है।

— कार्टर 81१

प्रमुख रंगों को खोजने और उन्हें निकालने (स्वचालित रूप से अल्फा "एल्गोरिथ्म के लिए एक रिवर्स रंग का उपयोग करके) को स्वचालित करना संभव है। लेकिन ऐसा नहीं है कि मैंने कभी ऐसा कुछ लागू किया है।

— एपीआई-बीस्ट

हाइलाइट्स निकालने के लिए आप पहले निकाले गए मास्क को ले सकते हैं और इसे फ़िल्टर कर सकते हैं ताकि आप केवल सबसे चमकदार घटकों के साथ बचे रहें।

— एपीआई-जानवर

Answer 3

मैं व्यक्तिगत रूप से मुखौटा बनावट का उपयोग करने की सलाह दूंगा जो आप चाहते हैं। यह सुनिश्चित करेगा कि आपकी मुख्य RGB24 बनावट किसी भी परिशुद्धता का त्याग किए बिना अपनी मूल रंग गुणवत्ता बनाए रखेगी। यह आपको अपने रंग के मुखौटे के साथ अपनी मुख्य बनावट को मिश्रण करने के लिए बहुत सारी कलात्मक स्वतंत्रता देगा।

प्रत्येक मुखौटा को एक ग्रेस्केल बनावट के रूप में देखा जा सकता है जो आपके कस्टम रंग के साथ आपकी आधार बनावट के रंग को रैखिक रूप से प्रक्षेपित करेगा। मान लें कि आप अपने उपयोगकर्ताओं को दो रंगों को अनुकूलित करने दे रहे हैं, पिक्सेल shader कुछ इस तरह दिखाई देगा:

इनपुट्स: मेनटेक्स्चर (RGB), Mask1Texture (A), Mask2Texture (A), Colour1 (फ्लोट), Colour2 (फ्लोट)

आउटपुट: (मास्क 1 कस्टम + मास्क 2 कस्टम) -MainTexture + Colour1 * मास्क + टेक्सचर + Colour2 * मास्क 2 कस्टम

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

मैंने मोबाइल गेम के लिए इस तकनीक का उपयोग किया है और यह आपके समग्र प्रदर्शन को प्रभावित नहीं करेगा। यह आपको प्रति बनावट 33% अधिक रैम की लागत दे सकता है लेकिन गुणवत्ता के लिए व्यापार बंद शायद इसके लायक है।

Ps यदि आप केवल एक कस्टम रंग का उपयोग करने के बारे में सोच रहे हैं, तो आप बस अपने RGBA32 मुख्य बनावट के अल्फा चैनल को अपने मास्क के रूप में उपयोग कर सकते हैं।

Answer 4

आप रंग पट्टियों का उपयोग कर सकते हैं और खिलाड़ी को पैलेट संपादित करने दे सकते हैं। यदि आप शेड्स का उपयोग करते हैं, तो आप पैलेट के रूप में 1D बनावट और इंडेक्स के रूप में मूल ग्रे मूल्य का उपयोग कर सकते हैं।

255 रंगों के साथ एक वास्तविक रंग छवि को एक छवि में बदलने के लिए, आप अपने सभी पिक्सेल रंग मूल्यों को ले सकते हैं और उन्हें 3 डी रंग स्थान में k- साधन एल्गोरिथ्म के साथ 255 समूहों में समूहित कर सकते हैं। या जेनेरिक छवि रूपांतरण उपकरण का उपयोग करें। फिर यह उल्लेख करना महत्वपूर्ण है कि ग्रे मूल्य बनावट का प्रक्षेप आपके रंग बनावट में सूचकांकों का एक प्रक्षेप होगा। यह आपके मूल छवि के दो टेक्सल्स के बीच कई रंग होने के परिणामस्वरूप परिणाम हो सकता है। यह प्रक्षेप को अक्षम करने से हल हो सकता है (मुझे लगता है कि आप ऐसा नहीं करना चाहते हैं) या अपने रंग पैलेट को उपयोगी तरीके से सॉर्ट करके।

Comments

यह मूल रूप से है जो मैं भी सोच रहा था। आप कुछ और पूर्ण करने के लिए उत्तर का विस्तार करना चाह सकते हैं। असल में, आप उपयोगकर्ता को दो रंग (या अधिक या कम, लेकिन तर्क के लिए, 2) चुनने देते हैं, 1 डी बनावट बनाते हैं जो दो रंगों से लुप्त होती है। ज्यामिति पर एक ग्रेस्केल बनावट का उपयोग करें जो 1 डी बनावट में संदर्भ के रूप में कार्य करता है। उपयोगकर्ता के लिए बदसूरत रंगों को सेट करना अभी भी संभव है, लेकिन उनके पास कम से कम अच्छा विपरीत रंग विकल्प बनाने का विकल्प है।

— 17

हां, आप कम 255 रंगों वाले पैलेट को भी कम उपयोगकर्ता रंगों से प्राप्त कर सकते हैं, लेकिन यहां मैं केवल आपको इसे आज़माने की सलाह दे सकता हूं। मुझे पता है कि बहुत सारे पुराने खेलों ने अपने राक्षसों में बदलाव करने के लिए रंग पैलेट में बदलाव का इस्तेमाल किया। मुझे लगता है कि डियाब्लो ने ऐसा किया।

— Arne

Answer 5

आप छवि को एक ग्रे छवि में बदल सकते हैं, लेकिन फिर भी इसे आरजीबीए चैनलों से बचा सकते हैं। अल्फा चैनल में एक वेट वैल्यू स्टोर करें, फिर इसका उपयोग यह तय करने के लिए करें कि पिक्सेल पर कितना डाई लगाया जाए। इस वजन की गणना इस आधार पर की जा सकती है कि रंग सफेद के कितने करीब है। पिक्सेल को सफेद करने के लिए, कम डाई को लागू करना चाहिए या कम वजन होना चाहिए। यह उनके मूल लपट के साथ अधिकांश हाइलाइट्स को छोड़ देगा, लेकिन इसे थोड़ा डाई लागू करें। अंतिम पिक्सेल रंग तब प्रत्येक चैनल Ro + (Rd * Ao) की गणना करके पाया जा सकता है जहां Ro मूल लाल है, डाई रंग में Rd लाल है और Ao मूल का अल्फा है। इसलिए सभी सफेद पिक्सेल को कोई नया रंग नहीं मिलता है और सभी काले पिक्सेल डाई रंग को ग्रहण करते हैं।