> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowstep.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# 如何在没有设计经验的情况下使用 Flowstep

> 您无需设计背景即可使用 Flowstep 创建出色的 UI 屏幕。了解如何描述您想要的内容，让 Flowstep 完成其余工作。

您无需了解字体和字型之间的区别、理解网格系统或曾经打开过设计工具。Flowstep 会自动处理布局、排版、颜色、间距和视觉层次 — 您的工作就是简单地描述您想要的内容。

## 无需设计技能如何工作

当您输入提示词时，Flowstep 会解释您的描述并做出设计师通常会做的所有视觉决策：如何在屏幕上排列元素、使用哪些字体、添加多少空白以及如何建立引导眼睛的视觉层次。您描述目的和内容；Flowstep 生成看起来像专业设计的屏幕。

<Tip>
  将向 Flowstep 输入提示词的方式想象成与设计师沟通的方式。您不会告诉设计师使用哪种字体大小 — 而是告诉他们屏幕的用途以及它需要传达什么。Flowstep 的工作方式相同。
</Tip>

## 编写好的提示词的提示

关注三件事：屏幕的目的、它应该显示的关键信息以及产品或受众的类型。

**以屏幕的目的开头**

从屏幕应该做什么开始。"餐饮计划应用的注册屏幕"比 UI 元素列表能告诉 Flowstep 更多信息。

**提及关键内容或操作**

包含用户应该看到或做的最重要的事情。您不需要列出所有内容 — 只需列出对体验最重要的元素。

**如果有帮助，请参考产品类型或受众**

提及产品的类型（例如，消费类移动应用、B2B 仪表板、电子商务结账）有助于 Flowstep 匹配正确的视觉语调和约定。

<Tip>
  如果您的第一个结果不完全正确，不要重新开始 — 只需输入后续提示词。说"让布局更简约"或"使用更深的配色方案"足以将设计引导到新的方向。
</Tip>

## 可以尝试的示例提示词

以下是一些效果很好的提示词，用简单的英文编写，没有设计术语：

**健身应用的入职流程**

> "First screen of an onboarding flow for a fitness tracking app. It should welcome the user, briefly explain what the app does, and have a button to get started."

**SaaS 产品的设置页面**

> "Settings page for a B2B project management tool. Include sections for profile, notifications, billing, and connected accounts. Use a clean, professional look."

**移动结账屏幕**

> "Checkout screen for a mobile shopping app. Show an order summary, a field for a promo code, and a prominent button to complete the purchase."

<Note>
  这些提示词之所以有效，不是因为它们使用设计语言，而是因为它们清楚地描述了屏幕的目的、内容和背景。这就是您需要的全部内容。
</Note>