Skip to main content
Screenshot 2026 05 06 At 14 19 04
Flowstep 旨在融入你已在使用的设计工作流中——而非替代它。你可以在 Flowstep 中生成设计，然后通过简单的复制粘贴立即将其引入 Figma，或反向操作，将 Figma 框架导入 Flowstep。这意味着你可以结合 AI 辅助设计生成的快速性与 Figma 中你依赖的精确性和协作功能。
Flowstep 和 Figma 是互补工具，不是竞争对手。Flowstep 帮助你快速生成和探索 UI 设计想法；Figma 是你优化、协作和构建生产就绪工作的地方。同时使用两者能给你最佳体验。

​
如何将 Flowstep 设计复制到 Figma

1

在 Flowstep 中选择一个或多个屏幕

点击一个屏幕来选择它——或选择多个屏幕以一次性复制所有屏幕。确保选择内容在画布上突出显示。
2

复制选择内容

在 Mac 上按 **Cmd+**⇧+C，在 Windows 上按 **Ctrl+**⇧+C。Flowstep 将显示 “Preparing your design — stay on this tab and keep the screen selected”（正在准备你的设计——请保持此标签页打开并保持屏幕选中）；复制会在片刻完成。
3

粘贴到你的 Figma 文件

切换到 Figma 并打开要放置设计的文件。在 Mac 上按 Cmd+V，在 Windows 上按 Ctrl+V 粘贴。Flowstep 屏幕出现在你的 Figma 画布上，准备编辑。
复制到 Figma 使用你浏览器的剪贴板，所以浏览器必须允许 Flowstep 剪贴板访问——如果你看到权限错误，在浏览器设置中允许剪贴板访问并重试。在复制过程中切换标签页会中断传输；请保持 Flowstep 标签页聚焦直到复制完成。
将框架粘贴到 Figma 中的专用”AI 导入”页面，以保持你的工作文件井然有序。从那里，你可以按自己的进度将元素移动到你的主设计系统或组件库中。

​
从 Figma 导入设计

你也可以反向操作，将 Figma 框架作为可编辑屏幕引入 Flowstep。导入对所有人开放——连接一次 Figma 账户，然后从框架链接导入。
1

连接 Figma

从你的设置中将 Figma 账户连接到 Flowstep。Flowstep 使用 Figma 的授权来读取你有访问权限的文件。
2

在 Figma 中复制框架链接

在 Figma 中，右键点击你想要的框架，选择 Copy link to selection。你也可以复制指向整个页面的链接，以一次性导入该页面上的所有顶级框架。
3

导入到 Flowstep

使用 Flowstep 工具栏中的 Figma 导入选项并粘贴链接。Flowstep 将框架转换为你画布上的可编辑元素。重新导入相同框架会就地更新它。

​
导入的内容

Flowstep 将 Figma 框架重新创建为本地、可编辑的元素——而非平坦图像。导入会带来：
  • 框架及其嵌套层
  • 文本，包括按字符样式如权重、颜色和粗体
  • 来自你 Figma 变量的颜色
  • 图像填充、SVG 图标和形状
  • 投影、内阴影以及图层和背景模糊
  • 虚线和点线笔画
该文件的组织必须已连接 Figma。如果框架无法导入，Flowstep 会显示一条可操作的消息，告诉你下一步该做什么——例如，如果你的授权已过期，请重新连接 Figma；如果 Figma 速率限制或响应缓慢，请等待并重试；或者对于社区模板，先将其复制到你的团队，然后粘贴新链接。