🤫 🍆 🔳 स्क्रैच से यूनिटी 3 डी में फ्लैश-एनीमेशन। भाग एक, गेय 🧑 🤵🏻 🤸🏾

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

परिचय

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

2D- एनीमेशन के प्रकार

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

फ़्रेम-बाय-फ़्रेम एनीमेशन

हमारी मिनी-समीक्षा को मारना, सबसे सरल और सबसे प्राचीन प्रकार का एनीमेशन: फ्रेम-बाय-फ्रेम एनीमेशन। इस एनीमेशन में, प्रत्येक फ्रेम को एक व्यक्तिगत चित्र द्वारा दर्शाया गया है, और उन चित्रों को वास्तव में जल्दी से बदलकर, हमें आंदोलन का भ्रम मिलता है।

पेशेवरों:

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

विपक्ष:

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

निचला रेखा:

केवल छोटे और कुछ एनीमेशन फ्रेम के लिए काम करता है, पिक्सेल कला और एनईएस जैसे रेट्रो-शैली के खेल के लिए एकदम सही है।

वीडियो एनीमेशन

असल में, वीडियो एनीमेशन फ्रेम-बाय-फ्रेम पागलपन का एक एपोथोसिस है। और हाँ, यह अभी भी लागू होता है और कभी-कभी सही भी होता है। हमने गुंडे और जटिल एनीमेशन के लिए हिडन ऑब्जेक्ट गेम्स में कुछ इस तरह से लागू किया है, और यथार्थवाद के संकेत के साथ cutscenes के लिए भी। इस कोडक को theora या vp8 की तरह जोड़ें, और आप अपने खुद के काफी अच्छे वीडियो एनीमेशन ( अल्फा कंपोजिंग के साथ भी) बना पाएंगे।

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

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

कंकाल का एनीमेशन

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

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

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

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

समयरेखा एनीमेशन

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

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

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

एनिमेशन प्रकार: सारांश

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

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

दुविधा और अपना समाधान लिखने का निर्णय

वैसे भी, कुछ उद्देश्य कारणों से, हमने तय किया कि हमारी परियोजना के लिए हमें फ्लैश-एनीमेशन की आवश्यकता है। फिर सवाल उठता है, इंजन में उनके एकीकरण के बारे में। कई प्लग-इन विकल्पों की कोशिश करने के बाद, हमने अपनी क्षमताओं के लिए सबसे अच्छा माना जाने वाला विकल्प चुना। यद्यपि यह जीवित था और अच्छी तरह से समर्थित था, इसके पास पूरी तरह से अप्रभावी उद्यम लाइसेंस भी था, लेकिन वास्तव में एक अच्छे उत्पाद पर कौन मूल्य लगा सकता है? अब, मैं जानबूझकर आपको कोई नाम नहीं दूंगा, इसलिए इसे विज्ञापन या विरोधी विज्ञापन की तरह नहीं बनाना चाहिए।

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

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

निर्यात विकल्प

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

.XFL प्रारूप

फ्लैश एनिमेशन एडिटर में आप स्रोत फ़ाइल को बंद किए गए बंद .FLA के बजाय एक असम्पीडित .XFL प्रारूप में सहेज सकते हैं। अब, इस प्रारूप के साथ काम करना बहुत आसान है, लेकिन इसका कोई प्रलेखन नहीं है। मूल रूप से, इसमें कुछ उपनिर्देशिकाएँ और .XML फ़ाइलों का एक पूरा गुच्छा होता है, जो अंदर संग्रहीत क्लिप के सभी राज्यों का वर्णन करता है। विवरण प्रारूप भी बहुत सरल और समझ में आता है, जैसा कि आप नीचे दिए गए उदाहरण से देख सकते हैं:

static_clip.xml

<DOMSymbolItem name="static_clip" itemID="5c719f28-00000051" lastModified="1550950184"> <timeline> <DOMTimeline name="static_clip"> <layers> <DOMLayer name="Layer_1" color="#00FFFF" current="true" isSelected="true"> <frames> <DOMFrame index="0" keyMode="9728"> <elements> <DOMBitmapInstance selected="true" libraryItemName="bitmap.png"/> </elements> </DOMFrame> </frames> </DOMLayer> </layers> </DOMTimeline> </timeline> </DOMSymbolItem>

स्रोत लिंक

