Käänteinen suunnittelu
Mikä on käänteinen suunnittelu?
Käänteinen suunnittelu on Kaiju Hub AIin rajauslaatikko-ohjattu kuva-koodiksi- ja kuva-luonnokseksi-työkalu. Lataa mikä tahansa kuva – kuvakaappaus, suunnittelumalli tai kuva käyttöliittymästä – ja käytä rajauslaatikoita tunnistaaksesi ja ohjataksesi, mitä kunkin kuvan elementin pitäisi tehdä. Muunna tulos toimivaksi koodiksi tai luonnoksen asetteluksi.
Käänteisen projektin luominen
Napsauta + Uusi käänteinen projekti -painiketta luodaksesi uuden projektin. Anna sille nimi ja kuvaus, jotta voit järjestää käänteisen suunnittelutyösi.
Miten se toimii
Lataa kuva
Lataa kuvakaappaus, suunnitelman luonnos tai mikä tahansa käyttöliittymän kuva käänteisen suunnittelun työkaluun.
Piirrä tai tunnista automaattisesti rajalaatikot
Piirrä rajalaatikot manuaalisesti käyttöliittymäelementtien ympärille tai käytä tekoälypohjaista automaattista rajalaatikoiden luontia, jotta elementit tunnistetaan automaattisesti. Jokainen laatikko korostaa kuvan erillisen komponentin.
Määritä elementin käyttäytyminen
Määritä jokaiselle rajalaatikolle, mitä sen pitäisi tehdä – esimerkiksi painikkeen napsauttaminen avaa modaali-ikkunan, navigointilinkki siirtyy toiselle sivulle tai kortti näyttää tiettyä sisältöä.
Luo koodi tai kehys
Muunna lisätty kuva toimivaksi komponenttikoodiksi kohdekehyksessäsi tai vie se kehysasetteluna, jota voit muokata edelleen kehystyökalussa.
Tärkeimmät ominaisuudet
Kuvan lataus
Vedä ja pudota tai selaa ladataksesi minkä tahansa kuvan – kuvakaappauksia, luonnoksia, valokuvia käsin piirretyistä luonnoksista tai olemassa olevista sovellusten käyttöliittymistä.
Rajaavan laatikon annotointi
Piirrä tarkat rajauslaatikot yksittäisten käyttöliittymäelementtien ympärille, jotta voit eristää ne koodin luontia tai käyttäytymisen määrittämistä varten.
Tekoälypohjainen automaattinen rajaus
Anna tekoälyn tunnistaa ja rajata käyttöliittymäelementit kuvassa automaattisesti, mikä säästää aikaa monimutkaisissa asetteluissa, joissa on paljon komponentteja.
Käyttäytymisen määrittäminen
Määritä käyttäytyminen rajatuille elementeille – määritä, mitä kunkin elementin napsauttaminen, siihen vieminen tai sen kanssa vuorovaikutuksessa toimiminen tulisi tehdä luodussa koodissa.
Kaksoistuloste
Luo joko toimiva koodi (kohdekehyksessäsi) tai luonnoksen asettelu, jota voit hienosäätää edelleen luonnoksen työkalussa.