尧图网络 高端网站定制 · 原创设计
免费咨询热线
400-888-6620
免费获取方案
在 Olares 上使用 Open Design:用本地大模型从提示词生成 HTML 原型、落地页与幻灯片
云原生后端运维【免费下载链接】TerminusOpen-Source Personal Cloud OS for Always-On Agents项目地址https://gitcode.com/gh_mirrors/terminus2/Terminus点击查看免费下载Open Design 是一款开源 AI 设计工作室本指南面向 Olares 1.12.6 用户讲解如何将它与本地大模型如 Market 安装的 Qwen3.6-27B或云端模型接通把自然语言需求转化为可预览、可导出的设计文件。读完本文你将掌握从安装、模型连接、项目创建到迭代导出的完整工作流并能独立排查常见的连接与生成问题。Open Design 能做什么Open Design 的核心能力是把自然语言设计需求转化为可直接使用的设计文件。它的工作方式与普通 AI 绘画工具不同它通过内置的 OpenCode Agent 调用你配置的模型由 Agent 以编程方式产出可预览的 HTML 原型、落地页、仪表盘、线框图和幻灯片而非生成一张位图。在 Olares 上你可以用两种方式为 Open Design 供能本地模型通过 Model Console 连接 Olares 内运行的模型服务数据不出设备无需付费 API。云端模型使用 OpenAI、Anthropic、DeepSeek 等提供商的 API Key。每个设计项目都会集中保存提示词、参考素材、预览和生成文件方便你在对话中持续调整最终导出成品。:::warning 当前输出限制 Olares 上的 Open Design 0.22.1 暂不支持通过文本直接生成独立图片。请用它创建页面、原型、仪表盘或幻灯片而不是当作文生图工具使用。 :::前提条件开始前你需要准备Olares 1.12.6 或更高版本。对话模型推荐从 Market 安装预构建的Qwen3.6-27B (llama.cpp)模型应用。模型类型模型获取方式对话Qwen3.6-27B (llama.cpp)从 Market 安装理解模型连接的工作原理在 Olares 中独立的模型应用是作为与客户端应用分离的服务运行的。要把两者连接起来客户端需要拿到两样东西来源模型连接复用文档Model name精确的模型名称Base URL与客户端所需 API 格式相匹配的地址。这两个值都可以从模型应用的 Model Console模型控制台中获得。可选使用其他模型你也可以换用其他模型大小或提供商来源模型连接复用文档从 Market 安装其他模型应用通过引擎基座应用创建模型实例带入自己的模型。如果你的 AI Agent 应用已安装 Olares CLI 和 Agent Skills还可以直接让 Agent 代为部署模型跳过手动设置例如使用 Ollama 引擎基座在我的 Olares 上部署 qwen3.5:9b。安装 Open Design打开Market应用市场搜索Open Design。点击Get再点击Install等待安装完成。安装完成后Open Design 会出现在启动台Launchpad中与模型应用并列。连接本地模型第一步从 Model Console 获取连接信息从启动台打开模型应用本例为 Qwen3.6-27B其Model Console会自动打开。等待Model显示就绪READY、Engine显示运行中RUNNING再继续后续操作。如果引擎尚未就绪请参考使用 Engine Base 运行本地大模型中的状态检查方法。在Model部分按显示内容原样复制 Model name。不要缩写也不要删除仓库前缀如unsloth/或量化标签如UD-Q4_K_XL否则客户端可能报错Model not found。在Engine部分配置连接方式来源模型连接复用文档a.连接来源Connection source选择Olares 内应用Apps in Olares因为 Open Design 与模型运行在同一个 Olares 集群中b.API 格式API format选择OpenAI-Compatible这是 Open Design 使用的接口风格c.按显示内容原样复制 Base URL包括末尾的/v1路径。提示连接来源决定客户端请求从哪里发出。若客户端在 Olares 内运行却选择了局域网设备或远程来源Model Console 给出的 Base URL 将不匹配连接测试会失败。第二步在 Open Design 中添加模型从启动台打开 Open Design。打开Settings设置在Models providers模型与提供商页面选择API providerAPI 提供方。在Provider preset提供商预设中选择Custom provider自定义提供商。配置提供方配置项填写内容说明Base URL粘贴从 Model Console 复制的 Base URL必须包含末尾的/v1例如https://.../v1API Key任意非空值例如olares同一 Olares 集群内的应用调用本地模型时不需要真实密钥Model输入从 Model Console 复制的完整 Model name必须与 Model Console 完全一致Max tokens可选65536如需更小的上下文窗口可改为32768点击Test检查连接。显示绿色的Connected状态即表示连接成功。修改会自动保存。:::tip 先做小规模测试 在开始制作多页幻灯片或落地页之前先让 Open Design 生成一张封面幻灯片。预览成功后说明 Base URL、模型名称和 token 上限可以正常配合使用。 :::为什么本地模型不需要真实 API Key从源码看Olares 通过应用网关mesh-in 机制管理集群内应用之间的调用关系。以 decide.go 中的Decide逻辑为例应用清单中声明的共享调用方shared caller会获得注入的访问凭证从而让同一集群内的应用可以相互访问服务connect-ai-apps 最佳实践也明确说明本地部署的 AI 服务应用信任来自同一集群内其他应用的请求因此 API Key 只需是非空占位符即可。创建设计项目模型连接成功后就可以开始创建设计项目在首页选择项目类型例如Prototype原型、Slide deck幻灯片、Document文档或Website clone网站克隆。选择符合任务需求的Skill 预设例如Blog Post博客文章。也可以打开提示词下方的示例把它作为起点。根据需要选择Design system设计系统和Working directory工作目录。输入具体需求。建议在提示词中说明目标受众、内容、视觉风格和输出格式。例如为产品发布会制作一张封面幻灯片。 使用深色背景、醒目的几何字体和青绿色点缀。 产品名称为“Northstar”副标题为“Find your next move.”。确认已选择目标模型即上一步配置的 Qwen3.6-27B然后点击箭头按钮开始生成。等待工作区打开并显示预览。在对话中继续调整结果。你可以拖入参考图片作为视觉参考输入添加项目文件然后说明要修改的具体部分。完成后打开导出菜单根据项目类型下载ZIP、PDF 或 PPTX文件。工作流建议把每个项目视为一次持续迭代。首轮生成先验证方向布局、配色、内容结构再通过对话逐条修正最后导出成品。项目文件会与提示词、参考素材集中保存下次可以继续调整。可选连接云端模型除了本地模型你也可以连接云端提供商。打开Settings在Models providers页面选择API provider然后选择提供商预设或使用匹配的协议、Base URL、API Key 和模型配置自定义提供方。提供商协议Base URLOpenAIOpenAIhttps://api.openai.com/v1OpenRouterOpenAIhttps://openrouter.ai/api/v1DeepSeekOpenAIhttps://api.deepseek.comAnthropicAnthropichttps://api.anthropic.com通义 QwenOpenAIhttps://dashscope.aliyuncs.com/compatible-mode/v1硅基流动OpenAIhttps://api.siliconflow.cn/v1KimiOpenAIhttps://api.moonshot.cn/v1云端模型的调用费用由所选提供商收取。请使用该提供商的完整模型名称和有效 API Key不要复用本地模型时使用的占位符。故障排查连接测试失败或返回 404重新复制 Model Console 中的 Base URL不要修改路径。使用本地模型时需要在 Model Console 中选择OpenAI-Compatible并原样使用显示的 URL包括/v1。如果省略了/v1或改动了路径服务端无法路由到模型接口就会返回 404。设计尚未生成完成便停止将Max tokens可选设置为65536或32768。多页幻灯片需要的输出 token 比单页或封面幻灯片更多token 上限不足会导致生成中途截断。Open Design 一直没有响应返回模型应用的 Model Console确认Model显示就绪、Engine显示运行中后再继续。引擎未就绪时请求会长时间挂起。Open Design 使用了错误的模型比较 Open Design 中的Model值与 Model Console 中的Model name。两者必须完全一致包括仓库前缀和量化标签。缩写或省略任何一部分都可能导致客户端回退到默认模型或报错。Open Design 无法生成独立图片这是 Olares 上 Open Design 0.22.1 的当前限制。请改用页面、幻灯片、仪表盘、线框图或交互式原型对应的 Skill。深入理解模型服务在 Olares 中的落地方式把 Open Design 连接到本地模型的过程实际上依赖 Olares 1.12.6 的Model Console与应用网关两层机制Model Console 负责模型生命周期从 Market 安装的 Qwen3.6-27B (llama.cpp) 是一个独立的模型服务应用通过 Model Console 可以查看模型与引擎的就绪状态、选择连接来源与 API 格式并自动生成匹配的 Base URL。更完整的部署方式参见使用 Engine Base 运行本地大模型——你可以从 Ollama、vLLM、llama.cpp、SGLang 四种引擎基座中克隆实例用MODEL_NAME、ENGINE_ARGS等环境变量定义模型对外暴露的名称与上下文长度如-c 65536。应用网关负责集群内互访模型应用向同集群客户端暴露服务时其清单中的LLMGatewaySupported等选项会被 Olares 解析并生成网关路由。相关字段定义可见 application.go 与 app.go其校验逻辑位于 validate.go。在 decide.go 中应用间调用遵循先显式声明、再规则匹配、共享应用默认放行的决策顺序这正是 Open Design 这类客户端应用无需真实 API Key 即可调用本地模型的底层原因。理解了这两层机制你就能推断任何支持OpenAI-Compatible协议的客户端应用都可以用同样的方式Model Console 取 Base URL 精确模型名接入 Olares 上的本地模型Open Design 只是其中一个典型示例。了解更多使用引擎基座应用托管本地大语言模型通过 Model Console 部署和管理模型包括引擎环境变量与推荐模型参数。将 AI 应用连接到模型服务了解模型名称、API 格式和 Base URL 的通用连接模式。赞分享云原生后端运维【免费下载链接】TerminusOpen-Source Personal Cloud OS for Always-On Agents项目地址https://gitcode.com/gh_mirrors/terminus2/Terminus点击查看免费下载相关推荐Olares 上使用 Open Design用提示词生成 HTML 原型、落地页与幻灯片的完整指南Olares 上使用 Open Design用提示词生成 HTML 原型、落地页与幻灯片的完整指南 Open Design 是一款开源 AI 设计工作室它通云原生后端运维在 Olares 上使用 Open Design把自然语言提示词变成 HTML 原型、落地页与幻灯片在 Olares 上使用 Open Design把自然语言提示词变成 HTML 原型、落地页与幻灯片 Open Design 是开源的 AI 设计工作室它通云原生后端运维在 Olares 上使用 Open Design用自然语言生成 HTML 原型、落地页与演示文稿在 Olares 上使用 Open Design用自然语言生成 HTML 原型、落地页与演示文稿 Open Design 是一款开源的 AI 设计工作室应用云原生后端运维上一篇免费解锁WeMod专业版Wand-Enhancer终极指南下一篇终极指南如何在TouchDesigner中实现实时人脸检测与面部追踪创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED

