衍生展示区自动编排

10 秒上手

前提：已连接 Ardot MCP，并在 Ardot 里打开目标文件。

典型用法（任选其一）：

排选中内容：在 Ardot 里选中几个画板，或选中某个 page，然后对 agent 说「把选中的画板用这个技能重新排版」。
工作流收尾：让 agent 生成一批 Ardot 画板后，顺带说「再帮我用这个技能规范化排版」，AI 产出自动整理成展示区。
直接指名：「把这几个画板排成评审展示区，发我链接」。

技能做什么：自动排版 → 黑底展示框 + 标题栏 + 分组 + 单元格小标题 → 找空位放置（不覆盖已有画板）→ 截图预览 → 返回 Ardot 可分享链接。

整个过程自动完成，你不需要预读后面的规则。

想调整时，一句话搞定：

| 你想要 | 直接说 | |---|---| | 换主题 | 「白底」/「灰底」/「浅色」/「演示模式」| | 换排列方式 | 「竖排」/「矩阵」| | 换日期 | 「日期写 X」| | 按维度分组 | 「按设备分组」/「按角色分三组」|

出了问题？先看这里：

| 问题 | 立即执行 | |---|---| | 什么都没发生 | 确认 Ardot 已打开目标文件、MCP 已连接 → 重新触发 | | 覆盖了已有画板 | 在 Ardot 里移走展示区到空白区域 | | 画布没刷新 | 在 Ardot 里按 Cmd+R | | 标题歪掉 | 重新触发（v1.3.0 起已修复此 bug） | | 想改分组 | 重新触发 → Step 1.5 时选「自定义」说明正确分组 |

→ 更多问题见文末「常见问题 FAQ」

这个技能解决什么问题

画完图要发给 PM/研发评审，但 Ardot 里一堆散乱画板——整理成展示区、配好标题、排好间距、找好位置，手动做要 20 分钟；这个技能 1 句话完成。

支持两种触发：

排已有内容：在 Ardot 里选中若干画板或一个 page，让 agent 用本技能重新排版成展示区。
工作流收尾：agent 生成完一批 Ardot 画板后，顺带调用本技能把零散产出规范化为可交付展示区。

适用场景

「把这些画板排一下 / 做成展示区」
「整理成评审看板，发给产品」
「N 个状态并排，方便 PM 一次看完」
「对比 A/B/C 状态，输出一个链接」
「AI 刚生成了一批画板，整理成可交付产出」
「按设备 / 角色 / 版本分组，排成矩阵展示」

不适用场景

生成画板内部的 UI 内容（这是 Ardot 生成技能的职责）
导出 PDF/PNG 文件
跨多个 Ardot 文件编排

使用说明

工具名、JSON key、preset key 保持英文，不翻译。
色值使用 assets/preset-config.json 中的 preset 配置；不同团队可按自己的 token 库替换 tokenName 或 ardotVariableId，不要改写本主文档。

四步工作流

触发后按以下顺序执行。除非用户已明确提供某一步结果，否则不要跳步。

一图流概览（括号内是默认行为，多数情况无需用户介入）：

Step 1  确定输入+目标页 →（默认取当前选中画板，落在当前页）
Step 1.5 分组确认       →（只有一种合理分组就直接做，有歧义才反问一次）
Step 2  判断轴向        →（自动判断，整页多状态默认横排）
Step 3  生成 + 出图     →（自动避让、自动截图、返回链接）

唯一可能打断用户的点是 Step 1.5：当画板分组存在多种合理解释时，技能会反问一次。其余步骤全部自动完成。这样既不牺牲准确性，也不让用户被流程拖慢。

关于场景分组：Step 1.5（场景理解与分组确认）是不可跳过的关键步骤。轴向决策（Step 2）只解决"怎么排"，不解决"谁和谁一组"。仅凭画板的尺寸、命名、坐标推断分组属于"拍脑袋"，任何分组结论在用户确认前都是假设——必须先完成 Step 1.5 再进入 Step 2。

Step 1 — 确定输入画板 + 目标页面

1A. 确定要排哪些画板（输入源），按优先级：

