1. एक स्क्रीन जनरेट करें और प्रीव्यू करें
सबसे सामान्य वर्कफ़्लो: एक स्क्रीन जनरेट करें (एक ही चरण में फ़ाइल बनाएं), फिर परिणाम देखें।fileId को छोड़ने से नई फ़ाइल स्वचालित रूप से बनती है। इसके बजाय उस फ़ाइल में स्क्रीन जोड़ने के लिए मौजूदा fileId पास करें।
अपने AI असिस्टेंट के लिए प्रॉम्प्ट:
Flowstep डिज़ाइन जनरेट करें: एक डेवलपर टूल के लिए एक मोबाइल साइन-इन स्क्रीन, ईमेल/पासवर्ड और गूगल SSO बटन के साथ, डार्क थीम में, फिर मुझे इमेज दिखाएं।
2. React कंपोनेंट को विज़ुअलाइज़ करें
एक.jsx या .tsx फ़ाइल को एक अटैचमेंट के रूप में अपलोड करें और Flowstep से एक मेल खाने वाला डिज़ाइन जनरेट करने के लिए कहें। Flowstep स्रोत को पढ़ता है और एक स्क्रीन उत्पन्न करता है — ऐप चलाने की कोई आवश्यकता नहीं।
src/components/settings/ApiKeys.tsx को पढ़ें, इसे एक अटैचमेंट के रूप में अपलोड करें, और एक Flowstep स्क्रीन जनरेट करें जो कंपोनेंट लेआउट से मेल खाती है। मुझे रेंडर की गई इमेज दिखाएं।
3. MCP-जनरेट स्क्रीन पर पुनरावृत्ति करें
edit-design और regenerate-design के लिए डिज़ाइन संदर्भ की आवश्यकता है जो केवल designs एरे के साथ जनरेट की गई स्क्रीन पर मौजूद है। बिना इसके जनरेट की गई स्क्रीन के लिए, समाधान यह है कि स्क्रीन को एक अटैचमेंट के रूप में रेंडर करें और इमेज के साथ create-new-design को कॉल करें।
edit-design को कॉल करें message में परिवर्तन और targets में स्क्रीन के साथ।
4. एक स्क्रीन को पूर्ण फ्लो में विस्तृत करें
एक मौजूदा डिज़ाइन में अनुवर्ती स्क्रीन जोड़ें।operationVariant: "error_state" या "empty_state" के साथ दोहराएं।
operationVariant expand-design के लिए एक आवश्यक पैरामीटर है। आधार स्क्रीन को भी designs एरे (डिज़ाइन संदर्भ) के साथ जनरेट किया जाना चाहिए — स्क्रीन के बिना इसके, उदाहरण 3 से अटैचमेंट समाधान का उपयोग करें।5. बैच जॉब से पहले कोटा ऑडिट करें
कई जनरेशन शुरू करने से पहले शेष क्षमता जांचें।daily कम है, तो बैच को 00:00 UTC के बाद शेड्यूल करें जब यह रीसेट होता है।