Flowstep a Figma jsou vzájemně se doplňující nástroje, nikoli konkurenti. Flowstep vám pomáhá rychle generovat a zkoumat nápady na návrhy uživatelského rozhraní. Figma slouží k vylepšování, spolupráci a vytváření produkčně připravené práce. Použití obou nástrojů dohromady vám dá to nejlepší z obou světů.
Jak zkopírovat návrh z Flowstepu do Figmy
1
Vyberte jednu nebo více obrazovek ve Flowstepu
Klikněte na obrazovku, abyste ji vybrali, nebo vyberte více obrazovek a zkopírujte je všechny najednou. Ujistěte se, že je výběr na plátně zvýrazněný.
2
Zkopírujte výběr
Stiskněte **Cmd+**⇧+C na Macu, nebo **Ctrl+**⇧+C ve Windows. Flowstep během práce zobrazuje hlášení „Preparing your design. Stay on the current tab.“ (Připravujeme váš návrh. Zůstaňte na aktuální kartě.). Kopírování se za okamžik dokončí.
3
Vložte do souboru ve Figmě
Přepněte se do Figmy a otevřete soubor, do kterého chcete návrh umístit. Stiskněte Cmd+V na Macu, nebo Ctrl+V ve Windows. Obrazovky Flowstepu se objeví na plátně ve Figmě, připravené k úpravám.
Kopírování do Figmy používá schránku vašeho prohlížeče, proto musí prohlížeč Flowstepu povolit přístup ke schránce. Pokud se zobrazí chyba oprávnění, povolte přístup ke schránce v nastavení prohlížeče a zkuste to znovu. Přepnutí karet během kopírování přenos přeruší, takže nechte kartu Flowstepu aktivní, dokud se kopírování nedokončí.
Import návrhu z Figmy
Můžete také postupovat opačně a importovat rámec z Figmy do Flowstepu jako upravitelné obrazovky. Import je dostupný všem. Připojte jednou svůj účet Figma a poté importujte podle odkazu na rámec.1
Připojte Figmu
Připojte svůj účet Figma k Flowstepu v nastavení. Flowstep používá autorizaci Figmy ke čtení souborů, ke kterým máte přístup.
2
Zkopírujte odkaz na rámec ve Figmě
Ve Figmě klikněte pravým tlačítkem na rámec, který chcete, a zvolte Copy link to selection. Můžete také zkopírovat odkaz na celou stránku a importovat všechny její rámce nejvyšší úrovně najednou.
3
Importujte do Flowstepu
V panelu nástrojů Flowstepu použijte možnost importu z Figmy a vložte odkaz. Flowstep převede rámec na upravitelné prvky na vašem plátně. Každý import přidá novou obrazovku. Opětovný import stejného rámce předchozí import nenahradí, takže pokud už starou obrazovku nepotřebujete, smažte ji.
Co se importuje
Flowstep znovu vytvoří rámec z Figmy jako nativní, upravitelné prvky, a ne jako plochý obrázek. Import přenese:- Rámce a jejich vnořené vrstvy
- Text, včetně stylů na úrovni jednotlivých znaků, jako je tloušťka, barva a tučné písmo
- Barvy z vašich proměnných ve Figmě
- Výplně obrázků, SVG ikony a tvary
- Vržené a vnitřní stíny a rozostření vrstev a pozadí
- Přerušované a tečkované tahy
Organizace, ke které soubor patří, musí mít připojenou Figmu. Pokud se rámec neimportuje, Flowstep zobrazí zprávu s konkrétním návodem, co dál. Může vám například poradit, abyste znovu připojili Figmu, pokud vypršela autorizace, abyste počkali a zkusili to znovu, pokud Figma omezuje počet požadavků nebo reaguje pomalu, nebo abyste u šablony z komunity nejdřív duplikovali šablonu do svého týmu a vložili nový odkaz.