यहाँ हमें जो मिला है वह है, एक परत के साथ static_clip , Layer_1 और एक फ्रेम जो bitmap.png ( bitmap.png नामक एक रेखापुंज छवि को bitmap.png ।

movie_clip.xml

 <DOMSymbolItem name="movie_clip" itemID="5c719f30-00000053" lastModified="1550950713"> <timeline> <DOMTimeline name="movie_clip"> <layers> <DOMLayer name="Layer_1" color="#00FFFF" current="true" isSelected="true"> <frames> <DOMFrame index="0" duration="4" tweenType="motion" motionTweenSnap="true" keyMode="22017"> <elements> <DOMSymbolInstance libraryItemName="static_clip"> <matrix> <Matrix tx="-50" ty="-50"/> </matrix> <transformationPoint> <Point x="28.5" y="27.5"/> </transformationPoint> </DOMSymbolInstance> </elements> </DOMFrame> <DOMFrame index="4" tweenType="motion" motionTweenSnap="true" keyMode="22017"> <elements> <DOMSymbolInstance libraryItemName="static_clip" centerPoint3DX="128.5" centerPoint3DY="127.5"> <matrix> <Matrix tx="100" ty="100"/> </matrix> <transformationPoint> <Point x="28.5" y="27.5"/> </transformationPoint> </DOMSymbolInstance> </elements> </DOMFrame> </frames> </DOMLayer> </layers> </DOMTimeline> </timeline> </DOMSymbolItem>

स्रोत लिंक

यहां आप क्लिप movie_clip का वर्णन देख सकते हैं, जिसमें क्रमशः 0 और 4 के साथ दो movie_clip होते हैं। उन फ़्रेमों में हमारे क्लिप static_clip को निर्देशांक (-50;-50) और (100;100) द्वारा संग्रहीत किया जाता है। यहाँ फ्रेम के बीच मोशन ट्विन (एक प्रक्रियात्मक एनीमेशन है, हमारे मामले में यह केवल एक बदलाव है, बिना स्केलिंग और रोटेशन के)। इस प्रकार, मुख्य फ़्रेमों के बीच स्थिर क्लिप की स्थिति की गणना इन फ़्रेमों से हमारे द्वारा लिए जाने वाले निर्देशांक के रैखिक प्रक्षेप का उपयोग करके की जा सकती है।

बेशक, एक असली एनीमेशन के मामले में यह सब होगा, उह ... थोड़ा और अधिक जटिल और भारी, लेकिन फिर भी यह सभी को समझा जा सकता है, यहां तक कि दस्तावेज के बिना भी। और यह आपको लग सकता है कि यह है। और वास्तव में, मैं कई परियोजनाओं और कंपनियों के बारे में जानता हूं जो इस तरह से गईं और कुछ सीमाओं और कठिनाइयों के बिना काफी सफल रहीं, लेकिन नहीं। और ये कठिनाइयाँ .XFL की असली टक्कर हैं, जो हैं:

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

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

.JSFL स्क्रिप्ट

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

आकाशवाणी अनुप्रयोग

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

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

एक बोनस के रूप में हमें फ्रेम स्क्रिप्ट (सभी play() , stop() और अन्य gotoAndPlay() , कुछ एनिमेटर्स वास्तव में पसंद हैं) का उपयोग करने का अवसर मिलता है। एक खामी के रूप में, हम फ्लैश में लूप किए गए दृश्यों को निर्यात करने का अवसर खो देते हैं। लेकिन यह इतना बुरा नहीं है, वास्तव में, क्योंकि हम उन्हें अपने रनटाइम में पा सकते हैं, और एनिमेटर्स इसके लिए सब कुछ तैयार कर सकते हैं।

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

आपका अपना फ़्लैश प्लेयर

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

किसी भी सभ्य फ़्लैश प्लेयर के अंदर कम से कम दो महत्वपूर्ण बातें छिपी होती हैं:

SWF प्रारूप parser;
वेक्टर ग्राफिक्स रेखापुंज;
कोड के ActionScript लॉन्च करने के लिए वर्चुअल मशीन;
एक कस्टम कोड के लिए मानक पुस्तकालय;

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

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

दृष्टिकोणों का मेल

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

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

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

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

गेय भाग का निष्कर्ष

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

स्क्रैच से यूनिटी 3 डी में फ्लैश-एनीमेशन। भाग एक, गेय