DSH to Figma

DSH to Figma 是一款专为 DeepSeek Harness (DSH) 设计的开源配套插件。它通过原生 DSH 插件与自动配对的本地 Figma 插件协同工作，实现了 AI 代理对 Figma 画布的直接读取、编辑、截图与素材导出，为“设计到代码”的自动化工作流提供了强大的基础设施支持。

核心优势与设计理念

• 零额度消耗的本地模式：通过本地配套插件执行读取、编辑和截图操作，完全绕过了官方 Figma MCP 的调用限制，无需消耗官方调用次数，支持高频、可持续的迭代。
• 无缝的自动配对机制：DSH 启动时会自动生成当前电脑专用的、已配对的 Figma 插件（包含本地凭证）。用户只需在 Figma 中首次导入生成的 manifest.json，后续即可自动连接，无需手动复制配对密钥。
• 原生宿主扩展支持：工具、设计 Skill 和图像附件均利用 DSH 的宿主扩展机制，无需修改 Agent 主循环，已兼容 DSH 0.2.0-rc.2 与 0.2.1-rc.2 内核。
• 透明的视觉反馈：画布截图通过 DSH 原生图像附件机制传递。若模型不支持图像处理，系统会明确报告限制，避免“幻觉”式假装完成视觉检查。

核心应用场景

DSH to Figma 默认在本地模式下运行，支持以下高度自动化的设计工作流：

1. UI 画板转前端代码：DSH 可读取选中画板的图层结构、布局、CSS 样式及组件信息，并结合当前代码工作区（如 React/Vue 项目）的框架与约定，生成或修改前端页面，同时导出所需图标与素材。
2. 参考截图重建可编辑 UI：向 DSH 提供参考图片或文字需求，Agent 可在当前 Figma 文件中自动创建原生画板、文字、矢量图形和自动布局，实现从静态参考到可编辑设计的快速转化。
3. 批量修改与设计迭代：支持通过自然语言指令对指定画板进行文案、颜色、间距或布局的批量调整。由于画布修改非事务性，建议将大修改拆分为小步，并通过截图返回进行核对。
4. 设计系统复用与变量管理：可读取当前页面的组件、样式和变量，辅助新页面严格遵循既有设计规范，或在明确范围内创建和调整组件变体。
5. 素材交付与效果核对：支持将指定图层导出为 SVG、PNG、JPG 或 PDF 至工作区特定目录。若宿主具备浏览器预览能力，还可对照 Figma 截图检查前端实现效果并持续修正代码。

工作原理与安全边界

• 本地桥接与自动重连：DSH 在本地模式启动时，会在 <DSH_HOME>/figma/ 目录下生成包含本机凭证的插件目录。桥接服务仅监听本地环回地址（loopback），并严格校验 Host/Origin 与配对密钥。空闲断线会自动重连。
• 执行边界：Figma 脚本通过公开的 Plugin API 在编辑器中执行，以宿主进程权限运行。DSH 插件不写入 Figma 文档数据或 clientStorage。
• 操作安全性：单文件首次调用会自动绑定；多文件环境下需明确选择目标。画布修改不是事务操作，写入失败可能产生部分修改，需先检查再重试。结果未知的写入不会自动重放。

快速开始指南

1. 安装 DSH 插件：
   从 GitHub Releases 下载最新的 dsh-to-figma-<版本>.tgz 包。使用宿主对应的 CLI 进行安装（以 web profile 为例）：

   dsh plugin --profile web add "file:/绝对路径/dsh-to-figma-<版本>.tgz"
   

   注：macOS 桌面版需使用应用内置的 CLI 路径。

2. 首次导入配对插件：
   在 DSH 会话中运行 figma_setup，获取本机生成的 manifest.json 完整路径（默认位于 ~/.dsh/figma/companion/manifest.json）。
   在 Figma 桌面端选择 Plugins → Development → Import plugin from manifest…，导入该文件，并在目标 Design 文件中运行 “DSH to Figma · Local”。保持插件窗口打开即可自动连接。
3. 开始交互：
   连接成功后，可通过自然语言指令让 DSH 读取画板信息、返回截图或执行修改。例如：“读取我选中的登录页画板，检查当前项目的技术栈，并在项目中实现这个页面。”

配置与模式切换

用户可通过宿主原生插件配置修改 dsh-figma 入口的 backend 字段：

• local（默认）：使用自动配对的本地插件，支持全量读写与截图。
• desktop（可选）：启用 Figma 内置桌面 MCP，仅支持读取与截图，无需配套插件。
• remote：通过 dsh-figma login 登录，能力取决于 Figma 客户端审批与账号席位。