Kaiju Hub AI

कॅनव्हास एडिटर

Wireframe canvas editor showing left toolbar, canvas with Dashboard wireframe, right sidebar with element properties, and AI prompt bar

वायरफ्रेम संपादन कॅनव्हास हे असे ठिकाण आहे जिथे तुम्ही तुमच्या स्क्रीनची रचना करता आणि त्यात सुधारणा करता. डाव्या साइडबारमध्ये सर्व रेखाचित्र आणि निवड साधने असतात, मध्यभागी कॅनव्हास असतो जिथे तुम्ही घटक ठेवता आणि त्यांची मांडणी करता आणि उजव्या साइडबारमध्ये निवडलेल्या घटकांचे गुणधर्म दर्शविले जातात.

साधने

निवडा

कॅनव्हासवरील घटक निवडण्यासाठी आणि हलवण्यासाठी क्लिक करा. निवडलेले घटक उजव्या साइडबारमध्ये त्यांचे गुणधर्म दर्शवतात.

चौरस

कॅनव्हासवर आयताकृती कंटेनर घटक काढा.

वर्तुळ

कॅनव्हासवर वर्तुळाकार घटक काढा.

मजकूर

मजकूर लेबल आणि सामग्री ब्लॉक जोडा.

इमेज

इमेज प्लेसहोल्डर घटक जोडा.

बटण

संवादात्मक बटण घटक जोडा.

इनपुट

फॉर्म इनपुट फील्ड जोडा.

+ (स्क्रीन जोडा)

वायरफ्रेम प्रोजेक्टमध्ये नवीन स्क्रीन जोडा.

लॉक केलेले घटक

जेव्हा 'A' टॉगल सक्रिय असतो, तेव्हा AI थेट तुमच्या घटकामध्ये बदल करतो. प्रॉम्प्ट प्लेसहॉल्डरमध्ये 'तुमच्या घटकात करायचे असलेले बदल सांगा' असे दिसेल आणि बॅज दर्शवेल की कोणत्या फाइलमध्ये बदल केला जाईल (उदा. 'बदल केला जाईल: मजकूर'). हा मोड जलद, विशिष्ट संपादनासाठी सर्वोत्तम आहे.

स्टोरीबोर्ड मोड

Storyboard view showing Dashboard frame card with 45 elements, zoom controls, and right sidebar with screen list

स्टोरीबोर्ड मोड तुम्हाला तुमच्या सर्व फ्रेम्स आणि त्यांच्या कनेक्शन पॉइंट्स एकाच वेळी पाहण्याची सुविधा देतो. डाव्या साइडबारमधील समान बटण वापरून तुम्ही सिंगल-स्क्रीन कॅनव्हास आणि स्टोरीबोर्ड मोडमध्ये स्विच करू शकता. स्टोरीबोर्ड मोडमध्ये, प्रत्येक स्क्रीन कार्डच्या रूपात दर्शविली जाते, ज्यामध्ये त्याच्या लेआउटचे पूर्वावलोकन असते.

स्टोरीबोर्ड वैशिष्ट्ये

फ्रेमचे विहंगावलोकन

सर्व स्क्रीन एका दृष्टीक्षेपात पहा, त्यांच्या घटक संख्येसह आणि व्हिज्युअल पूर्वावलोकनासह.

सेट मोडल

कोणतीही स्क्रीन पूर्ण पृष्ठाऐवजी मोडल ओव्हरले म्हणून चिन्हांकित करा.

संपादित करण्यासाठी क्लिक करा

तपशीलवार संपादनासाठी कोणत्याही फ्रेम कार्डवर क्लिक करा.

झूम नियंत्रणे

स्टोरीबोर्ड झूम इन/आउट करण्यासाठी डाव्या बाजूचे झूम नियंत्रणे वापरा.

फ्लो कनेक्शन

फ्रेममधील कनेक्शन दर्शवा.

घटक गुणधर्म

जेव्हा 'V' टॉगल सक्रिय असतो, तेव्हा AI इनपुटमध्ये बदल करण्याऐवजी तुमच्या घटकांचे अनेक प्रकार तयार करतो. प्रॉम्प्ट प्लेसहॉल्डर 'तुम्हाला कोणत्या प्रकारची निर्मिती हवी आहे ते सांगा' असे दिसेल आणि एक काउंटर दिसेल, ज्यामध्ये तुम्ही किती प्रकार तयार करायचे आहेत ते निवडू शकता. तयार केलेले प्रकार एका समर्पित पॅनेलमध्ये दर्शविले जातील, जिथे तुम्ही ते पूर्वावलोकन करू शकता आणि तुमच्या आवडीचे प्रकार निवडू शकता.

गुणधर्म टॅब

पोझिशन (X, Y)

कॅनव्हासवरील घटकाची अचूक पिक्सेल पोझिशन सेट करा.

आकार (रुंदी, उंची)

घटकाचे परिमाण पिक्सेलमध्ये सेट करा.

झेड-इंडेक्स (लेयर ऑर्डर)

घटक इतरांच्या वर दिसतात की नाही ते नियंत्रित करा.

