👵🏼 🐗 🥢 वुफोरिया के साथ एक एआर गेम बनाना 🖕🏾 🚙 😃

[कट के नीचे 3D GIF हैं]

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

यद्यपि ARKit और ARCore की रिहाई ने संवर्धित वास्तविकता की लोकप्रियता बढ़ाने में मदद की, अन्य प्लेटफार्मों और एसडीके पहले से ही मौजूद थे। उनमें से एक वुफोरिया था; और हाल ही में, एकता ने वुफोरिया के साथ एक साझेदारी समझौते में प्रवेश किया और इस एआर प्लेटफॉर्म को एकता गेम इंजन में एकीकृत किया।

इस ट्यूटोरियल में, मैं एकता इंजन के साथ एकीकृत वुफोरिया एसडीके का उपयोग करके एक एआर गेम बनाऊंगा। इस प्रक्रिया में, मैं निम्नलिखित प्रमुख घटकों के बारे में बात करूंगा:

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

नोट: यह वुफोरिया ट्यूटोरियल मानता है कि आप पहले से ही एकता विकास की मूल बातें जानते हैं। यदि आप एकता के लिए नए हैं, तो एकता के ट्यूटोरियल में शानदार शुरुआत करें ।

एकता में एआर-गेम्स का विकास

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

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

काम पर लगना

अब जब आपके पास यूनिटी, वुफोरिया और एक वेब कैमरा है, तो आपको एक नमूना परियोजना ( यहां से ) डाउनलोड करने की आवश्यकता है।

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

परियोजना की संरचना की समीक्षा करने के बाद, हमारे पिज्जा गेम में ऑर्डर भरने के लिए संपादक में प्ले बटन पर क्लिक करें।

महान, हम पिज्जा के साथ खेल सकते हैं, लेकिन हमारी असली चुनौती इसे एआर गेम में बदलना है।

नोट: इस ट्यूटोरियल के लिए UI की संपत्ति shareicon.net से डाउनलोड की गई है

।

वुफोरिया शेफ से मिलें

ऐसा करने के लिए, हमें ट्रैकर छवि पर आभासी पिज्जा बनाने की आवश्यकता है जिसे हम वास्तविक दुनिया में रखते हैं। ऑर्डर में भरने को जोड़ने के बाद, आप पिज्जा की भौतिक रूप से "सेवा" कर सकते हैं, इसे कैमरे की दृश्यता से निकाल सकते हैं ...

लेकिन हर चीज का अपना समय होता है। पहले आपको मुख्य कैमरा को एआर कैमरा से बदलने की आवश्यकता है। दृश्य से मुख्य कैमरा निकालें, और फिर पदानुक्रम में राइट-क्लिक करें ।

फिर वुफोरिया -> एआर कैमरा जोड़ें। यह इस विंडो को पॉप अप करेगा:

आयात पर क्लिक करें और प्रोजेक्ट में आयात किए जाने के लिए वुफोरिया पैकेज की प्रतीक्षा करें, और काफी कुछ फाइलें जोड़ी जाएंगी।

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

वफ़ोरिया फ़ोल्डर में वेफ़ोरिया प्लेटफ़ॉर्म द्वारा उपयोग किए जाने वाले सभी प्रीफ़ैब और स्क्रिप्ट हैं, जिनका हम उपयोग करेंगे।

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

नोट: यदि आपके प्रोजेक्ट में App लाइसेंस कुंजी नहीं है, तो यह README फाइल में पाया जा सकता है। VuforiaConfiguration फ़ाइल के निरीक्षक क्षेत्र में लाइन की प्रतिलिपि बनाएँ।

अब जब हमारे पास दृश्य में एआर कैमरा है, तो केवल एक ही काम करना बाकी है - संवर्धित वास्तविकता को चालू करें!

Edit -> Project Settings -> Player में जाएं । XR सेटिंग्स पर स्क्रॉल करें, और सुनिश्चित करें कि Vuforia संवर्धित वास्तविकता समर्थित चेकबॉक्स चेक किया गया है।

Play संपादक में क्लिक करें और अपने आप को नमस्ते कहें!

नोट: यदि आप प्ले पर क्लिक करते हैं और "वुफोरिया इनिशियलाइज़ेशन फेल" स्क्रीन दिखाई देती है, तो एकता को पुनः आरंभ करने का प्रयास करें। यह एक यादृच्छिक बग है जो केवल कुछ प्रणालियों पर दिखाई देता है।

पैटर्न मान्यता का परिचय

