用途
Wireframe Sketch 负责规划一个设计所消费的布局结构：一棵区域树加上屏幕流程，在任何视觉识别之前先把各个界面（surface）安排好，然后将其绘制成低保真线框图。它拥有 WIREFRAME.md——即设计所消费的结构布局计划。
该技能只规划结构：信息架构、区域布局和屏幕流程，从不涉及颜色、字体或令牌。排列与视觉识别是正交的：同一份计划在任何设计下都成立。
主要能力
- create：从对话中撰写或修补布局计划（界面、区块、形状、流程）。
- render：将计划绘制成低保真线框图——一个 HTML 页面或 ASCII 草图——或一个 Mermaid 屏幕流程图。
- validate：检查线框图或计划的一致性，并在计划应当变更时用自然语言进行调和。
使用方式
Discovery：discovery.md 在每次操作前运行——从不跳过，也从不直接调用。它检查现有上下文（已有的 WIREFRAME.md、对话、用户提供的任何简报），并按意图路由——撰写计划、绘制计划或检查计划。
产物：产出并拥有 docs/design/WIREFRAME.md 及其绘制视图 docs/design/wireframe.html——一个低保真线框图。frontmatter 区域树是渲染所依据的计划；正文供人阅读。渲染是生成式的：它读取计划并凭借判断绘制页面，由捆绑的字形套件（assets/wireframe.css）和评分标准（drawing.md）引导，使各次运行在风格上保持一致——并非逐字节相同的投影。完整模板和形状词汇表位于 create.md。
注册与界面：在排列之前设定两个轴：
- register——姿态：brand（界面用于传达——落地页、活动页、作品集）或 product（界面用于服务任务——仪表盘、表单、设置）。它影响排列，但从不作为门槛。先阅读匹配的 brand.md / product.md。
- surface——按上下文命名的细粒度类型。一个界面位于某个 register 之下；界面来自对话，从不是固定集合。商店横跨两者——营销外壳是 brand，结账/账户流程是 product。
输入：从对话中规划。除此之外，唯一的输入是用户提供的内容——简报、PRD、描述、参考 URL，或他们指向的现有材料；不会自动加载任何内容。如果用户交来现有内容或先前的计划，就据此排列；否则从意图出发规划。
适用场景
适用于在视觉设计之前先确定页面结构与流程的场景，例如规划落地页、仪表盘、表单、设置页、结账流程等界面的区域布局与屏幕流转。
限制
- 只规划结构——从不嵌入视觉决策（颜色、字体、间距、令牌）、文案字符串或需求 ID（fr-1、m1、j1、us-3）。
- 界面和主题从对话中推导；没有固定的项目类型。
- 每个界面需命名 register（brand 或 product）；它影响排列，但从不作为形状的门槛。
- 为每个界面规划真实条件——其在窄视口上的重排及其内容量（无/典型/多）——作为叙述中的结构意图，而非像素或断点。
- 绘制低保真线框图——字形代替内容；计划保持灰度和内容盲，以便在任何设计下都成立。
- 先修补 frontmatter 区域树，再修补叙述它的正文，使两者保持同步。