当前选中项：调用 fetch_editor_state 读取 selection。若用户已在 Ardot 里选中了若干画板或一个 page，直接以这些为输入源——这是最常见的入口（用户说「把选中的画板排一下」）。
agent 刚生成的画板：在工作流收尾场景中，使用 agent 上一步生成并记录的画板 nodeId 列表。
用户显式指定：用户给了 nodeId 列表或 page，直接使用。

若 selection 为空且用户没指明输入源，反问一次：「要排版哪些画板？请在 Ardot 里选中它们，或告诉我 nodeId。」

1B. 确定展示区落在哪个页面（输出位置），按优先级：

默认当前页面：用 fetch_editor_state 返回的 currentPage.id。
兜底只问一次：fetch_editor_state 失败或文件未打开时，问「展示区放到哪个 Ardot 文件和页面？」，接收 URL 或 fileKey + pageId。
高级显式参数：用户已提供 targetFileKey + targetPageId 时直接用。

Step 1.5 — 场景理解与分组确认（不可跳过）

在判断轴向、生成骨架之前，必须先确定"谁和谁是一组"。这一步独立于 Step 2，专门解决分组语义问题。

历史教训：仅凭子 frame 名称、尺寸或网格位置推断分组语义，会把用户已经组织好的内容打散。任何分组结论在用户确认前都只是假设。

1.5.A — 盘点原始内容

调用 batch_read 把入口节点的子结构读全（depth ≥ 2）。重点记录：

子节点数量、命名、尺寸、相对位置（x/y）
是否存在 Section / Group / 组件实例 等已有容器语义
是否存在内容重复的子 frame（可能是误复制，应提醒用户而不是当成"V1/V2"）
命名是否带前缀/后缀模式（如 登录-A / 登录-B）

1.5.B — 判断是否需要向用户确认

满足以下全部条件可以不问，直接沿用原始结构：

用户消息中已显式描述了分组（"按设备分 3 组：iPhone / iPad / Web"）
入口节点已经有清晰的容器语义（Section 命名、命名前缀强一致）
不存在多种合理的分组解释

只要任意一条不满足，必须走 1.5.C 确认。

⚠️ 不要用以下方式跳过确认：「看起来 3×2 矩阵很合理」「我先按 A 方案做，不对再改」「frame 名字暗示了…」。问错一个问题的成本远低于重排一个错的展示区。

1.5.C — 列出方案并向用户确认

使用 ask_followup_question 提交单选题，必须包含：

至少 2 个候选分组方案（每个方案明确 group 数量、group 名称、每个 group 包含哪些 cell 用 nodeId 标注）
一个「保持原样」选项（沿用原始画布既有摆位，不重新分组）
一个「自定义」选项（让用户直接描述正确分组）

提问模板示例：

我读到 N 个画板，原始画布是 X×Y 排布。可能的分组方案：
A. 按 <维度1> 分 m group：<group1: [cellIds]> / <group2: [cellIds]> / ...
B. 按 <维度2> 分 n group：...
C. 不分组，全部横排单 row（保持平铺）
D. 自定义（请直接告诉我正确分组）

只有用户给出明确选择后，才能进入 Step 2。

1.5.D — 输出物

进入 Step 2 前，分组结论必须已经明确：

group 列表 [{label, cellNodeIds[]}, ...]
是否单 group / 多 group
是否有"重复画板"需要合并或单独处理

更多反例和判断细节见 references/scene-grouping.md。

Step 2 — 判断布局轴向

前置条件：Step 1.5 的分组结论已经确认。本步只解决"组与组之间、cell 与 cell 之间的排列方向"，不再回头改分组。

每个 showcase 只做一次内容分类。严格按下面决策树判断，不临场发挥。