निश्चित रूप से अपने आप को महान मानना, लेकिन क्या हम पिज्जा गेम बनाने नहीं जा रहे थे?

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

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

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

जैसा कि आप देख सकते हैं, विशेषता अंक अच्छी तरह से वितरित किए जाते हैं। यह भी पिज्जा है, जो सुविधाजनक है!

दृश्य में छवि लक्ष्य जोड़ना

यह जादू करने का समय है! हम अपने पिज्जा के शीर्ष पर आभासी पिज्जा दिखाई देंगे। फिर, पदानुक्रम में बनाएँ मेनू का उपयोग करें और Vuforia -> छवि का चयन करें।

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

डेटाबेस RW_ItsaPizza पर सेट है
छवि लक्ष्य PizzaClipArt पर सेट किया गया

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

नोट: पिज्जा ट्रैकर आपके डेटाबेस में एकमात्र छवि लक्ष्य है; हालाँकि, एक डेटाबेस में सैकड़ों चित्र हो सकते हैं। इसके अलावा, एक आवेदन में कई डेटाबेस हो सकते हैं।

अब जब हमने दृश्य में एआर कैमरा और छवि ट्रैकर को कॉन्फ़िगर किया है, तो हमारे पास काम करने के लिए संवर्धित वास्तविकता के लिए आपके पास आवश्यक सब कुछ है! एडिटर में, प्ले बटन पर क्लिक करें और मुद्रित छवि को कैमरे के सामने रखें।

हमें पिज्जा मिला!

ट्रैकर्स के लिए गेम ऑब्जेक्ट्स को चाइल्ड ऑब्जेक्ट्स के रूप में संलग्न करना

पिज़्ज़ा थोड़ा छोटा है, लेकिन यह ट्रैकर की छवि के लिए मज़बूत है। आप यह भी देख सकते हैं कि यदि आप ट्रैक की गई छवि को हटाते हैं, तो पिज्जा हवा में लटका रहेगा।

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

जब कैमरा काम कर रहा हो तो पिज्जा को सही तरीके से कैसे व्यवहार करें? पदानुक्रम में ImageTarget का चयन करें। आप देखेंगे कि प्रत्येक अक्ष पर इसका पैमाना 10 है । यह छवि लक्ष्य व्यवहार घटक द्वारा नियंत्रित किया जाता है। उन्नत अनुभाग में, आप देख सकते हैं कि चौड़ाई पैरामीटर का मान 10 है । यह तब सेट किया गया था जब छवि को वुफोरिया डेवलपर वेबसाइट पर अपलोड किया गया था।

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

अब पदानुक्रम में GameObject पिज्जा का चयन करें। इसे बच्चा बनाने के लिए ImageTarget पर खींचें। पैमाना (X: 0.1, Y: 0.1, Z: 0.1) । इसे मानों पर लौटें (X: 1, Y: 1, Z: 1) , और Y अक्ष के साथ स्थिति को 0.01 तक भी शिफ्ट करें। इसके लिए धन्यवाद, पिज्जा इमेजटार्ग का अनुपालन करेगा।

फिर से प्ले प्रेस करें और आप देखेंगे कि पिज्जा छवि के शीर्ष पर है, और यह भी गायब हो जाता है जब छवि फ्रेम से गायब हो जाती है।

DefaultTrackableEventHandler की खोज

यह व्यवहार ImageTarget के DefaultTrackableEventHandler से लिया गया है। स्क्रिप्ट खोलें और इसे देखें।

स्क्रिप्ट पर अच्छी टिप्पणी की गई है, लेकिन यह कुछ पहलुओं पर ध्यान देने योग्य है:

प्रारंभ फ़ंक्शन TrackableBehaviour के लिए ईवेंट हैंडलर के रूप में इस स्क्रिप्ट को पंजीकृत करता है (इस मामले में, ImageTargetBehaviour )।
OnDestroy इस लिंक को हटा देता है।
OnTrackableStateChanged सबसे महत्वपूर्ण फ़ंक्शन है। उसका कोड बताता है कि ट्रैकिंग स्थिति में परिवर्तन होने पर क्या होना चाहिए।
OnTrackingFound और OnTrackingLost को OnTrackableStateChanged से पुकारा जाता है। DefaultTrackableEventHandler में, वे किसी भी बच्चे के रेंडरर , कोलाइडर और कैनवस घटकों को टॉगल करते हैं।

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

यह जानकारी अभी के लिए डाइजेस्ट करें।

अपनी खुद की ट्रैकिंग क्रिया बनाएँ

यह इस जानकारी के साथ कुछ करने का समय है!

