open-design

88.2kStars10.2kForks815Issues264Watchers

Mount the Open Design local design workspace as an MCP service to dsh, enabling dsh to directly read project files, preview generated design drafts, and invoke 27 coding Agent CLIs to produce web prototypes, PPTs, posters, or videos.

Language
TypeScript
License
Apache-2.0
Branch
main
agent-skillsai-designbyokclaude-code-for-designclaude-designcodex-designcoding-agentscursor-design

Install

$ dsh plugin --profile web add github:nexu-io/open-design

Run the command above in your terminal to install this plugin via the dsh CLI. You can switch Profile in the top-right corner. New to dsh? Read the beginner tutorial

One-Line Pitch

Mount the local Open Design design workspace as a stdio MCP service to DeepSeek Harness (or any MCP-compatible Agent), enabling dsh to directly read project files, preview generated design mockups, and use od to invoke locally installed coding Agent CLIs to produce web prototypes, PPT, posters, videos and other design outputs.

Core Capabilities

  • Expose tools like project listing, file reading, and design preview to dsh as a stdio MCP service
  • Automatically invoke any of the 27 local Agent CLIs through the od backend to generate design mockups, without dsh needing to write files itself
  • Reuse DeepSeek Harness' built-in session archival and cold start recovery, supporting streaming thinking / tool_call / usage structured events
  • Directly consume Open Design's built-in 164+ skill features, 40+ rendering templates, and 150+ DESIGN.md brand systems
  • Real-time preview of design mockups in sandboxed iframe, with one-click export to HTML / PDF / PPTX / MP4 / ZIP

Technical Implementation

  • Language: TypeScript (Node ~24)
  • Key Dependencies: @open-design/sidecar, @open-design/contracts, better-sqlite3, sharp, electron
  • Architecture Pattern: Local daemon + stdio MCP service bridge; DSH adapter communicates with official dsh --profile open-design --stdio subprocess via strict JSONL protocol
  • Entry Point: plugins/open-design/.mcp.json (stdio MCP config) → apps/daemon/src/cli.ts (od CLI and MCP service implementation)

Use Cases

Designers and product managers who want AI to produce real, previewable web prototypes, PPT posters, and video animations directly within DeepSeek Harness (or Claude Code / Codex / Cursor and other supported Agents), rather than just getting descriptive text. Also suitable for studio teams already using Open Design's local desktop client who want to seamlessly integrate existing projects into dsh automation pipelines.

Prerequisites & Compatibility

DependencyMin VersionDescription
DSH0.1.0-rc.6Adapter whitelist hardcoded to support only this version
Node.js~24Repository engines mandates 24.x
pnpm10.33.2 (<11)Only needed for source build / Docker self-hosting
PlatformmacOS / Windows / LinuxDesktop primary: macOS+Windows, Linux AppImage as optional distribution channel
Native Modulesbetter-sqlite3 / electron / sharpSQLite persistence + Electron desktop shell + image processing

Installation

dsh plugin --profile web add github:nexu-io/open-design

Configuration

ConfigTypeDescriptionDefault
daemon-urlstringMCP service address for connecting to od daemonhttp://127.0.0.1:7456
Proxy Protocol VersionintegerDSH profile JSONL protocol version1
Remote Model DirectoryautoAuto-discovered via dsh --profile open-design --modelsDynamic
DeepSeek API KeystringConfigure in dsh web's own settings page; OD does not read thisUser-provided

FAQ

Q: Do I have to install the Open Design desktop client to use this plugin?

A: The desktop client is not mandatory, but the od command must be findable in PATH by dsh. The easiest way is to install the desktop client/source first and launch it once to make od available, then install this plugin in dsh.

Q: What if I don't have Claude Code, Codex or other local Agents installed?

A: No problem. od will automatically detect Agents in PATH; if none are installed, you can switch to BYOK mode in Open Design settings and fill in the baseUrl+key for compatible interfaces like OpenAI/Anthropic/Azure/Google, and design mockups can still be generated.

Q: Will my project files be uploaded to the cloud?

A: No. od defaults to listening on 127.0.0.1, and BYOK proxy has SSRF protection at the daemon edge; it only listens on LAN after explicitly setting OD_BIND_HOST and OD_ALLOWED_ORIGINS.

Q: Do I need to fill in the DeepSeek API Key again in Open Design?

A: No. The Key is configured and saved in dsh web's "Settings → Models → DeepSeek"; OD neither reads nor echoes this Key; if you already have the DEEPSEEK_API_KEY environment variable on your machine, OD will reuse it directly.

Q: Will there be conflicts with Open Design's built-in web UI / desktop client?

A: No conflicts. od supports both MCP stdio service and HTTP port simultaneously; both share the same SQLite project database, and generated project files are visible to both sides.

Q: Will uninstalling affect my previously generated projects?

A: No. dsh plugin --profile web remove nexu-io/open-design only removes the MCP bridge; project files, design systems, and skills are preserved in Open Design's data directory.

Q: macOS terminal says it can't find od

A: macOS's built-in /usr/bin/od is the octal dump tool, which will shadow Open Design's od command. It is recommended to copy the client snippet with the absolute path from the desktop client via "Settings → MCP server", rather than running od mcp install <agent> bare in the terminal.

Learning Curve

Beginner — As long as Open Design and DeepSeek Harness are installed on your machine, copying one installation command will take effect in dsh; there are clear prompts and guidance for installing missing components when DSH profile and adapter versions don't match.

Known Issues & Limitations

  • DSH adapter is hard-bound to 0.1.0-rc.6; other versions will be blocked by versionPolicy.supportedVersions and require switching to a supported version (apps/daemon/src/runtimes/defs/deepseek-harness.ts:56)
  • Alpine Linux is not in the DSH one-click install script's auto-completion; Alpine containers require manual Node + dsh installation (docs/deepseek-harness-one-click-install.zh-CN.md:32)
  • Claude Desktop's auto MCP config currently only supports macOS and Windows; Linux requires manually writing ~/.config/claude-desktop/open-design.json (README.md:139)
  • When first enabling the Open Design adapter on DSH, a explicit confirmation is required before Open Design will call dsh plugin --profile open-design add to install the connection component into ~/.dsh/profiles/open-design; if cancelled, DSH won't be selected and won't modify the profile (docs/agent-adapters.md:397)
  • Running od mcp install <agent> bare in macOS terminal may hit the system /usr/bin/od causing installation failure; it is recommended to copy the snippet with absolute path from desktop client "Settings → MCP server" (README.md:320)