相关推荐

虚拟陀螺仪(软陀螺)技术白皮书:原理、局限与特定场景应用

虚拟陀螺仪(软陀螺)技术白皮书:原理、局限与特定场景应用

摘要本白皮书旨在阐述“软陀螺仪”的技术定义、实现原理及其在消费电子与工业控制领域的实际应用边界。软陀螺仪并非独立的物理传感器,而是一种基于多传感器融合算法的虚拟姿态感知方案。尽管该技术在低成本物联网设备中具有一定应用价值,但在智能手机与…

📅 2026/10/16 6:01:41
Flink算子链深度解析:原理、调优与实战避坑指南

Flink算子链深度解析:原理、调优与实战避坑指南

1. 算子链到底解决了什么问题第一次接触 Flink 的算子链(Operator Chaining)机制,是在一个实时计算任务里。当时任务逻辑并不复杂,从数据源读取、做一次 map 清洗、再 filter 掉无效记录、最后 keyBy 后做窗口聚合输出。但打开 Fl…

📅 2026/10/16 5:56:41
技术参考资源整理指南:从分层筛选到知识库搭建

技术参考资源整理指南:从分层筛选到知识库搭建

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

📅 2026/10/16 5:56:41
MORE NEWS

更多资讯

📰

嵌入式驱动开发:量产级工程化实战 第 21 篇:配置管理与远程升级