这些 cells 是「带完整页面框架的整页稿」吗？
例如：状态栏 / 导航栏 / 页面完整布局都在里面，并且只是状态不同。
  ├─ 是 → ROW 轴（HORIZONTAL）。无论 2/3/4/5/N 屏，都横向排列。
  │       评审者从左到右扫整页差异。
  └─ 否 → 这些 cells 是「同一个裸组件 / 卡片的不同状态」吗？
          不带页面外壳，只展示组件本身。
            ├─ 是 → 看 cell 主边方向：
            │       ├─ 横向条状（宽而矮） → COLUMN（VERTICAL）
            │       └─ 纵向柱状（窄而高） → ROW（HORIZONTAL）
            └─ 否 → 这些 cells 是「独立组件目录」吗？
                    例如按钮族、图标族、贴纸族。
                      ├─ 是 → ROW（HORIZONTAL）
                      └─ 否 → MATRIX（outer VERTICAL，group 内 HORIZONTAL）

常见误判：用户说「4 个卡片状态」，但如果卡片是嵌在完整页面里的，那仍然是整页状态对照，用 ROW；只有裸卡片才按组件状态处理。

不确定时默认 ROW。Ardot 画布横向扩展成本低，超长竖图会严重影响评审效率。

Step 3 — 生成骨架并放置

计算 outer frame 尺寸
按 references/skeleton-spec.md §3 公式计算宽高。不要靠肉眼估算。
寻找空位（严禁跳过此步）
调用：
```
locate_available_space(
  fileId: <targetFileKey>,
  nodeId: <targetPageId>,
  width: <computed outer width>,
  height: <computed outer height>,
  padding: 400,
  direction: "right"
)
```
padding 不低于 400。展示区之间宁可留白多一点，不要贴边。

⚠️ 严禁使用估算坐标或硬编码 x/y 值放置 outer frame。 必须使用 locate_available_space 返回的坐标，确保不覆盖、不叠加已有画布内容。如果 locate_available_space 调用失败，停止并报告，不要降级为手写坐标。
用 batch_edit 自底向上生成结构
- Outer FRAME
  name = "<team>_<business>·<scene>·衍生展示区"，layoutMode = VERTICAL。
- Titlebar FRAME
  固定高度 450，包含三段标题 TEXT：<product> / <topic> / <date>，日期放最后；以及 subtitle TEXT。
- UI region FRAME
  承载所有 group，padding: 0 200 200 200。
- Group FRAME
  每个逻辑分组一个 group，例如状态、角色、设备、场景。
- Cell row FRAME
  横向承载 cell columns。若同一 group 内有不同能力/功能模块并列（N≥3），在模块边界处插入垂直 LINE divider；同一链路内多状态不加分隔线。
- Cell column FRAME
  每个 cell 一列，包含 mini-title TEXT 和已有画板引用。优先用 type: "ref" 引用已有画板；只有需要冻结快照时才复制。
校验结构
调用 batch_read 读取 outer frame 宽高。若与公式偏差超过 ±32，说明某层 sizing 塌了，按 references/skeleton-spec.md §5 修。
截图预览 + 返回可交付链接

校验通过后，调用 capture_screenshot 截取 outer frame 截图，在 CodeBuddy 对话中展示预览，方便直接确认结果；随后返回可交付链接：
```
https://ardot.tencent.com/file/<fileKey>?node-id=<encoded showcase node id>
```
关于锚点：Ardot MCP 目前没有「自动将 Ardot 客户端视口定位到某节点」的接口，所以生成后 Ardot 界面不会自动跳转。需要在 Ardot 里查看时，点击上方链接即可直接定位到该展示区。capture_screenshot 截图是在 CodeBuddy 侧的即时预览，不依赖 Ardot 视口跳转。

出错时如何向用户说明（重要）

任何一步失败，不要把原始报错或工具名直接抛给用户，要翻译成「发生了什么 + 用户该做什么」两句话。对照表：

| 内部错误 | 给用户的人话 | |---|---| | fetch_editor_state 为空 / selection 为空 | 「没检测到选中的画板。请在 Ardot 里选中要排版的画板，或告诉我画板 ID。」 | | locate_available_space 失败 | 「当前页面没找到足够空位放展示区。可以换一页，或先清理一下画布。」 | | batch_edit 校验失败 / 尺寸塌陷 | 「展示区生成了但布局有点问题，我正在自动修复，请稍等。」（随后自行重试修复，不需用户介入） | | MCP 连接中断 | 「和 Ardot 的连接断了。请确认 Ardot 已打开、MCP 已连接，然后让我重试。」 |

