通过聊天或画布编辑和迭代 Flowstep 设计

Flowstep 设计在生成后完全可编辑。您不会被 AI 最初生成的结果所限制 — 您可以在编辑器中直接调整视觉效果，使用聊天用自然语言描述更改，或要求 Flowstep 生成变化版本和新屏幕。根据您想要进行的更改，选择最合适的方法。

​

两种编辑方式

​

仅编辑屏幕的一部分

您不必编辑整个屏幕。选择子元素 — 一张卡片、一个按钮、一个文本标签 — 您的聊天提示词将仅应用于该元素，保留屏幕的其余部分不变。

• 使用 Shift+V (或选择工具栏按钮上的下拉菜单)切换到直接选择模式，以选择单击下的最深层元素。按 V 进行普通选择，或按住 Cmd (Mac) / Ctrl (Windows) 临时使用直接选择。按 Escape 退出直接选择。
• 使用 Cmd+Shift 跨多个屏幕选择子元素 — 单个提示词可以编辑每条消息中最多 6 个屏幕。

选中图像元素时(在线框模式之外)，属性面板中会显示图像面板：预览图像、通过将新图像文件拖到预览上或单击选择图像来交换图像，或使用下载图像保存图像。

​

复制和粘贴元素

复制选区，然后将其粘贴到需要的位置 — 可以在同一文件中、其他文件中，或在另一个浏览器标签页中粘贴，因为复制内容会进入您的系统剪贴板。

• 使用 Cmd+C (Mac) / Ctrl+C (Windows) 复制，使用 Cmd+X / Ctrl+X 剪切，使用 Cmd+V / Ctrl+V 粘贴。
• 使用 Cmd+D / Ctrl+D 在原位 创建副本 选区。
• 粘贴的元素会稍微偏离原始元素的位置，以免覆盖它们。

这些快捷键作用于所选元素；编辑文本时，它们会退回为普通的文本复制和粘贴。

​

为画布上的屏幕命名

每个屏幕都会在画布上方的标签中显示其名称。尚未命名的屏幕显示为 Screen。

• 双击 标签以重命名屏幕，然后按 Enter 保存 — 单击其他位置也会保存。名称最多可包含 100 个字符。
• 单击 标签一次以选中屏幕，然后拖动即可在画布上移动它。

​

调整不透明度、混合模式和圆角

选择元素后，在属性面板中微调其外观：

• Opacity (不透明度) — 设置元素的透明程度，范围为 0 到 100%。同一面板还包含混合模式（Normal、Multiply、Screen、Overlay 等），用于控制元素与其后方内容的混合方式。
• Corners (圆角) — 圆化元素的边角。为四个角设置统一的 Corner radius (圆角半径)，或开启 Per corner (逐角设置)，为左上、右上、右下和左下角分别设置圆角半径。每个值可以是主题中的 Token (令牌)，也可以是 Custom (自定义) 数值。

​

缩放至像素级

将画布缩放至最高 25,600%，以仔细检查间距和对齐。超过 200% 后，会出现像素对齐的网格线，并且您放大得越多，网格线越明显，因此您可以精确对齐元素。

​

恢复以前的版本

聊天历史中的每个 AI 生成都会保留其原始结果。如果屏幕自生成后已被编辑或删除，其聊天消息会显示恢复按钮 — 单击恢复原始以还原编辑，或恢复 / 恢复全部以恢复删除的屏幕。当编辑朝着错误的方向进行时，使用它返回已知的良好状态。 将鼠标悬停在聊天面板中的任何消息上以查看发送时间。最近的消息显示时间；较早的消息显示发送以来经过多长时间(例如”1 天前”)，工具提示中显示完整的日期和时间。

​

一键操作

除了直接编辑之外，您还可以要求 Flowstep 探索替代方案：

• 从头开始重试 — 要求 Flowstep 以不同的布局或视觉方向生成当前屏幕的新版本。
• 显示下一个屏幕 — 要求 Flowstep 生成用户流程中逻辑上的下一步。
• 让它看起来漂亮 — 调整整个设计中的间距、对齐和颜色。布局保持不变。

这些选项使您可以快速迭代，无需每次都编写提示词。

​

迭代以精细调整

设计很少在第一次尝试时就完全正确。对于每轮反馈，使用基于聊天的编辑 — 描述什么有效以及什么无效，Flowstep 从那里进行调整。您可以无限次地迭代屏幕。