Flowstep ja Figma ovat toisiaan täydentäviä työkaluja, eivät kilpailijoita. Flowstep auttaa sinua nopeasti luomaan ja tutkimaan käyttöliittymäsuunnittelun ideoita; Figma on paikka, jossa hioitset, yhteistyötä ja rakennat tuotantovalmiita töitä. Molempien käyttö yhdessä antaa sinulle parhaan molemmista.
Kuinka kopioida Flowstep-suunnitelma Figmaan
1
Valitse yksi tai useampi näyttö Flowstepissa
Napsauta näyttöä sen valitsemiseksi — tai valitse useita näyttöjä kopioaksesi ne kaikki kerralla. Varmista, että valinta on korostettu kanvaasllla.
2
Kopioi valinta
Paina **Cmd+**⇧+C Macissa tai **Ctrl+**⇧+C Windowsissa. Flowstep näyttää “Preparing your design — stay on this tab and keep the screen selected” -viestin työskennellessään; kopiointi valmistuu hetkessä.
3
Liitä Figma-tiedostoon
Siirry Figmaan ja avaa tiedosto, johon haluat sijoittaa suunnitelman. Paina Cmd+V Macissa tai Ctrl+V Windowsissa liittääksesi. Flowstep-näytöt ilmestyvät Figma-kanvaasillesi, valmiina muokattaviksi.
Figmaan kopiointi käyttää selaimen leikepöytää, joten selaimen on sallittava Flowstepin leikepöydän käyttöoikeus — jos näet käyttöoikeusvirheen, salli leikepöydän käyttöoikeus selaimen asetuksissa ja yritä uudelleen. Välilehden vaihtaminen kopioinnin aikana keskeyttää siirron; pidä Flowstep-välilehti aktiivisena, kunnes kopiointi valmistuu.
Tuo suunnitelma Figmasta
Voit myös tehdä päinvastoin ja tuoda Figman kehyksen Flowstepiin muokattaviksi näytöiksi. Tuominen on käytettävissä kaikille — yhdistä Figma-tilisi kerran ja tuo sitten kehyslinkin avulla.1
Yhdistä Figma
Yhdistä Figma-tilisi Flowstepiin asetuksistasi. Flowstep käyttää Figman valtuutusta lukemaan tiedostot, joihin sinulla on pääsy.
2
Kopioi kehyslinkkiä Figmassa
Figmassa napsauta kehystä hiiren kakkospainikkeella ja valitse Copy link to selection. Voit myös kopioida linkin koko sivulle tuodaksesi kaikki sen ylätason kehykset kerralla.
3
Tuo Flowstepiin
Käytä Flowstep-työkalupalkin Figma-tuontivaihtoehto ja liitä linkki. Flowstep muuntaa kehyksen muokattaviksi elementeiksi kanvaasillasi. Saman kehyksen uudelleen tuominen päivittää sen paikoillaan.
Mitä tuodaan
Flowstep luo Figman kehyksen uudelleen alkuperäisinä, muokattavina elementteinä — ei tasaisena kuvana. Tuonti tuo mukaan:- Kehykset ja niiden sisäkkäiset tasot
- Tekstin, mukaan lukien per-merkki-tyylit, kuten paino, väri ja lihavointi
- Värit Figman muuttujistasi
- Kuvan täytöt ja SVG-kuvakkeet ja muodot
- Pudotus- ja sisäiset varjot sekä taso- ja taustamuut
- Katkoviivat ja pisteviivat vedot
Organisaation on oltava Figma yhdistettynä. Jos kehys ei tuonnu, Flowstep näyttää toimintaa sisältävän viestin, joka kertoo seuraavaksi tehtävät — esimerkiksi yhdistä Figma uudelleen, jos valtuutuksesi on vanhentunut, odota ja yritä uudelleen, jos Figma on nopeutusrajoituksella tai hidas vastaamaan, tai duplikoi Community-malli tiimillesi ja liitä uuden linkin.