原则：用户读完就知道下一步做什么，不需要懂 Ardot API。

命名规范（硬约束）

Outer FRAME 名称

<team>_<business>·<scene>·衍生展示区

字段说明：

<team>：团队或业务线，例如 设计系统团队。
<business>：具体业务模块，例如 登录流程、订单管理、权限设置。
<scene>：当前 showcase 聚焦的具体场景，例如 新版登录流、异常态对照。
分隔符固定：团队与业务之间用半角下划线 _；业务、场景、衍生展示区 之间用全角中点 ·。
末尾固定 衍生展示区，不要写 Showcase。

正确：

设计系统团队_登录流程·新版登录流·衍生展示区

错误：

登录流程·Showcase
新版登录流 衍生展示
设计系统团队-登录流程-衍生展示区

Titlebar 三段标题

Titlebar 三段顺序固定为：产品 / 主题 / 日期。日期永远放在最后，不夹在产品名和主题之间。

| 段 | 内容 | 默认字号 | 默认颜色 | |---|---|---:|---| | 1 | <product> 产品/项目名，例如 Product Mobile | 96 | white-100 | | 2 | <topic> 当前 showcase 主题，例如 官网流程总览 | 96 | white-100 | | 3 | <date> 日期，使用 YYYY.M.D | 96 | white-40 或当前 preset 的弱化前景色 |

日期规则：

| 场景 | 格式 | 示例 | |---|---|---| | 单日 | YYYY.M.D | 2026.5.20 / 2026.12.3 | | 区间 | YYYY.M.D – YYYY.M.D | 2026.5.10 – 2026.5.20 |

日期不再使用 5.20 或 2026-05-20。

Subtitle TEXT 模板

<平台描述> · <中文对照说明>（<非重复补充>）

<平台描述>：根据 UI 场景描述承载端，使用英文小写。常用值：mobile / desktop / web / tablet / mobile + desktop / mobile + web / desktop + web。
如果同一个展示区覆盖多端，用 + 连接，顺序建议为 mobile + tablet + desktop + web。
不要再用 screens / cards / flows 作为首段；首段必须回答「这是哪个端的 UI」。
<中文对照说明>：一句中文说明，例如 3 屏对照、4 个状态、5 步流程。
（<非重复补充>）：可选，只写不与 titlebar 三段标题重复的补充信息，例如 （设计评审版）、（自助延展）、（含异常态）。
如果补充内容与 <topic> 或大标题重复，直接省略括号段，不要写重复文案。

正确：

web · 3 屏对照
mobile · 5 屏对照（含异常态）
mobile + desktop · 6 屏对照（设计评审版）

错误：

screens · 3 屏对照（官网流程总览）
web · 3 屏对照（官网流程总览）
screens · 5 states

Subtitle 不要全英文，也不要重复大标题；首段优先表达 UI 端类型，让评审者一眼知道这是 mobile、desktop、web 还是多端对照。

Preset 选择与主题切换

内置四个 preset。未指定时默认 dark-review。

| Preset | 使用场景 | 背景 | 文字 | 风格 | |---|---|---|---|---| | dark-review | 内部评审、异步截图、设计师交付 PM/研发 | 黑色 90% | 白色 | 高对比，聚焦画板 | | light-review | 浅色产品环境、打印、正式文档 | 白色 100% | 近黑 90% | 中性、易阅读 | | gray-review | 护眼浏览、不抢画板的中性底 | 浅灰 #F1F2F4 | 近黑 90% | 柔和、低刺激 | | presentation | 现场演示、大屏投放、周会汇报 | 纯黑 100% | 白色 | 字号更大，远距离可读 |

自然语言切换主题（无需记 preset 名）

用户用日常说法表达主题意图即可，技能按 preset-config.json 的 $themeAliases 自动解析：