ImageTarget से DefaultTrackableEventHandler घटक निकालें। फिर पिज्जाट्रैकबलवेंटहैंडलर जोड़ें, जो स्क्रिप्स फ़ोल्डर में पाया जा सकता है। उसके बाद PizzaTrackableEventHandler खोलें। यह DefaultTrackableEventHandler का एक क्लोन है, लेकिन OnTrackingFound और OnTrackingLost में कोड हटा दिया गया है - आपको इस समस्या को हल करना होगा!

रेंडरर घटकों को सक्षम और अक्षम करना लगभग हर एआर एप्लिकेशन में काम आता है, तो चलिए उस कोड को वापस लेते हैं। यदि आप अटक जाते हैं, तो आप इसे DefaultTrackableEventHandler से कॉपी कर सकते हैं या नीचे दिए गए स्पॉइलर के नीचे पा सकते हैं।

कोड

 protected virtual void OnTrackingFound() { var rendererComponents = GetComponentsInChildren<Renderer>(true); // Enable rendering: foreach (var component in rendererComponents) { component.enabled = true; } } protected virtual void OnTrackingLost() { var rendererComponents = GetComponentsInChildren<Renderer>(true); // Enable rendering: foreach (var component in rendererComponents) { component.enabled = false; } }

हम इस परियोजना को संवर्धित वास्तविकता में एक खेल में बदलने के लिए तैयार हैं!

UI देखें और उस बटन को ढूंढें जिसे खिलाड़ी को अपने पिज्जा को पूरा करने के लिए प्रेस करने की आवश्यकता है।

जैसा कि आप देख सकते हैं, जब एक बटन दबाया जाता है, तो Event GameManager.CompleteOrder() कहा जाता है। खिलाड़ी को बटन दबाने के लिए मजबूर करने के बजाय, आप यह सुनिश्चित कर सकते हैं कि उसने ऑर्डर पूरा करने के लिए "सेवारत" पिज्जा (कैमरे की दृश्यता से बाहर ट्रैकर को स्थानांतरित) किया।

PizzaTrackableEventHandler की शुरुआत में , छवि को ट्रैक करने के दौरान कॉल करने के लिए एक यूनिटीवेंट जोड़ें।

 using Vuforia; using UnityEngine; using UnityEngine.Events; public class PizzaTrackableEventHandler : MonoBehaviour, ITrackableEventHandler { public UnityEvent OnTrackingLostEvent; ...

अब OnTrackingLost पद्धति में ईवेंट को कॉल करें:

 protected virtual void OnTrackingLost() { var rendererComponents = GetComponentsInChildren<Renderer>(true); // Enable rendering: foreach (var component in rendererComponents) { component.enabled = false; } //Trigger our event OnTrackingLostEvent.Invoke(); }

इससे PizzaTrackableEventHandler अधिक लचीला हो जाता है, क्योंकि अब यदि ट्रैकिंग खो जाती है, तो हम किसी भी कार्रवाई को अंजाम दे सकते हैं। PizzaTrackableEventHandler को सहेजें, एकता संपादक पर लौटें और संकलन पूरा होने की प्रतीक्षा करें। जब यह समाप्त GameManager.CompleteOrder() जाता है, तो GameManager.CompleteOrder() को ट्रैकिंग पिज्जा ट्रैकर खो GameManager.CompleteOrder() बुलाया जाए। अंत में, UI में FullOrderButton को अक्षम या हटा दें।

दृश्य सहेजें, प्ले पर क्लिक करें और पिज्जा परोसें!

आगे कहाँ जाना है

बधाई हो, आपने ट्यूटोरियल पूरा कर लिया है!

एक उदाहरण परियोजना यहां से डाउनलोड की जा सकती है ।

एकता में वुफोरिया के साथ विकसित करने के बारे में अधिक जानकारी के लिए, वुफोरिया डेवलपर लाइब्रेरी या यूनिटी ट्यूटोरियल देखें ।

वुफोरिया पोर्टल पर अपने लिए एक डेवलपर खाता स्थापित करना न भूलें। आप यह जानने के लिए कि वे कैसे ट्रैक किए जाते हैं, वहां कई अलग-अलग ट्रैकर अपलोड करने का प्रयास कर सकते हैं।

अधिक जानकारी के लिए, वर्चुअल बटन के बारे में पढ़ें। वुफोरिया वेब साइट में नमूना सामग्री है। यदि आप पिज्जा गेम में UI को बदलने के लिए ये वर्चुअल बटन बना सकते हैं तो जांच लें।

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

वुफोरिया के साथ एक एआर गेम बनाना