编写提示词

描述界面

像给设计师写简报一样，说明这个界面的用途和其中包含的内容。Vibr 会填充逼真的示例内容，因此你无需自己撰写文案。

• 好： “一个包含 KPI 卡片和最近订单表格的分析仪表板”
• 更好： “一个咖啡烘焙商的分析仪表板：四张分别展示收入、订单数、平均订单金额和回头客的 KPI 卡片，一个每周收入图表，以及一个带状态标签的最近订单表格”

按 Enter 发送，按 Shift+Enter 换行。在触摸屏上，回车键用于换行，点击 发送 按钮发送。

如果请求过于模糊而无法规划，Vibr 会向你提问，而不是盲目猜测。在输入框中回答后，运行会从该处继续。

Vibr 只设计界面。没有可构建内容的请求（例如常识问题或写作文）会收到一行回复，并附上一个你可以改为构建的界面建议，规划之后的步骤不会运行。任何可以做成页面、应用或界面的内容，无论什么主题，都会照常构建。工作区中有草稿时，你也可以就草稿提问（“为什么用这个字体？”“这个对比度符合无障碍要求吗？”），Vibr 会在聊天中回答，不会改动草稿。

从图片开始

有草图、截图或样稿？把它添加到请求中，Vibr 会根据图片内容来构建。选择输入框下方的 +，然后选择添加文件，或者将图片粘贴或拖放到输入框中。每次请求最多可添加三张，格式为 PNG、JPEG、WebP、GIF、AVIF 或 SVG。

• “把这张草图做成注册页面”
• “沿用这张截图的布局，换成自行车店的内容”
• 只发送图片、不写文字时，Vibr 会构建图片所展示的内容。

草稿使用你的设计系统自带的组件和字体，因此会遵循图片的布局和层级，而不是照搬像素。图片中的文字会被当作内容，绝不会被当作指令。

每张图片在发送前都会被缩小并重新绘制，从而去除元数据，并且会像添加到资源库的图片一样在你的设备上接受检查。它只会随这一次请求发送给你的 AI 服务商。它不会保存到资源库，也不会随对话保留，因此后续请求不会再次发送它。

附加文档

简报、研究笔记、设计挑战、上季度的数据：附加文档后，Vibr 会据此进行设计。选择输入框下方的 +，然后选择添加文件，或者将文档粘贴或拖放到输入框中。每次请求最多可附加三个文档：

• PDF
• Word、PowerPoint 和 Excel（.docx、.pptx、.xlsx）
• CSV、TSV、Markdown 和纯文本

对于 Google 文档、幻灯片或表格，请先以其中一种格式下载文件（文件，然后下载）。

Vibr 在你的浏览器中读取每个文档。模型会收到文档的文本（包括演示文稿的演讲者备注，以及以表格形式呈现的电子表格行），以及少量图片：PDF 的前几页，或 Word 文件、演示文稿中的前几张图片。每次请求最多发送 30,000 个字符的文本；超出部分会被截断，标签上会注明。选择文档的标签即可查看实际发送的内容，也可以将其中的图片保存到资源库。 要在以后的请求中再次使用某个文档，请在其预览中选择保存到资源库，然后用 @doc 引用它。

每个文档在读取前都会经过检查。可以运行宏的文件（.docm、.pptm、.xlsm，或隐藏了宏项目的文档）、解压后会远超其大小的压缩包，以及受密码保护的 PDF 都会被拒绝。文档中的任何内容都不会运行：脚本、链接、表单字段、公式和嵌入对象都会被忽略，电子表格的单元格以其保存的值读取。文本会像你输入的内容一样经过清理和内容检查，图片会像参考图片一样经过检查，模型也会被告知把文档当作设计素材，而绝不当作指令。

文档只随那一次请求发送。它不会保存到资源库，也不会随对话保留。

修改现有内容

草稿生成后，输入框会显示“描述要优化的地方或要新增的部分…”。每条请求都会修改画布上的草稿并生成一个新版本，因此你随时可以回退。例如：

• “让 Pro 套餐更醒目，并添加常见问题”
• “在桌面端使用两栏布局”
• “在手机上把表格换成卡片”

在编写新版本期间，当前草稿会保留在画布上；新版本有足够内容可以绘制时，画布就会切换过去。

只修改某一部分

要修改某个元素而不影响其他部分：

1. 点击 选择元素（画布上方的指针图标）。
2. 点击你要修改的部分。输入框上方的标签会显示所选元素及其在代码中的位置。
3. 描述修改内容。“这个”“这里”和“它”等词都指该元素。

按 Esc 停止选择，或点击标签上的 X 清除选择。

如果元素在页面上重复出现（比如列表中的卡片，或每个价格方案里的标题），标签下方会出现一个选项：仅此一个 只更改你点击的那一份，全部 N 个 会更改所有副本。默认是“仅此一个”。画布会框出将要更改的副本。

一起修改多个部分

按住 Shift 再点击其他元素，可在一次请求中一起修改，最多 8 个。工作区中每个元素都会显示编号，标签里会列出它们。然后描述它们之间的关系，例如“让它们一致”或“给它们相同的间距”。再次按 Shift 点击已选元素即可移除。

在触屏上，选择标签上的添加更多，然后点按元素。使用键盘时，在获得焦点的元素上按 Shift+Enter。每个添加的元素只算你选中的那一个副本。位于已选元素内部的元素已经包含在内，不会重复添加。

使用 @ 引用素材

在输入框中输入 @，或点击 @ 按钮，即可将资源库中的内容加入请求。输入时会出现一个列表。用 ↑ 和 ↓ 选择，按 Enter 或 Tab 添加。

引用	引入的内容
@image/name	你导入的图片，或从 Unsplash 保存的图片。
@video/name	你导入的视频，或从 Pixabay 保存的视频。
@theme/name	一个颜色主题，包含浅色和深色模式。
@type/ramp/style	你的某套字体层级中的一个文字样式，例如 @type/georgia/h1。
@icon/name	一个内置的 Lucide 图标，或你导入的图标字体中的图标（@icon/set/name）。
@screen/name	要链接到的已保存原型。请参阅流程。
@chart/kind	一种图表，例如 @chart/donut，使用你的图表库构建。请参阅图表和表格。
@table/feature	一种表格功能，例如 @table/sortable，使用你的表格库构建。

请求中的引用会以标签形式显示在输入框下方。如果某个名称不在你的资源库中，标签会变为红色，Vibr 会忽略该引用。要了解如何添加素材，请参阅图片、视频、文档、主题、字体与图标。

获得更好结果的技巧

• 每条请求一个界面。 先构建一个页面，再逐步添加内容。过大的请求可能会达到模型的输出上限；如果出现这种情况，请每条消息只请求一个区块。
• 说出各部分的名称。 “套餐卡片”或“页头”比“上面那块”更容易处理。
• 使用合适的工具。 只改一个元素时，先选中它。需要保留的备注，请标记为批注。