| 用户可能说 | 解析到 | |---|---| | 白底 / 浅色 / 亮色 / 打印版 | light-review | | 灰底 / 浅灰 / 中性灰 / 护眼 | gray-review | | 黑底 / 深色 / 暗色 / 默认 | dark-review | | 演示 / 大屏 / 投屏 / 纯黑 | presentation |

解析逻辑：把用户主题词在 $themeAliases 的各 preset 词表里做包含匹配，命中即采用对应 preset；匹配不到时回退默认 dark-review 并提示一次。

对比度保证（主题切换不丢可读性）

关键约束：每个 preset 的 background 和主前景色（title / groupLabel / miniTitle）是成对定义的，切主题时背景和文字必须一起换。 严禁只改背景不改文字 —— 否则会出现"白底白字""灰底浅字"等读不清的情况。

深色背景（dark-review / presentation）→ 文字用 white-100，弱化信息用 white 40%。
浅色背景（light-review）→ 文字用 black-90，弱化信息用 black 40%。
灰色背景（gray-review）→ 文字用 gray-900（近黑），弱化信息用 near-black 50%。
column divider / 状态色后缀也随背景明暗取对应的对比色（见各 preset 的 columnDivider、miniTitleSuffixState）。

自检：生成后若主前景色与背景的明度差不足以阅读（粗略判断：深底必配浅字、浅底必配深字），视为对比度不达标，必须改正后再交付。

数值配置统一放在 assets/preset-config.json。执行时必须读取 preset，不要在正文里硬编码色值、字号、间距。

允许用户单次覆盖某个字段，例如：「用 dark-review，但标题改 120」。覆盖只对当前任务生效，不写回 preset 文件。

参考文件

以下是边界场景手册，不必预读。仅当常规默认规则无法决策时，技能才按需读取对应文档。

需要更多细节时按需读取：

references/scene-grouping.md：场景理解与分组确认的详细方法、反例库。Step 1.5 不确定如何向用户确认时必读。
references/skeleton-spec.md：骨架数值合同。包含 frame 层级、尺寸公式、titlebar sizing、mini-title 样式、column divider、reject signals。执行 Step 3 前必须读。
references/layout-decision-tree.md：布局轴向判断的详细版。内容类型不清楚时读。
references/ardot-api-cheatsheet.md：Ardot MCP 工具调用速查。对 fetch_editor_state、locate_available_space、batch_edit、batch_read 不确定时读。
references/presets.md：preset 字段说明、覆盖方式和新增 preset 规则。
assets/preset-config.json：实际数值配置。生成骨架前必须读。

Reject Signals（交付前自检）

这是技能在交付前自动跑的内部检查清单，不是用户需要预先阅读的规则。 用户无需记忆下列条目——技能会在生成后逐条自检，发现问题自动修复再交付。列在这里是为了保证产出质量可追溯。

出现以下任一情况，不能报告完成，必须修复后再交付：

