前言¶

用 DeepSeek Harness 做界面时，常见做法是口头描述配色、圆角和排版，或临时把截图贴进对话。参考图一多，就难以长期归类、固定「当前项目的视觉语言」，智能体也未必在生成前系统读取这些素材。下面介绍社区插件 dsh-moodboard（维护者 Stijnus）：在 Harness Web 侧栏提供 Moodboard 面板，收集截图与灵感图、打标签写备注、固定风格指南，并通过工具与 Composer 按钮让智能体在改 UI 前先读到 pinned 参考的实际像素与元数据。

这是什么¶

dsh-moodboard 是面向 DeepSeek Harness 的视觉参考 Moodboard 客户端插件。npm 包名为 dsh-moodboard，当前资料中的版本为 0.2.11，许可证 MIT。插件在 Web UI 侧边栏增加 Moodboard 入口，本地持久化元数据与图片附件，Host 侧注册 moodboard 工具并在 system prompt 中提示智能体在设计 UI 前加载 moodboard。

目录页：skillhub.cn/plugins/Stijnus/dsh-moodboard
源码与说明：github.com/Stijnus/dsh-moodboard

核心功能¶

资料中明确列出的能力如下（节选与 UI 协作相关的部分）。

面板与采集

• 侧边栏 Moodboard：拖拽、剪贴板粘贴（⌘V / Ctrl+V）或文件选择上传；缩略图画廊支持拖拽排序、多选批量操作、标签筛选，以及「当前生效的风格指南」条。
• 图片会降采样并写入 durable attachment store；元数据包括标签、备注、来源 URL、名称等，可在检查器中编辑，支持 pin / 替换 / 删除。

组织与检索

• 按名称、标签、备注、来源搜索（可与标签过滤组合）；灯箱查看大图，支持前后导航与键盘操作。
• 标签自动补全；标签管理器可重命名或合并标签（含各标签引用计数）；可在参考之间复制/粘贴标签、备注、来源。

与智能体协作

• 固定（pin）一条或多条参考后，智能体将 pinned 图视为 typography、color、spacing、radius、iconography 与组件样式的依据。
• 工具 moodboard：active（默认，返回 pinned 或整板，含图像 content blocks）、query（按标签过滤）、list、get、brief；includeImages: false 可只取元数据；active / query 单次图像 content 上限为 6，完整元数据可用 get 或 list 查 id。
• Composer 中的 Moodboard 按钮向草稿插入指向 pinned 参考的指令（按钮本身不会直接发送消息）；系统提示段说明 moodboard 存在，建议在 UI 设计前加载。

同步与持久化

• 面板激活后拉取 board，并通过 revision 轮询与窗口 focus / visibility 保持与 Host 同步（含智能体经 HTTP API 上传的参考），通常无需整页刷新。
• 元数据：<DSH_HOME>/moodboard/board.json；图片字节：<DSH_HOME>/attachments/v1。

运行要求

DeepSeek Harness >=0.2.1-rc.3 且 <0.3.0-0，需 Web profile（Host 需 attachments、tools、systemPrompt、webServer、connection 等能力）。

安装与启用¶

README Quick start 给出的命令（Web profile）：

dsh plugin --profile web add dsh-moodboard

安装后重启 Harness 或刷新 Web UI，侧边栏应出现 Moodboard。若图标未立即出现，可再刷新一次 Web UI。

资料另载：通过 Plugins 页或 plugin_manager install_bundle 时，target 为包名 dsh-moodboard：

plugin_manager install_bundle target: "dsh-moodboard"

手动等价形式为 dsh plugin --profile <profile> add dsh-moodboard（bundle 仍须在 Plugins 页启用）。

更名说明（0.2.7）：旧 scoped 名 @stijnus/dsh-moodboard 已 unpublish，pin 到旧名会 404；应安装 dsh-moodboard 并从 profile 中移除旧条目。

典型用法¶

README 中的本地 walkthrough 可复现：

1. 从侧边栏打开 Moodboard，添加一条参考图。
2. 为其打标签并写备注，说明期望的样式，然后 pin。
3. 在 Composer 点 Moodboard 按钮，把参考指令插入草稿；确认后发送，让智能体在生成或改版 UI 前读取 pinned 风格指南。

智能体侧通常调用 moodboard 的 active 或 query 获取图像与元数据；需要廉价总览时用 list，单条详情用 get，纯文本摘要用 brief。

Host 还为面板与程序化读取提供同源、需 owner session cookie 的 /moodboard 路由（例如 GET /moodboard/api/state 等，完整表见仓库 README）。

适用场景与注意¶

适合谁

• 经常在 DSH 里做 AI 辅助 UI 设计、希望参考图与标签长期留在工作区而非散落在聊天记录里的开发者。
• 需要明确「当前项目视觉语言」并在多轮对话中反复引用的团队或个人。

使用前请注意

• 插件以当前 DSH 进程的权限运行，会读写本机 <DSH_HOME> 下的 moodboard 与 attachment 数据；安装前应阅读 源码 与 MIT 许可证，确认符合你的安全与合规要求。
• 社区目录 skillhub.cn 为独立站点，与 DeepSeek / 幻方无官方从属关系；DSH 生态遵循「一切皆插件」，本插件为社区维护的客户端扩展。
• 工具返回的图像块有数量上限；大批量参考应结合 list / get 与标签 query，避免单次上下文过大。

结尾¶

dsh-moodboard 把视觉参考、标签备注与 pinned 风格指南收进 Harness Web UI，并通过 moodboard 工具与 Composer 指令接到智能体 UI 工作流。若你要在 DSH 里「先定视觉、再让模型写界面」，可按上文命令安装并在侧边栏维护 board。

• 目录页：https://www.skillhub.cn/plugins/Stijnus/dsh-moodboard
• GitHub：https://github.com/Stijnus/dsh-moodboard