हाथ से खींचे गए सामान्य मानचित्रों का उपयोग करके 2 डी स्प्राइट्स की गहराई जोड़ें

पिक्सेल कला शाश्वत है, लेकिन इसका मतलब यह नहीं है कि इसके साथ काम करने के लिए उपकरण और तकनीक 1993 के स्तर पर बने रहें।

ब्रिटिश गेम डेवलपर कार्डबोर्ड तलवार दो आयामी स्टील्थ प्लेटफार्मिंग गेम द सीज और सैंडफॉक्स पर काम कर रहा है, जो पेपर 2 डी के साथ अवास्तविक इंजन 4 में बनाया गया है। टीम अन्य डेवलपर्स को पेश करने वाली विकास डायरी की एक श्रृंखला प्रकाशित करती है कि इन उपकरणों को अपने गेम में कैसे उपयोग किया जाए।

घेराबंदी और सैंडफॉक्स की मुख्य तकनीकी विशेषताओं में से एक है हाथ से तैयार किए गए टाइलों का उपयोग और सामान्य नक्शे के साथ स्प्राइट्स, जो आपको इस गेम में तीन-आयामी प्रकाश विधियों का उपयोग करने की अनुमति देता है, जिसमें पारंपरिक दो आयामी पिक्सेल कला है।

कार्डबोर्ड तलवार के कला निर्देशकों में से एक, केट ड्यूक-कॉक्स, ने हाल ही में गमसुत्र को बताया कि कंपनी इस तकनीक का उपयोग कैसे करती है, यह गेम को क्यों सूट करती है और आप अपने 2 डी गेम में इसी तरह की तकनीकों को कैसे लागू कर सकते हैं।

गहराई की भावना जोड़ें

2 डी गेम में पारंपरिक फ्लैट प्रकाश व्यवस्था की तुलना में सामान्य नक्शे के क्या लाभ हैं?

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


अगस्त 2017 में कीथ ड्यूक कॉक्स द्वारा ट्विटर पर पोस्ट की गई यह छवि एक तकनीक का एक आश्चर्यजनक उदाहरण है।

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


जब सही तरीके से उपयोग किया जाता है, तो सामान्य नक्शे दृश्य में वस्तुओं को गहराई और वजन की भावना से जोड़ सकते हैं जो कि फ्लैट 2 डी छवियों को प्राप्त नहीं कर सकते।

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

2 डी प्रकाश व्यवस्था के लिए सामान्य मानचित्रों का उपयोग करने के लिए आपको शुरू में क्या आकर्षित करता है? आपको इसके बारे में कैसे पता चला, या आपने गुणवत्ता कार्यान्वयन कहां देखा?

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

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

लेकिन फिर हमने डेड सेल के लिए ग्वावेनल मैसेट की कला देखी, जिसमें मानदंडों के साथ पिक्सेल कला बहुत अच्छी तरह से की गई थी, और उसे दूसरा मौका देने का फैसला किया। [इस द्वि-आयामी खेल में 3D मॉडल का उपयोग करने के बारे में एक लेख यहां दिया गया है।] इस बार हमने सामान्य मानचित्र का उपयोग उन सतहों के छोटे विवरणों के लिए नहीं किया है जिन्हें 3D ग्राफिक्स में देखा जा सकता है। अब सामान्य मानचित्र का उपयोग पिक्सेल कला के बड़े रूपों "फैशन" के लिए किया गया था।

सामान्य मानचित्रों का उपयोग करते हुए मूर्तिकला रूप

क्या आप संक्षेप में एक परिसंपत्ति विकसित करने की प्रक्रिया के बारे में बात कर सकते हैं, विशेष रूप से समान सरल स्प्राइट 2 डी परिसंपत्ति बनाने से अंतर के बारे में?

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

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

स्प्राइट की प्रकृति के आधार पर, जिसमें मानदंड जोड़े गए थे, हमने "सामान्य मानचित्रों के क्षेत्र" से मानदंडों के कोनों के रंगों को खींचने के संयोजन का उपयोग किया था (वास्तव में, यह सभी कोणों के एक पैलेट के रूप में सेवारत है जो स्पर्शरेखा मानदंडों के नक्शे पर खींचा जा सकता है) और अलग-अलग RGB चैनलों में ड्राइंग ND, Crazybump या AwesomeBump जैसे अन्य टूल के साथ ग्रेस्केल। उन्होंने कुछ रूपों के साथ मदद की और मानदंडों के विभिन्न हिस्सों को एक साथ मिलाया।


फ़ोटोशॉप को सामान्य नक्शा तैयार करने के बाद वैक्टर को समायोजित / सामान्य करने के लिए हमने Nvidia TextureTools का उपयोग किया।

स्प्राइट DLight जैसे पूर्व-निर्मित टूल के साथ इस तरह के सामान्य सामान्य नक्शे खींचने के क्या लाभ हैं?