未做场景分组确认：存在多种合理分组方式，但 agent 直接拍板分组生成展示区，未通过 ask_followup_question 让用户确认（除非满足 Step 1.5.B 的全部跳过条件）。
打散原始画布既有结构：入口节点已有 Section / 命名前缀 / 容器分组等明确语义，但生成时被重新洗牌。
把重复画板当成"V1/V2"：两个 cell 内容完全一致，应提醒用户合并或确认意图，不能虚构状态语义。
轴向错误：整页多状态对照被排成 COLUMN，必须改 ROW。
未调用 locate_available_space：手写坐标放置 outer frame，必须改为自动寻位。
颜色未走 preset：可绑定 token 的颜色被直接写成 #000000 / rgba(...)。
尺寸塌陷：outer 宽高与公式不一致，通常是某个 inner FRAME 错用了 FIXED。
缺 mini-title：cell 裸放，没有顶部小标题。
titlebar 日期位置或格式错误：标题栏必须按 <product> / <topic> / <date> 排列，日期放最后，格式为 YYYY.M.D。
展示区互相贴边或重叠：locate_available_space 的 padding 低于 400。
outer 命名错误：不符合 <team>_<business>·<scene>·衍生展示区，或末尾不是 衍生展示区。
mini-title 样式错误：含 新增 / 修改 / 废弃 / 灰度 等状态词，但没有用状态色 Style C/D。
column divider 使用错误：同一链路/场景的多状态间加了分隔线（应省略）；或同一 group 内不同能力/模块并列（N≥3）却没在模块边界加分隔线。
subtitle 首段错误：仍使用 screens / cards / flows 等类型词，而不是 mobile / desktop / web / 多端组合。
subtitle 全英文：必须包含中文对照说明。
subtitle 重复标题：括号补充段与 <topic> / 大标题重复，应直接省略。
日期仍写旧格式：不要写 5.20 或 2026-05-20，应写 2026.5.20。
标题与内容左边缘不齐（歪掉）：title row / subtitle / group label / cell row 的左边缘 absoluteBoundingBox.x 不一致（容差 ±1px）。根因通常是 titlebar 左右 padding ≠ uiSidePadding、titlebar 未设 counterAxisAlignItems: MIN、或 title row 误用 SPACE_BETWEEN。见 skeleton-spec「对齐硬契约」。
主题对比度不达标：切换主题后只改了背景没改文字（如白底白字、灰底浅字），或主前景色与背景明度差不足以阅读。背景与主前景必须成对取色。

Non-goals

本技能不处理：

生成单个页面或组件稿。
决定业务方案、交互方案或视觉风格是否正确。
修改 cell 内部设计细节。
导出图片、PDF 或其他文件格式。
跨文件、多页面批量同步。

完整示例

示例 A：场景明确，可跳过分组确认

用户：

我刚画完登录流程的 5 屏：默认态 / 输入态 / 校验失败 / 加载中 / 成功。
帮我在 Ardot 上排成一个 review board，链接发给产品。

执行：

fetch_editor_state 返回当前页面 123:456，目标页面确定。
Step 1.5：用户已显式给出分组语义（5 个状态属于同一场景"登录流程状态对照"，单 group）。满足跳过条件，不需要 ask_followup_question。
Step 2 判断内容：5 个带完整页面框架的整页稿，多状态对照 → ROW。
计算尺寸：
- cell width = 402，cell height = 874。
- 同场景 5 状态，N≥3，需要 column dividers。
- outer width = 400 + 5×402 + 4×81 = 2734。
- outer height = 450 + 50 + 60 + 40 + 16 + 874 + 200 = 1690。
locate_available_space(..., width=2734, height=1690, padding=400, direction="right") 返回空位。
batch_edit 生成：
- outer FRAME：产品团队_登录流程·新版登录流·衍生展示区
- titlebar：Product Mobile / 登录流程 / 2026.5.20
- subtitle：mobile · 5 屏对照（含异常态）
- group：状态对照
- 5 个 cell columns（同一链路多状态，不加 column dividers）
batch_read 校验 outer 宽高和 sizing。
capture_screenshot 截取 outer frame，在 CodeBuddy 对话中展示预览。
返回 Ardot 链接。

示例 B：场景模糊，必须先确认分组

用户：

https://ardot.tencent.com/file/xxx?node_id=70%3A30 帮我把这个画布里的内容排版一下

执行：

fetch_editor_state + batch_read 读入口节点 70:30，发现：6 个 1440×1080 整页 frame，3 列 × 2 行摆放，命名分布为「购买页 / 登录 / 购买页 / 购买页 / 登录 / 企业版购买弹窗」。
Step 1.5：分组方式存在多种合理解释（按页面类型？按版本？按列方向？保持原排布？），且存在两个 frame 内容完全一致（疑似复制）→ 不满足跳过条件。
调用 ask_followup_question 提交分组方案：
- A. 按页面类型 3 group × 2 cells（购买页 / 登录 / 企业版购买）
- B. 按版本 2 group × 3 cells（V1：上排 3 屏 / V2：下排 3 屏）
- C. 不分组，6 屏单 row 横排（保持平铺）
- D. 自定义
用户回答「C 保持平铺，但 67:67 和 67:59 是误复制，去掉一份」。
Step 2 进入轴向判断：5 个整页稿 → ROW。
后续生成、校验、出图、出链接。

