← 返回教程 无需重建即可换风格 —— 在 Open Design 中探索视觉标识 的视频封面
演示

无需重建即可换风格 —— 在 Open Design 中探索视觉标识

一套面向 Open Design 的设计探索工作流 —— 只需构建一次页面或仪表盘,就能在保持相同内容和结构的前提下,彻底改变它的整体视觉标识(暗黑霓虹 → 奢华杂志风)。几秒钟内即可尝试截然不同的外观,而不必重新构建。基于 AI Fire Academy 的演示。

AI Fire Academy 2026年5月18日 10:38 在 YouTube 打开 ↗

确定一个视觉方向,往往意味着一旦改变主意就得重来。本指南将展示 Open Design 用于探索的最佳绝招:只构建一次,然后给整个作品换风格 —— 内容和结构不变,外观却焕然一新 —— 只需几秒钟。它沿用了 AI Fire Academy他们的视频中演示的流程,并结合当前版本进行了重写和更新。可以观看上方视频,或继续阅读文字版。

在 Open Design 中生成的真实原型。 在预览中渲染出的真实生成原型 —— 一个暗黑、电影感的代理机构落地页。

什么是 Open Design?

Open Design 是一款开源、本地优先的工具,可替代封闭的云端设计工具。其核心理念是自带你的 agent:它本身不是 AI 大脑,而是指挥者。它会自动检测你机器上已有的编码 agent(Claude Code、Codex、Gemini、DeepSeek 等),并把它们变成 UI/UX 设计师 —— 没有生态锁定,没有每周额度限制,一切都在本地运行(你的文件、你的 SQLite、你的项目都留在你的设备上)。

  • 开源,Apache-2.0 —— 克隆它、自行托管,或者直接下载应用。
  • 任意模型 —— 选择最适合你预算和工作流的那一个。
  • 本地优先 —— 零云端依赖,零平台锁定。

第 1 步 —— 安装(简易方式)

最简单的路径是使用桌面应用:从 open-design.ai/download(macOS/Windows)下载,然后像普通应用一样拖进去即可 —— 无需 Docker,无需终端。首次启动时,它会扫描你的机器并检测本地的编码 agent(AI Fire Academy 的机器自动识别到了 Claude Code),这些 agent 会成为设计引擎。你可以接入更多提供方(ElevenLabs 语音、Suno 音乐、图像模型、MCP),但默认配置已经足以起步。

第 2 步 —— 构建第一个版本

创建一个原型(演示中是一个新闻通讯落地页),保持高保真,然后输入提示词。Open Design 会先提出澄清性问题(谁会订阅、发布频率、CTA、视觉方向),而不是凭空猜测,然后再开始构建。第一版就已经像一个真实的初创公司页面了 —— 而且你可以通过对话进一步推进("让主视觉更有戏剧张力、更高端,加一个发光的球体,强化 CTA")。

Open Design 工作区 —— 描述你想要的内容并选择一种模式。 Open Design 工作区:描述你想构建什么,选择一种模式,剩下的交给你的 agent。

第 3 步 —— 换风格这一招(真正的解锁点)

技巧就在这里。一旦你有了满意的东西,就在不改动内容的前提下改变整体视觉标识

"把整个设计方向改成奢华杂志风,同时保持相同的内容和结构。"

相同的文案、相同的布局,全然不同的设计语言 —— 一句提示词搞定。AI Fire Academy 在一个落地页和一个完整的财务仪表盘上都做了这件事:暗黑霓虹 → 奢华杂志风,瞬间完成。正是这一点让 Open Design 感觉像一位设计师,而不是一个样机生成器 —— 它在保留实质内容的同时对外观进行迭代,让你在最终定夺之前可以试演多个方向,而不必每次都重建。

Open Design 中的幻灯片模式及示例演示文稿。 幻灯片模式:选择一个演示文稿类别,并 fork 一个示例作为你的起点。

第 4 步 —— 它适用于哪里

AI Fire Academy 的实战心得:自由职业者/代理机构可以快速为客户制作落地页和仪表盘原型;创始人可以快速搭建 MVP 界面和后台管理面板;创作者可以在不重建的情况下试验截然不同的视觉标识。诚实的提醒:它还处于早期阶段(预期会有些许粗糙之处),而且它并非神奇地无限量 —— 你的 API 用量仍取决于你所连接的模型。但灵活性(你的模型、你的技术栈、本地运行)才是重点所在。

小贴士

  • 构建一次,然后换风格 —— "保持相同的内容和结构,改变设计方向"是关键提示词。
  • 在最终定夺之前试演各种方向(杂志风、粗野主义、极简……),而不是重新构建。
  • 回答那些探索性问题,让第一版尽量接近目标,然后再探索各种外观。
  • 使用桌面应用获得零配置路径;它会自动检测你的 agent。
  • 换风格在仪表盘上同样有效,不只限于落地页。

常见问题

我可以在不重做内容的情况下改变整体外观吗? 可以 —— 这正是它的亮眼绝招。提示它在保持相同内容和结构的前提下改变设计方向,它就会原地换风格。

我需要配置一个 agent 吗? 通常不需要 —— 桌面应用会自动检测已安装的编码 agent,并选用其中一个作为设计引擎。

它真的是无限量/免费的吗? 它免费、本地运行,没有单独的每周额度限制,但你仍需为所连接模型的 API 用量付费。

它是开源的吗? 是的 —— Apache-2.0。在本地运行它;你只需为所连接内容的模型/媒体用量付费。


本文字版指南基于 AI Fire Academy 的演示。观看上方完整视频,并订阅 AI Fire Academy,获取更多开源 AI 工作流。