Flowstep và Figma là các công cụ bổ sung cho nhau, không phải là đối thủ cạnh tranh. Flowstep giúp bạn nhanh chóng tạo và khám phá các ý tưởng thiết kế UI; Figma là nơi bạn tinh chỉnh, cộng tác và xây dựng công việc sẵn sàng cho sản xuất. Sử dụng cả hai công cụ cùng nhau mang lại cho bạn những điều tốt nhất của cả hai.
Cách sao chép thiết kế Flowstep vào Figma
1
Chọn một hoặc nhiều màn hình trong Flowstep
Nhấp vào một màn hình để chọn nó — hoặc chọn nhiều màn hình để sao chép tất cả chúng cùng một lúc. Đảm bảo rằng lựa chọn được tô sáng trên canvas.
2
Sao chép lựa chọn
Nhấn **Cmd+**⇧+C trên Mac hoặc **Ctrl+**⇧+C trên Windows. Flowstep hiển thị “Preparing your design — stay on this tab and keep the screen selected” (Đang chuẩn bị thiết kế của bạn — hãy ở trên tab này và giữ màn hình được chọn) trong khi nó hoạt động; việc sao chép hoàn tất trong một khoảnh khắc.
3
Dán vào tệp Figma của bạn
Chuyển sang Figma và mở tệp nơi bạn muốn đặt thiết kế. Nhấn Cmd+V trên Mac hoặc Ctrl+V trên Windows để dán. Các màn hình Flowstep xuất hiện trên canvas Figma của bạn, sẵn sàng để chỉnh sửa.
Sao chép vào Figma sử dụng clipboard của trình duyệt của bạn, vì vậy trình duyệt phải cho phép Flowstep truy cập clipboard — nếu bạn thấy lỗi quyền hạn, cho phép quyền truy cập clipboard trong cài đặt trình duyệt của bạn và thử lại. Chuyển đổi tab giữa sao chép sẽ gián đoạn quá trình truyền; hãy giữ tab Flowstep trong tiêu điểm cho đến khi sao chép hoàn tất.
Nhập thiết kế từ Figma
Bạn cũng có thể làm theo cách ngược lại và đưa khung Figma vào Flowstep dưới dạng màn hình có thể chỉnh sửa. Nhập khẩu có sẵn cho mọi người — kết nối tài khoản Figma của bạn một lần, sau đó nhập từ liên kết khung.1
Kết nối Figma
Kết nối tài khoản Figma của bạn với Flowstep từ cài đặt của bạn. Flowstep sử dụng ủy quyền của Figma để đọc các tệp mà bạn có quyền truy cập.
2
Sao chép liên kết khung trong Figma
Trong Figma, nhấp chuột phải vào khung mà bạn muốn và chọn Copy link to selection (Sao chép liên kết vào lựa chọn). Bạn cũng có thể sao chép liên kết tới toàn bộ trang để nhập tất cả các khung cấp cao nhất của nó cùng một lúc.
3
Nhập vào Flowstep
Sử dụng tùy chọn nhập Figma trong thanh công cụ Flowstep và dán liên kết. Flowstep chuyển đổi khung thành các phần tử có thể chỉnh sửa trên canvas của bạn. Nhập lại cùng một khung sẽ cập nhật nó tại chỗ.
Những gì được nhập
Flowstep tạo lại khung Figma dưới dạng các phần tử gốc có thể chỉnh sửa — không phải hình ảnh phẳng. Một lần nhập mang lại:- Khung và các lớp lồng nhau của chúng
- Văn bản, bao gồm kiểu cách theo ký tự như trọng lượng, màu sắc và đậm
- Màu sắc từ biến Figma của bạn
- Tô điền hình ảnh và biểu tượng SVG và hình dạng
- Bóng thả và bóng bên trong, cũng như làm mờ lớp và nền
- Nét gạch và nét chấm
Tổ chức của tệp phải có Figma được kết nối. Nếu khung không nhập được, Flowstep sẽ hiển thị thông báo hành động cho bạn biết cần làm gì tiếp theo — ví dụ, kết nối lại Figma nếu ủy quyền của bạn đã hết hạn, chờ và thử lại nếu Figma đang giới hạn tốc độ hoặc phản hồi chậm, hoặc đối với mẫu Cộng đồng, sao chép nó sang nhóm của bạn trước rồi dán liên kết mới.