配置管理是远程升级的“前置条件” 这个项目的设备安装在工业现场,无法物理接触。所有的配置变更和固件升级,都必须通过无线完成。 配置管理和远程升级是紧密关联的: 配置管理决定设备“怎么运行”——采集周期、告警阈值、通信参数。 远程升级决定设备“运行什么”——固…

📰

如何快速获取 gemma-2-2b_rai_1.8.0_medusa_1.0_npu:ModelScope SDK + Git Clone 双方式下载教程

人工智能大模型基础模型 【免费下载链接】gemma-2-2b_rai_1.8.0_medusa_1.0_npu 项目地址: https://ai.gitcode.com/hf_mirrors/amd/gemma-2-2b_rai_1.8.0_medusa_1.0_npu 点击查看 免费下载 gemma-2-2b_rai_1.8.0_medusa_1.0_npu 是一个基于 Gemma 2 两十亿&#…

📰

instagram-private-api 评论响应接口 MediaRepositoryCommentResponse 深度解析:结构、字段与实战调用

后端 【免费下载链接】instagram-private-api NodeJS Instagram private API SDK. Written in TypeScript. 项目地址: https://gitcode.com/gh_mirrors/in/instagram-private-api 点击查看 免费下载 MediaRepositoryCommentResponse 是 instagram-private-api&…

📰

Octopus 实空间 TDDFT 模拟:从光吸收谱到电子动力学实战指南

简介:这份资源围绕第一性原理计算软件Octopus展开,聚焦时间依赖密度泛函理论(TDDFT)模拟计算,面向具备一定量子化学与凝聚态物理基础、希望上手电子结构模拟的科研人员与研究生。内容涵盖基态DFT预计算、TDDFT参数设置…

📰

导弹打飞机贪心算法:最少拦截系统与偏序链覆盖详解

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

📰

OpenCore Legacy Patcher 指南:老 Mac 装新 macOS 的完整流程

OpenCore Legacy Patcher 指南:老 Mac 装新 macOS 的完整流程 【免费下载链接】OpenCore-Legacy-Patcher Experience macOS just like before 项目地址: https://gitcode.com/GitHub_Trending/op/OpenCore-Legacy-Patcher OpenCore Legacy Patcher 是面向已被…

TODAY

今日更新

THIS WEEK

本周精选

THIS MONTH

本月热门

读完文章,想聊聊您的网站?

告诉我们您的行业与需求,资深顾问一对一梳理方案与报价,全程免费。

📞 💬