जब हमने एक हाई-पॉली मॉडल के बिना 2 डी ऑब्जेक्ट के लिए मानदंड बनाने के तरीकों की तलाश शुरू की, तो हमने उन अनुप्रयोगों को पाया जो कुछ हद तक इस कार्य को करते थे।

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

प्रोग्राम यह नहीं जान सकता है कि स्प्राइट में पिक्सेल की ऊँचाई और कोण क्या है, खासकर जब यह एक बहुत ही सीमित पैलेट के साथ एक पिक्सेल कला का खेल है, जहाँ किसी वस्तु के कई गहराई और कोणों को इंगित करने के लिए एक रंग का उपयोग किया जाता है। हालांकि, यह जोड़ने योग्य है कि हमने वास्तव में इन कार्यक्रमों का उपयोग नहीं किया, लेकिन बस उनके आवेदन की संभावनाओं का मूल्यांकन किया।

सामान्य मानचित्रों की त्वरित स्वचालित पीढ़ी के लिए दो मानक विधियाँ हैं - ग्रेस्केल रूपांतरण और आकृति मान्यता। हमने सभी तीन विधियों के साथ परीक्षण किए और पाया कि मैनुअल ड्राइंग विधि निश्चित रूप से सर्वोत्तम परिणाम देती है।



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

देशी 2 डी गेम में सामान्य नक्शे का उपयोग करना

आप उन डेवलपर्स को क्या सलाह दे सकते हैं जो अपने तरीके से जाना चाहते हैं?

मैन्युअल रूप से सटीक 2D मानक बनाना कोई आसान काम नहीं है। सभी अग्रभूमि और पृष्ठभूमि टाइल्स पर काम करने में लगभग 3 मानव-महीने लगे। इसलिए, उच्च-गुणवत्ता वाले परिणाम प्राप्त करने के लिए, बहुत समय निवेश करने के लिए तैयार रहें।

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

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

यदि आप अभी तक नहीं समझते हैं कि स्पर्शरेखा अंतरिक्ष के मानक कैसे काम करते हैं और उनका क्या मतलब है, तो एक संक्षिप्त अध्ययन भी आपको उन्हें बहुत आसान बनाने की अनुमति देगा।

इस पद्धति का उपयोग करने के लिए, आपको मौजूदा परिसंपत्तियों को अनुकूलित करना था, और इसे विकास की शुरुआत से लागू नहीं करना था। क्या आप उन लोगों को सलाह दे सकते हैं जो सामान्य नक्शे के साथ तैयार स्प्रिट ग्राफिक्स को पूरक करने की कोशिश कर रहे हैं?

अगर हमें इसे नए सिरे से करना है, तो हम भी ऐसा ही करेंगे: पहले डिफ्यूज़ ग्राफिक्स बनाएँ, और फिर एक संदर्भ के रूप में पिक्सेल कला का उपयोग करके मानदंडों को आकर्षित करें।

शायद हम कुछ वस्तुओं को थोड़ा अलग तरीके से आकर्षित करेंगे। पिक्सेल कला में समस्याएं थीं जब एक पिक्सेल संकेत कर सकता था, उदाहरण के लिए, एक चिपकी हुई कील या कीलक, लेकिन सामान्य नक्शे में यह पिक्सेल केवल एक कोने के अनुरूप हो सकता है, इसलिए हम छवि में कोणों को बेहतर ढंग से व्यक्त करने के लिए कुछ तत्वों को बड़ा कर सकते हैं।

यदि आप हमारे टाइल्ससेट (32x32) में कम रिज़ॉल्यूशन का उपयोग करते हैं, तो शायद आकार आपको बहुत सीमित कर देगा। 16x16 या 8x8 के रिज़ॉल्यूशन के साथ, आप संभवतः केवल एक टाइल या एक बड़ा हिस्सा जैसे पत्थर या कंक्रीट ब्लॉक नहीं होने पर आकार या वॉल्यूम स्थानांतरित नहीं कर पाएंगे।

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

क्या आपके पास उन डेवलपर्स के लिए कोई सलाह है जो अवास्तविक के बाहर इन तकनीकों का उपयोग करना चाहते हैं? उदाहरण के लिए, एकता में या गेममेकर में।

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

आमतौर पर, विभिन्न इंजनों में केवल Y अक्ष (ग्रीन चैनल) बदलता है। अवास्तविक डायरेक्टएक्स के वाई-तरफा समन्वय प्रणाली के मानदंडों का उपयोग करता है, लेकिन एकता दाएं तरफा समन्वय प्रणाली ओपनजीएल के मानदंडों वाई + का उपयोग करता है (जैसा कि यह हमें लगता है), इसलिए ग्रीन चैनल को उल्टा कर दिया जाना चाहिए।

हालांकि, यदि आपने गलत तरीके से पेंट किया है, तो अक्सर ग्रीन चैनल का एक सरल फ़्लिपिंग पर्याप्त है। आप देखेंगे कि यदि चैनल अपेक्षित परिणाम के विपरीत जलाया जाता है तो चैनल भ्रमित है।