Flowstep ve Figma tamamlayıcı araçlardır, rakip değildir. Flowstep, UI tasarım fikirlerini hızlı bir şekilde oluşturmanıza ve keşfetmenize yardımcı olur; Figma, üretime hazır işi iyileştireceğiniz, işbirliği yapacağınız ve geliştireceğiniz yerdir. Her ikisini birlikte kullanmak size en iyisini verir.
Flowstep tasarımını Figma’ya kopyalamak
1
Flowstep'te bir veya daha fazla ekran seçin
Bir ekrana tıklayarak seçin — veya hepsini aynı anda kopyalamak için birden fazla ekran seçin. Seçimin kanvas üzerinde vurgulandığından emin olun.
2
Seçimi kopyalayın
Mac’te **Cmd+**⇧+C veya Windows’ta **Ctrl+**⇧+C tuşlarına basın. Flowstep çalışırken “Tasarımınız hazırlanıyor. Geçerli sekmede kalın.” mesajını gösterir; kopyalama bir an içinde tamamlanır.
3
Figma dosyanıza yapıştırın
Figma’ya geçin ve tasarımı yerleştirmek istediğiniz dosyayı açın. Mac’te Cmd+V veya Windows’ta Ctrl+V tuşlarına basarak yapıştırın. Flowstep ekranları Figma kanvasında düzenlemek için hazır görünür.
Figma’ya kopyalama tarayıcınızın panosu aracılığıyla kullanılır, bu nedenle tarayıcı Flowstep pano erişimine izin vermelidir — izin hatasını görürseniz, tarayıcı ayarlarında pano erişimine izin verin ve yeniden deneyin. Kopyalama sırasında sekmeleri değiştirmek aktarımı kesintiye uğratır; kopyalama bitene kadar Flowstep sekmesini odakta tutun.
Figma’dan bir tasarımı aktarın
Ayrıca tersini yapabilir ve bir Figma çerçevesini Flowstep’e düzenlenebilir ekranlar olarak taşıyabilirsiniz. Aktarma herkes için kullanılabilir — Figma hesabınızı bir kez bağlayın, ardından bir çerçeve bağlantısından aktarın.1
Figma'yı bağlayın
Ayarlarınızdan Figma hesabınızı Flowstep’e bağlayın. Flowstep, erişiminiz olan dosyaları okumak için Figma’nın yetkilendirmesini kullanır.
2
Figma'da bir çerçeve bağlantısı kopyalayın
Figma’da taşımak istediğiniz çerçeveye sağ tıklayın ve Copy link to selection seçeneğini seçin. Tüm üst düzey çerçeveleri aynı anda aktarmak için bir sayfanın bağlantısını da kopyalayabilirsiniz.
3
Flowstep'e aktarın
Flowstep araç çubuğunda Figma aktarma seçeneğini kullanın ve bağlantıyı yapıştırın. Flowstep çerçeveyi kanvasınızda düzenlenebilir öğelere dönüştürür. Aynı çerçeveyi yeniden aktarmak yerinde günceller.
Ne aktarılır
Flowstep, bir Figma çerçevesini yerel, düzenlenebilir öğeler olarak yeniden oluşturur — düz bir görüntü değil. Bir aktarma şunları getiriyor:- Çerçeveler ve iç içe katmanlar
- Ağırlık, renk ve kalın gibi karakter başına stil dahil metin
- Figma değişkenlerinden renkler
- Görüntü doldurmalar, SVG simgeleri ve şekilleri
- Bırakma ve iç gölgeler, katman ve arka plan bulanıklığı
- Kesikli ve noktalı vuruşlar
Dosyanın organizasyonunun Figma bağlanmış olması gerekir. Bir çerçeve aktarılamadıysa, Flowstep ne yapmanız gerektiğini söyleyen eyleme geçirilir bir mesaj gösterir — örneğin, yetkilendirmenizin süresi dolduysa Figma’yı yeniden bağlayın, Figma oran sınırlaması yapıyorsa veya yanıt vermekte yavaşsa bekleyin ve yeniden deneyin veya bir Topluluk şablonu için bunun yerine takımınıza çoğaltın ve yeni bağlantıyı yapıştırın.