परिचय
यदि आपकी टीम Rive में निर्मित इंटरैक्टिव एनिमेशन भेजती है, तो ऐप में डालने से पहले किसी को निर्यात की गई फ़ाइल की जाँच करनी होगी। केवल उसे चलते हुए देखना पर्याप्त नहीं है। आपको यह सुनिश्चित करना होगा कि सही आर्टबोर्ड मौजूद है, स्टेट मशीन अपने इनपुट पर प्रतिक्रिया करती है, और कुछ भी ऐसी स्थिति में न अटके जहाँ उसे नहीं अटकना चाहिए।
ToolBuddy का Rive एनिमेशन व्यूअर इसी जाँच के लिए बनाया गया है। यह आपके कंप्यूटर पर निर्यात की गई `.riv` फ़ाइल खोलता है, इसे एक अलग वर्कर में चलाता है ताकि पेज रिस्पॉन्सिव बना रहे, और आपको संपादन के बजाय समीक्षा के लिए आवश्यक नियंत्रण प्रदान करता है।
यहाँ एक सामान्य समीक्षा प्रक्रिया दी गई है, जिसमें फ़ाइल खोलने से लेकर डेवलपर्स को आपके द्वारा किए गए परीक्षण का रिकॉर्ड सौंपने तक की प्रक्रिया शामिल है।
निर्यात की गई `.riv` फ़ाइल से प्रारंभ करें
उस `.riv` फ़ाइल का उपयोग करें जिसे आपकी टीम वास्तव में शिप करने वाली है, यानी रनटाइम के लिए निर्यात की गई फ़ाइल। व्यूअर `.rev` प्रोजेक्ट फ़ाइलें या एडिटर बैकअप नहीं खोलता है। यदि आपके पास केवल यही फ़ाइलें हैं, तो पहले Rive से एक `.riv` फ़ाइल निर्यात करें।
फ़ाइल को ड्रॉप करें या फ़ाइल ब्राउज़र से चुनें। व्यूअर सबसे पहले यह जांचता है कि यह वास्तव में Rive फ़ाइल है, फिर बैकग्राउंड वर्कर में रनटाइम शुरू करता है। बड़ी फ़ाइलों को शुरू होने में थोड़ा समय लगता है, लेकिन इस दौरान पेज का बाकी हिस्सा चलता रहता है।
- निर्यातित `.riv` प्रोजेक्ट फ़ाइल का उपयोग करें, न कि `.rev` का।
- इसे ड्रैग करके डालें या फ़ाइल पिकर का उपयोग करें।
- इसे शुरू होने में एक सेकंड का समय दें, फिर पूर्वावलोकन दिखाई देगा।
समीक्षा करने के लिए आर्टबोर्ड, एनिमेशन या स्टेट मशीन चुनें
लोड होने के बाद, पूर्वावलोकन के नीचे दिए गए नियंत्रणों का उपयोग करके आर्टबोर्ड, एनिमेशन या स्टेट मशीन को स्विच करें। एक निर्यात में अक्सर कई चीजें होती हैं: एक बटन की स्थितियाँ, कुछ कैरेक्टर वेरिएंट, या आइकनों का एक पूरा सेट।
किसी एक क्लिप पर टाइमिंग की जांच करने के लिए, उस एनिमेशन को चुनें। व्यवहार की जांच करने के लिए, इसके बजाय स्टेट मशीन चुनें। रनटाइम जानकारी पैनल को खुला रखें ताकि देखने वाले को पता रहे कि कौन सा आर्टबोर्ड और स्टेट मशीन सक्रिय है।
- उत्पाद के जिस भाग की आप जाँच कर रहे हैं, उसके लिए आर्टबोर्ड चुनें।
- किसी विशिष्ट एनिमेशन पर स्विच करके एक क्लिप की टाइमिंग की जाँच करें।
- किसी स्टेट मशीन पर स्विच करके देखें कि वह इनपुट पर कैसे प्रतिक्रिया करती है।
प्लेबैक और लेआउट नियंत्रणों से देखें कि यह कैसा दिखता है।
प्ले, पॉज़ और स्पीड का उपयोग करके आप गति, ठहराव और बार-बार दोहराए जाने वाले ट्रांज़िशन देख सकते हैं। जब आप किसी एनिमेशन पर होते हैं, तो प्रोग्रेस बार सक्रिय क्लिप का अनुसरण करता है, जिससे आप टाइमलाइन में ठीक उसी स्थान को देख सकते हैं जहां कुछ घटित होता है।
फिट, अलाइनमेंट और बैकग्राउंड आपको यह देखने में मदद करते हैं कि यह उत्पाद में लगभग कैसा दिखेगा। कवर के विरुद्ध कंटेनमेंट या फिटविड्थ का उपयोग करके देखें कि यह एक चौड़े बैनर में एक छोटे वर्गाकार बटन की तुलना में कैसा दिखता है, और बैकग्राउंड को अपने ऐप के रंग पर सेट करें ताकि कंट्रास्ट संबंधी समस्याएं अभी दिखाई दें। पूर्वावलोकन में ध्वनि म्यूट है, इसलिए ऐप में ही ऑडियो की जांच करें।
- ट्रांज़िशन देखने के लिए इसे धीमा करें, लंबे लूप की जांच करने के लिए इसे तेज़ करें।
- फिट और अलाइनमेंट को बदलकर उसे उस स्थान से मिलाएँ जहां यह वास्तव में दिखाई देगा।
- बैकग्राउंड को वास्तविक UI रंग पर सेट करें।
इनपुट देकर देखें और स्टेट मशीन की प्रतिक्रिया देखें।
यहीं पर व्यूअर अपनी भूमिका निभाता है। यदि स्टेट मशीन में बूलियन, संख्या या ट्रिगर इनपुट हैं, तो वे कंट्रोल पैनल में दिखाई देते हैं, और आप उन्हें ऐप कोड की तरह ही नियंत्रित कर सकते हैं। कुछ विशिष्ट स्थितियों को आजमाएं: एक बूलियन को दो बार जल्दी से पलटें, एक संख्या को उसकी सीमा पर सेट करें, और संक्रमण के बीच में ट्रिगर को सक्रिय करें।
जैसे-जैसे आप आगे बढ़ते हैं, स्टेट टाइमलाइन प्रत्येक स्टेट परिवर्तन को दिखाती है, जिससे आप देख सकते हैं कि मशीन आपकी अपेक्षा के अनुसार सही दिशा में गई या वहां तक पहुंचने के लिए कोई असामान्य रास्ता अपनाया। यह आमतौर पर एडिटर में स्टेट मशीन को पढ़ने से तेज़ होता है।
- प्रत्येक सशर्त स्थिति की जांच करने के लिए बूलियन को पलटें।
- सीमाओं और श्रेणियों का परीक्षण करने के लिए संख्याओं को बदलें।
- एक बार के संक्रमणों की जांच करने के लिए ट्रिगर सक्रिय करें।
इसे हैंडऑफ़ मोड और सेशन लॉग के साथ सौंप दें।
यदि आप किसी और को पूर्वावलोकन दिखा रहे हैं, तो हैंडऑफ़ मोड चालू करें। यह लेआउट और इनपुट पैनल को छिपा देता है और स्क्रीन पर केवल हाल ही में हुए स्टेट परिवर्तन और इवेंट्स को ही रखता है, ताकि डिज़ाइन रिव्यू कंट्रोल के टूर में न बदल जाए।
इवेंट रिकॉर्डर सेशन में हुई हर चीज़ को लॉग करता है: प्ले, पॉज़, स्टॉप और लूप, स्टेट में बदलाव, आपके द्वारा किए गए हर इनपुट और स्पीड में बदलाव। इसे जैसन फ़ाइल के रूप में एक्सपोर्ट करें और टिकट के साथ अटैच करें। इससे डेवलपर को ठीक से पता चल जाएगा कि आपने क्या किया और एनिमेशन ने उसके जवाब में क्या किया, जो कि स्क्रीनशॉट और "कुछ गड़बड़ हो गई" जैसे संक्षिप्त विवरण से कहीं बेहतर है।
द्वारा लिखित
Ankit Kumar
वरिष्ठ सॉफ्टवेयर इंजीनियर और टूलबडी के संस्थापक
WebAssembly, वेब ऑडियो और कैनवास प्रौद्योगिकियों का उपयोग करके शून्य अपलोड आवश्यकताओं के साथ इंजीनियरिंग ब्राउज़र-पहली उपयोगिताएँ।