前言¶

在 DeepSeek Harness（DSH）里做活动图、多尺寸海报或同一套素材的多版式输出时，常见做法是借助外部设计工具或脚本拼 PNG，再把成品挂回对话或工作流。图层关系、多尺寸同步改文案或换图，往往要重复导出多遍。DSH 生态按「一切皆插件」扩展能力；社区目录 skillhub.cn 上的客户端插件可以内嵌解决一部分排版与批量导出需求。下面介绍维护者 northstacker 发布的 dsh-design-studio（包名 @local/design-studio）：在 Harness 主面板里完成多设计、多图层排版，并通过绑定组实现「一处改内容、多图同步」，最后批量导出 PNG / JPG / ZIP。

这是什么¶

dsh-design-studio 是面向 DeepSeek Harness Web 的分层设计工作台插件：上传图片、按图层排版，把不同设计里的图片层或文字层绑到同一绑定组，一处修改多图同步，再批量导出 PNG / JPG / ZIP。

• 维护者：northstacker
• 分类：客户端（Host 半 index.js 负责项目落盘，Client 半 client.js 负责界面与画布）
• 入口：左侧栏图标 design-studio（排序 6），点开后占据中间主面板
• 许可证：MIT（package.json 版本 1.0.0）
• 源码与说明：GitHub — northstacker/dsh-design-studio

仓库 README 标明平台为 DeepSeek Harness Web，测试徽章为 211 项检查通过；插件以当前 DSH 进程权限运行，安装前应自行审阅源码与许可证。

核心功能¶

多设计与图层¶

• 新建设计：预设尺寸包括 1080×1080、1080×1350、1080×1920、1920×1080、1200×628，或自定义宽高。
• 上传（PNG / JPG / WebP）：可「每张图片新建一个设计」，或「作为图层加入当前设计」（默认约 80% 铺满并保持比例）。
• 图层：图片层与文字层；列表可拖拽排序、显隐、锁定、重命名、复制与删除。画布支持移动、缩放（Shift 锁比例）、旋转（Shift 15° 吸附）、视图平移与缩放。
• 属性：位置、尺寸、旋转、透明度；图片的适应 / 填充 / 铺满 / 原始尺寸与裁切；文字的字体、字号、字重、颜色、对齐、行距、斜体。
• 撤销 / 重做覆盖编辑动作；一次绑定组批量修改只占一条撤销记录。

跨设计绑定¶

同一份活动背景或标题文字，可在多张不同尺寸的设计里各自排版（位置、字号、颜色等独立），而共享内容（图片素材或文字串）通过绑定组同步：

1. 选中图层 → 右侧「绑定」标签。
2. 新建绑定组（图片层只能建图片组，文字层只能建文字组）。
3. 其他设计中选中同类图层 → 加入已有绑定组。
4. 编辑共享内容时会列出受影响的设计与关联数量，确认后一次同步全部成员。
5. 位置、尺寸、旋转、透明度及文字样式始终各设计独立；替换图片时保留各图层的显示区域，按各自的适应 / 裁切设置重绘。

解除绑定或删除绑定组后，图层保留当前内容与外观；删除某一设计或图层不会影响其他设计里的关联图层。

保存与导出¶

• 保存：手动保存写入 ~/.dsh/design-studio/project.json（存在 $DSH_HOME 时使用该变量）；保留上一版 project.prev.json；编辑后约 1.8s 防抖自动保存。图片素材以 base64 data URL 随项目持久化。Host 路由不可用时回退浏览器 localStorage（约 5MB 上限）。
• 导出：勾选任意设计；单个直接下载，多个打包 ZIP。格式为 PNG（可选透明）或 JPG（可选背景色与 0.5–1 质量）。导出像素尺寸严格等于画布尺寸。导出前等待字体与素材就绪；失败项会在结果中列出。

界面布局（来自 README）：顶部工具条（项目名、上传、新建设计、撤销、重做、保存、导出）；左侧设计列表与素材列表；中间画布；右侧图层列表与属性 / 绑定面板；底部状态栏。

安装与启用¶

仓库只包含插件本体（client.js 已构建，装完即用）。不要凭插件名拼接未在文档出现的 dsh plugin add 类命令。官方 README 给出的方式如下。

在 DeepSeek Harness 中任选一种：

1. 插件页安装：将已获得的插件目录作为本地插件安装。
2. profile 链接（路径为 ~/.dsh/profiles/<profile>/）：

ln -s /path/to/dsh-design-studio node_modules/@local/design-studio

并在该 profile 的 package.json 的 dependencies 中加入：

"@local/design-studio": "link:/path/to/dsh-design-studio"

在 dsh.profile.bundles 末尾加入 "@local/design-studio"，然后重启 Harness。

包名固定为 @local/design-studio（按路径安装，不走 npm registry）。若修改 src/，在插件目录执行 npm run build 重新生成 client.js。

典型用法¶

README 用「同一份活动背景、三张不同尺寸设计」说明能力：各设计对背景图使用 cover / contain、不同透明度等排版；标题文字通过文字绑定组共享内容，但字号、颜色、对齐、斜体在各设计中独立。导出 PNG 的宽高严格等于画布（文档示例为 1080×1080 与 1080×1920），为引擎真实导出而非编辑器截图。

可复现的操作顺序：

1. 上传背景或新建预设尺寸设计，在画布上排图片层与文字层。
2. 对需要在多稿中同步的图层创建绑定组，在其他设计中把对应图层加入同一组。
3. 在绑定侧修改共享图片或文字，确认影响范围后同步。
4. 在导出对话框勾选目标设计，选择 PNG 或 JPG（多选则 ZIP），下载成品。

Host 半提供 POST /design-studio/state 的 save / load；项目结构在 README 中概括为 Project（含 designs、bindings、assets）及图层、绑定、素材字段约定。

适用场景与注意¶

适合：需要在 Harness 内快速做多尺寸海报、活动图、缩略图变体，且希望同一文案或主视觉在多张稿之间只改一次的开发者或运营配合场景。

限制（README「已知限制」）：仅图片层与文字层，无形状、蒙版、滤镜、混合模式、多选变换；画布上限约 8000 万像素；文字排版基于 measureText 折行，无字距微调、连字、竖排与富文本分段。

安全与信任：插件分类为客户端，仍与 DSH 同进程；安装前请阅读 仓库源码 与 MIT 许可证。社区目录站点与 DeepSeek / 幻方无官方从属关系，仅为生态索引。

开发者可在插件目录执行 npm install（测试依赖 @napi-rs/canvas）与 npm test 跑四套共 211 项检查；运行时插件不依赖 Skia。

结尾¶

dsh-design-studio 把分层排版、跨设计内容绑定和批量 PNG / JPG / ZIP 导出收进 Harness 主面板，减少「多尺寸重复改图、重复导出」的往返。进一步了解可访问社区目录页 northstacker/dsh-design-studio 与 GitHub 仓库 https://github.com/northstacker/dsh-design-studio。