Flowstep और Figma एक-दूसरे के प्रतिस्पर्धी नहीं, बल्कि पूरक टूल हैं। Flowstep UI डिज़ाइन के विचार तेज़ी से बनाने और खोजने में मदद करता है; Figma वह जगह है जहाँ आप परिष्कृत करते हैं, सहयोग करते हैं, और प्रोडक्शन-तैयार काम बनाते हैं। दोनों को साथ इस्तेमाल करने से आपको दोनों के सर्वोत्तम फ़ायदे मिलते हैं।
Flowstep डिज़ाइन को Figma में कैसे कॉपी करें
1
Flowstep में एक या अधिक स्क्रीन चुनें
स्क्रीन पर क्लिक करके उसे चुनें, या एक साथ कई स्क्रीन चुनें ताकि सभी एक बार में कॉपी हो जाएँ। पक्का करें कि कैनवस में चुनाव हाइलाइट हो।
2
चुनाव कॉपी करें
Mac पर **Cmd+**⇧+C या Windows पर **Ctrl+**⇧+C दबाएँ। Flowstep काम करते समय “Preparing your design. Stay on the current tab.” दिखाता है; कॉपी कुछ ही पल में पूरी हो जाती है।
3
अपनी Figma फ़ाइल में पेस्ट करें
Figma पर स्विच करें और वह फ़ाइल खोलें जहाँ आप डिज़ाइन रखना चाहते हैं। पेस्ट करने के लिए Mac पर Cmd+V या Windows पर Ctrl+V दबाएँ। Flowstep स्क्रीन आपके Figma कैनवस पर एडिट करने के लिए तैयार दिखेंगी।
Figma में कॉपी आपके ब्राउज़र के क्लिपबोर्ड का उपयोग करती है, इसलिए ब्राउज़र को Flowstep को क्लिपबोर्ड एक्सेस की अनुमति देनी होगी। अगर आपको permission error दिखे, तो अपनी ब्राउज़र सेटिंग्स में क्लिपबोर्ड एक्सेस की अनुमति दें और फिर कोशिश करें। कॉपी के बीच में टैब बदलने से ट्रांसफ़र रुक जाता है; कॉपी पूरी होने तक Flowstep टैब को फ़ोकस में रखें।
Figma से डिज़ाइन इंपोर्ट करें
आप इसके उलट भी कर सकते हैं और Figma फ़्रेम को एडिट करने योग्य स्क्रीन के रूप में Flowstep में ला सकते हैं। इंपोर्ट सभी के लिए उपलब्ध है: एक बार अपना Figma अकाउंट कनेक्ट करें, फिर फ़्रेम लिंक से इंपोर्ट करें।1
Figma कनेक्ट करें
अपनी सेटिंग्स से अपना Figma अकाउंट Flowstep से कनेक्ट करें। Flowstep आपकी पहुँच वाली फ़ाइलें पढ़ने के लिए Figma की authorization का उपयोग करता है।
2
Figma में फ़्रेम लिंक कॉपी करें
Figma में वह फ़्रेम राइट-क्लिक करें और Copy link to selection चुनें। आप पूरे पेज का लिंक भी कॉपी कर सकते हैं ताकि उसके सभी टॉप-लेवल फ़्रेम एक साथ इंपोर्ट हो जाएँ।
3
Flowstep में इंपोर्ट करें
Flowstep टूलबार में Figma इंपोर्ट विकल्प का उपयोग करें और लिंक पेस्ट करें। Flowstep फ़्रेम को आपके कैनवस पर एडिट करने योग्य एलिमेंट्स में बदल देता है। हर इंपोर्ट एक नई स्क्रीन जोड़ता है। वही फ़्रेम दोबारा इंपोर्ट करने से पिछला इंपोर्ट नहीं बदलता, इसलिए अगर पुरानी स्क्रीन की ज़रूरत न हो तो उसे हटा दें।
इंपोर्ट में क्या आता है
Flowstep Figma फ़्रेम को फ़्लैट इमेज के बजाय मूल, एडिट करने योग्य एलिमेंट्स के रूप में फिर से बनाता है। इंपोर्ट में ये चीज़ें आती हैं:- फ़्रेम और उनकी नेस्टेड लेयर्स
- टेक्स्ट, जिसमें हर अक्षर की स्टाइलिंग शामिल है, जैसे वेट, रंग और बोल्ड
- आपके Figma variables के रंग
- Image fills, और SVG आइकन व आकार
- Drop और inner shadows, और layer व background blur
- Dashed और dotted strokes
फ़ाइल के संगठन में Figma कनेक्टेड होना चाहिए। अगर कोई फ़्रेम इंपोर्ट न हो, तो Flowstep एक actionable message दिखाता है जो बताता है कि आगे क्या करना है। उदाहरण के लिए, authorization खत्म होने पर Figma दोबारा कनेक्ट करें, Figma रेट-लिमिट करे या धीमा जवाब दे तो रुककर फिर कोशिश करें, या Community टेम्पलेट के लिए उसे पहले अपनी टीम में डुप्लिकेट करें और नया लिंक पेस्ट करें।