示例 C：多端组件对照（MATRIX 场景）

用户：

我有 4 个按钮变体：primary / secondary / ghost / destructive，分别有 mobile 和 desktop 两个尺寸，帮我排成一个对照展示区。

执行：

fetch_editor_state 定位当前页面。
Step 1.5：用户已显式给出两个维度（按钮类型 × 设备尺寸）→ 满足跳过条件，直接用 MATRIX 布局，2 group（mobile / desktop）× 4 cells。
Step 2：cells 是裸组件（按钮），多类型目录 → ROW（每行 4 个变体）；两个维度 → MATRIX（outer VERTICAL，2 groups 分别列 mobile 和 desktop）。
计算尺寸：每个 button cell 约 160×48，cellGap=40，outer width = 400 + 4×160 + 3×40 = 1160。
locate_available_space 找空位，生成 MATRIX 骨架：
- outer FRAME：设计团队_按钮组件·变体对照·衍生展示区
- group 1：mobile，4 cells（primary/secondary/ghost/destructive）
- group 2：desktop，4 cells（同上，不同尺寸）
batch_read 校验，capture_screenshot 截图预览，返回链接。

常见问题 FAQ

🔥 高频前 3 问（覆盖大部分使用障碍）：

技能没触发 / 没反应 → 见 Q2

生成内容覆盖了已有画板 → 见 Q4

标题歪掉、和内容不对齐 → 见 Q6

Q1：这个技能需要我提前学很多规则才能用吗？

不需要。在 Ardot 里选中画板，说一句「把选中的画板排成展示区」就能触发，其余规则在后台自动执行。只有在分组有歧义时，技能会反问一次；其余全自动完成。

Q2：为什么技能没有自动触发，或者触发了但什么都没做？

最常见原因：Ardot 文件未打开、未选中任何画板，或 Ardot MCP 连接中断。请先确认：① Ardot 已打开目标文件；② 已选中要排版的画板；③ MCP 工具状态正常。然后重新触发。

Q3（高频）：生成完画布覆盖到已有内容了怎么办？

技能强制使用 locate_available_space 寻找空位，padding=400 保证不贴边。如果仍然出现覆盖，通常是 MCP 调用异常时降级用了手写坐标——这是技能的 Bug，可向发布者反馈。手动修复：在 Ardot 里移走展示区到空白区域即可。

Q4：生成后 Ardot 里看不到新内容？

MCP 写入成功但 Ardot 视图有时不自动刷新。在 Ardot 中按 Cmd+R 或点击画布空白处触发重新渲染，内容就会出现。

Q5（高频）：生成的展示区标题歪掉了，和内容不对齐？

这是 Ardot autolayout 的对齐属性缺失导致的。最新版技能已修复此问题（v1.3.0 起）——对齐硬契约确保 titlebar、title row、subtitle 和内容区共享同一左基准线。如仍出现，请确认使用的是最新版本。

Q6：我不喜欢黑底，想用白底或灰底怎么说？

直接说「白底」「浅色」「灰底」「护眼」即可，技能根据自然语言自动切换主题，文字颜色也会联动，保证阅读性。不需要记 preset 名称。

Q7：分组结果不对，展示区排错了怎么快速修？

在技能提问分组方案时选「自定义」，直接告诉技能正确分组。如果已生成后才发现，重新触发并在 Step 1.5 给出明确分组说明即可，技能会重新生成。

Q8：可以只修改已有展示区的某个 cell 吗？

本技能不支持精修 cell 内部。修改 cell 内容请直接在 Ardot 中编辑源画板——展示区里的 cell 通过 ref 引用源画板，源画板更新后 cell 会自动同步。

维护建议

新增结构规则时，优先更新 references/skeleton-spec.md，再同步 SKILL.md 的摘要与 reject signals。
新增 preset 时，只改 assets/preset-config.json 和 references/presets.md；不要把结构变化塞进 preset。
团队专属 token id 写在本地 fork 的 preset-config.json 中，覆盖 ardotVariableId 即可。