बॉर्डर त्रिज्या

कोनची वक्रता संख्यात्मक मूल्याने सेट करा किंवा शार्प, राउंडेड किंवा पिल प्रीसेट वापरा.

मजकूर सामग्री

घटकामध्ये प्रदर्शित मजकूर संपादित करा.

रंग टॅब

निवडलेल्या घटकासाठी पार्श्वभूमी, बॉर्डर आणि मजकूराचे रंग सानुकूलित करा.

फ्लो

फ्लो म्हणजे क्रिया आणि स्क्रीनमधील नेव्हिगेशन. फ्लो म्हणजे दुसरे पान उघडणे, मोडल उघडणे किंवा ॲपच्या वेगवेगळ्या भागात जाणे. कॅनव्हासवरील लहान लिंक आयकॉन दर्शवतात की कोणत्या घटकांमध्ये फ्लो जोडलेले आहेत. AI जनरेशन दरम्यान फ्रेम्स आपोआप जोडल्या जातात आणि फ्लो कनेक्शन तयार केले जातात.

फ्लो सेट करणे

1

एक घटक निवडा

फ्लो टॅब उघडा

2

फ्लो टॅब उघडा

कनेक्शन जोडा

3

कनेक्शन जोडा

बाउंडिंग बॉक्स हे रिव्हर्स इंजिनियरिंगचे मुख्य इंटरॲक्शन मॉडेल आहेत. प्रतिमा अपलोड केल्यानंतर, तुम्ही UI घटकांच्या भोवती आयताकृती बॉक्स काढता, ज्यामुळे ते वेगळे होतात. प्रत्येक बॉक्स एक निवडण्यायोग्य क्षेत्र बनतो, ज्यामध्ये तुम्ही कोड जनरेशनसाठी किंवा वर्तनासाठी काहीतरी परिभाषित करू शकता.

4

कॅनव्हासवर पहा

बाउंडिंग बॉक्सची शक्ती म्हणजे प्रत्येक घटकाला काय करायचे आहे हे निर्देशित करणे. बॉक्स निवडल्यानंतर, तुम्ही त्याला इंटरॲक्टिव्ह वर्तन देऊ शकता, जे जनरेट केलेल्या कोडमध्ये किंवा वायरफ्रेममध्ये प्रतिबिंबित होईल:

ब्लॉक कनेक्शन

वायरफ्रेम 'निर्यात', 'आयात' किंवा 'थेट वापर' केले जाऊ शकतात, जेव्हा तुम्ही प्रोजेक्ट तयार करता किंवा प्रोजेक्ट हबमध्ये काम करता. यामुळे, तुम्ही मॅन्युअली लेआउट पुन्हा तयार न करता, वायरफ्रेम डिझाइनमधून कार्यक्षम प्रोजेक्ट तयार करू शकता.

AI संपादन

साइडबारच्या शीर्षस्थानी '+' बटणावर क्लिक करून तुम्ही नवीन ब्लॉक गट तयार करू शकता. गटाला नाव द्या आणि त्यात कोणत्या प्रकारची सामग्री असेल हे दर्शविण्यासाठी ॲसेट प्रकार निवडा.

संदर्भावर आधारित प्रॉम्प्टिंग

सिंगल स्क्रीन

जेव्हा तुम्ही सिंगल स्क्रीन संपादित करता, तेव्हा प्रॉम्प्ट बार " 'स्क्रीनचे नाव' संपादित करत आहे" असे दर्शवते आणि AI मधील बदल फक्त त्या स्क्रीनवर लागू होतात.

स्टोरीबोर्ड

जेव्हा तुम्ही स्टोरीबोर्ड मोडमध्ये असता, तेव्हा AI एकाच वेळी सर्व फ्रेम्स संपादित करू शकते किंवा विद्यमान फ्रेम्स वापरून नवीन फ्रेम्स तयार करू शकते.

व्हॉइस इनपुट

प्रॉम्प्ट बारमधील मायक्रोफोन आयकॉन वापरा आणि टाइप करण्याऐवजी व्हॉइस वापरून सूचना द्या.

CLI संपादित करा

अधिक प्रगत संपादन मोडसाठी 'CLI संपादित करा' वर क्लिक करा, ज्यामुळे AI-आधारित बदलांवर अधिक नियंत्रण ठेवता येईल.

निर्यात आणि एकत्रीकरण

'पहा' वर क्लिक केल्यास, तपशीलवार मोड उघडेल, जिथे तुम्ही मजकूर आणि मार्कडाउन पूर्वावलोकन टॅबमध्ये सामग्री पूर्वावलोकन करू शकता आणि कच्चा मजकूर कॉपी करू शकता.

Kaiju Hub AI वर दिसणारे सर्व तृतीय-पक्ष लोगो, ट्रेडमार्क आणि ब्रँड नावे त्यांच्या संबंधित मालकांच्या मालमत्ता आहेत. त्यांचा वापर केवळ ओळखीसाठी आहे आणि समर्थन, प्रायोजकत्व किंवा संलग्नता सूचित करत नाही.