WARNING

本文档由 AI 自动翻译，仅供参考。涉及关键操作或信息时，请以英文原文为准。

使用 Open Design 创建设计文件 — Olares 1.12.6

适用 Olares 版本: 1.12.6▾

Olares 1.12.7+Olares 1.12.6

Open Design 是一款开源 AI 设计工作室，可以将自然语言需求转化为可直接使用的设计文件。它通过内置的 OpenCode 调用你配置的模型，生成可预览的 HTML 原型、落地页、仪表盘、线框图和幻灯片。

在 Olares 上，你可以通过 Model Console 将 Open Design 连接到本地模型，也可以使用云端模型的 API Key。每个项目集中保存提示词、参考素材、预览和生成文件，方便你持续调整并导出最终设计。

当前输出限制

Olares 上的 Open Design 0.22.1 暂不支持通过文本直接生成独立图片。请用它创建页面、原型、仪表盘或幻灯片。

学习目标

在本指南中，你将学习如何：

• 在 Olares 上安装 Open Design。
• 通过 OpenAI 兼容 API 连接本地模型。
• 创建、调整和导出设计项目。
• 排查常见的模型连接和生成问题。

前提条件

开始前，你需要：

• Olares 1.12.6 或更高版本。

• 以下模型：

  模型类型	模型	获取方式
  对话	Qwen3.6-27B (llama.cpp)	从 Market 安装

可选：使用其他模型

你也可以选择不同大小的模型，或改用其他模型提供商：

• 从应用市场安装其他模型应用。
• 通过引擎基座应用创建模型实例，使用自己的模型。

如果 AI Agent 应用已安装 Olares CLI 和 Agent Skills，可以让它部署模型并跳过手动设置。例如：

使用 Ollama 引擎基座在我的 Olares 上部署 qwen3.5:9b。

安装 Open Design

1. 打开 Market，搜索 "Open Design"。
2. 点击 Get，然后点击 Install，等待安装完成。

连接本地模型

获取模型连接信息

模型连接的工作原理

Olares 上的独立模型作为与客户端应用分开的服务运行。要连接两者，客户端需要准确的 Model name，以及与其所需 API 格式相匹配的 Base URL。

你可以从模型控制台获取这两个值。有关更多信息，可参阅连接 AI 应用。

本指南使用 OpenAI-Compatible API 格式，将 Open Design 连接到 Qwen3.6-27B (llama.cpp)：

1. 从启动台打开模型应用。其模型控制台会自动打开。

2. 等待模型显示就绪，且引擎显示运行中。

   

3. 在模型部分，按显示内容原样复制模型名称。

4. 在引擎部分：

   a. 连接来源：选择 Olares 内应用。

   b. API 格式：选择 OpenAI-Compatible。

   c.按显示内容原样复制 Base URL 地址。

在 Open Design 中添加模型

1. 从启动台打开 Open Design。

2. 打开 Settings。在 Models & providers 页面选择 API provider。

3. 在 Provider preset 中选择 Custom provider。

4. 配置提供方：

   • Base URL：粘贴从 Model Console 复制的 Base URL，包括末尾的 /v1。
   • API Key：输入任意非空值，例如 olares。同一 Olares 集群中的应用调用本地模型时，不需要真实密钥。
   • Model：输入从 Model Console 复制的完整 Model name。
   • Max tokens（可选）：输入 65536。如需使用更小的上下文窗口，可改为 32768。

5. 点击 Test 检查连接。显示绿色的 Connected 状态表示连接成功。修改会自动保存。

先做小规模测试

开始制作多页幻灯片或落地页之前，先让 Open Design 生成一张封面幻灯片。预览成功后，说明 Base URL、模型名称和 token 上限可以正常配合使用。

创建设计项目

1. 在首页选择项目类型，例如 Prototype、Slide deck、Document 或 Website clone。

2. 选择符合任务需求的 Skill 预设，例如 Blog Post。也可以打开提示词下方的示例，将它作为起点。

3. 根据需要选择 Design system 和 Working directory。

4. 输入具体需求。建议说明目标受众、内容、视觉风格和输出格式。例如：

   为产品发布会制作一张封面幻灯片。
   使用深色背景、醒目的几何字体和青绿色点缀。
   产品名称为“Northstar”，副标题为“Find your next move.”。

5. 确认已选择目标模型，然后点击箭头开始生成。

6. 等待工作区打开并显示预览。

7. 在对话中继续调整结果。你可以拖入参考图片，或输入 @ 添加项目文件，然后说明要修改的部分。

8. 完成后打开导出菜单，根据项目类型下载 ZIP、PDF 或 PPTX 文件。

可选：连接云端模型

你也可以使用云端模型。打开设置，在模型与提供商页面选择 API 提供方，然后选择提供商预设，或使用匹配的协议、Base URL、API Key 和模型配置自定义提供方。

提供商	协议	Base URL
OpenAI	OpenAI	https://api.openai.com/v1
OpenRouter	OpenAI	https://openrouter.ai/api/v1
DeepSeek	OpenAI	https://api.deepseek.com
Anthropic	Anthropic	https://api.anthropic.com
通义 Qwen	OpenAI	https://dashscope.aliyuncs.com/compatible-mode/v1
硅基流动	OpenAI	https://api.siliconflow.cn/v1
Kimi	OpenAI	https://api.moonshot.cn/v1

云端模型的调用费用由所选提供商收取。请使用该提供商的完整模型名称和有效 API Key。

故障排查

连接测试失败或返回 404

重新复制 Model Console 中的 Base URL，不要修改路径。本指南使用本地模型时，需要在 Model Console 中选择 OpenAI-Compatible，并原样使用显示的 URL，包括 /v1。

设计尚未生成完成便停止

将**最大 tokens（可选）**设置为 65536 或 32768。多页幻灯片需要的输出 token 比单页或封面幻灯片更多。

Open Design 一直没有响应

返回模型应用的 Model Console。确认模型显示就绪，且引擎显示运行中后再继续。

Open Design 使用了错误的模型

比较 Open Design 中的模型与 Model Console 中的 Model name。两者必须完全一致。

Open Design 无法生成独立图片

这是 Olares 上 Open Design 0.22.1 的当前限制。请改用页面、幻灯片、仪表盘、线框图或交互式原型对应的 Skill。

了解更多

• 使用引擎基座应用托管本地大语言模型：通过 Model Console 部署和管理模型。
• 将 AI 应用连接到模型服务：了解模型名称、API 格式和 Base URL。
• Open Design 官网：了解上游项目及其功能。