OpenDesign 是一个本地优先、开源的 AI 驱动设计工作空间，可以看作是 Claude Design 的开源替代品。它的部署方式非常灵活，覆盖了从“开箱即用”到“开发者构建”的全场景。

下面为您梳理出四种主要的部署和使用路径，您可以根据自己的技术背景和需求选择。

📋 部署方式速览

方式 适用人群 特点 操作复杂度
1. 桌面应用 (推荐) 所有用户，特别是设计师和产品经理 图形界面，零配置，下载即用，功能完整 ⭐ 极简
2. Docker 部署 熟悉容器化，追求环境一致性的用户 一键启动，适合团队或服务器部署 ⭐⭐ 中等
3. 命令行集成 (MCP) 开发者、AI Agent 用户 将设计能力集成到 Claude Code、Cursor 等 20+ CLI 工具中 ⭐⭐ 中等
4. 从源码运行 开发者、贡献者 完全控制，可修改和调试代码 ⭐⭐⭐ 复杂

🖥️ 方式一：桌面应用（最简单、最推荐）

这是官方为普通用户设计的图形界面版本，无需任何命令行操作，下载安装后即可使用，包含了原型、演示文稿、图像、视频生成等所有核心功能。

  1. 下载安装包：
    • 访问项目官网 open-design.ai 或 GitHub Releases 页面。
    • 根据你的操作系统下载对应版本：
      • macOS: 下载 OpenDesign-{version}-macOS-arm64.dmg (Apple Silicon) 或 -macOS-x64.dmg (Intel)。
      • Windows: 下载 OpenDesign-{version}-Windows-x64.exe 安装包。
  2. 安装并运行：
    • 像安装普通软件一样，双击下载的文件，按照系统提示完成安装。
    • 首次启动时，应用会自动检测你电脑上已安装的编码 Agent CLI（如 Claude Code、Codex 等），并引导你完成基础配置。
  3. 开始使用：
    • 启动后，你可以直接在界面中输入设计需求（Brief），选择设计系统、模板和模型，开始生成原型、演示文稿等。

🐳 方式二：Docker 部署

适合希望快速在服务器上部署 OpenDesign Web 服务，或进行团队协作的场景。

  1. 克隆仓库与准备环境：

    1
    2
    git clone https://github.com/nexu-io/open-design.git
    cd open-design/deploy

  2. 配置环境变量：

    • 复制示例环境变量文件，并生成一个 API 令牌。

      1
      2
      cp .env.example .env
      echo "OD_API_TOKEN=$(openssl rand -hex 32)" >> .env

    • 如果需要自定义其他配置（如端口、允许的源），可以编辑 .env 文件。

  3. 启动服务：

    1
    docker compose up -d

  4. 访问服务：

    • 在浏览器中打开 http://127.0.0.1:7456。
    • 如果浏览器要求登录，用户名输入 open-design，密码输入你上一步生成的 OD_API_TOKEN 值。

🤖 方式三：命令行集成（MCP 服务器）

这是为开发者设计的**“无头”使用方式**，可以将 OpenDesign 的设计能力作为 MCP 服务器，集成到各种编码 Agent 中。

  1. 前置条件：你已经安装了 OpenDesign 桌面应用，并且 od 命令可以在终端中执行（注意 macOS 系统自带的 /usr/bin/od 是八进制转储工具，可能会冲突，建议使用桌面应用设置中的绝对路径）。

  2. 一键安装到 Agent：

    1
    od mcp install <agent>

    将 <agent> 替换为你使用的工具，例如 claude、codex、cursor、opencode 等（支持 20+ 种 CLI）。

  3. 使用示例：
    安装后，在你的 Agent（如 Claude Code）中，就可以直接使用 OpenDesign 的能力：

    1
    > Use open-design to generate a landing page with the Linear design system

    Agent 会自动调用 OpenDesign 的技能，生成符合设计系统的文件。

🛠️ 方式四：从源码运行（开发者）

如果你希望基于最新代码进行开发或贡献，可以按照以下步骤从源码启动。

第 1 步：环境准备

你需要安装以下工具链：

  • Git
  • Node.js: 版本需为 24.x 或更新。
  • pnpm: 版本 10.33.x 或更新。可用 corepack enable 后通过 corepack prepare pnpm@10.33.0 --activate 安装。
  • （可选）Rust 工具链，用于构建部分原生模块。

第 2 步：获取源码与安装依赖

1
2
3
4
git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable
pnpm install

第 3 步：运行开发环境

1
pnpm tools-dev run web

此命令会启动后端守护进程（Daemon）和前端开发服务器。终端会打印出可以访问的本地 URL（例如 http://localhost:3000），打开即可开始预览。

🔧 配置要点与说明

  • 设计系统与插件：OpenDesign 的强大之处在于其可组合性。项目内置了 151 个品牌设计系统（如 Apple、Stripe、Linear）、100+ 功能技能 和 277 个官方插件，它们都位于项目的 design-systems/、skills/ 和 plugins/ 目录下，你可以自由浏览和添加自己的品牌包。
  • BYOK (Bring Your Own Key)：在桌面应用或 Docker 部署中，你可以配置自己的 LLM API 密钥（如 OpenAI、Anthropic、Google 等），或使用 OpenDesign Cloud 官方模型服务（需在应用内充值）。
  • 隐私与安全：桌面应用和 CLI 工具默认在本地运行，数据不出设备。Docker 部署等网络服务默认绑定在 127.0.0.1，并可通过 OD_ALLOWED_ORIGINS 等环境变量进行安全加固。

💡 常见问题

  • macOS 上 od 命令冲突：macOS 系统自带 /usr/bin/od 命令，会与 OpenDesign 的 od 命令冲突。建议在桌面应用的 设置 → MCP 服务器 中，直接复制包含完整路径的安装命令。
  • WSL2 用户：请参考项目中的 docs/wsl-setup.md 指南进行特别配置。
  • 内部网络模型端点：如果你使用内网的 LLM 网关（如 Ollama 在内网 IP），需要在 .env 中设置 OD_ALLOWED_INTERNAL_HOSTS 来放行该 IP。