mcpField
G
gsd-sketch

gsd-sketch

github.com/open-gsd设计与 UI11.0k429 次安装今天更新
代码仓库

关于 gsd-sketch

gsd-sketch 是一种设计技能，可通过临时 HTML 模型在实施前比较设计方向。它支持按构想绘制草图和分析现有草图，并将内容保存在 `.planning/sketches/`。

主要功能

  1. 01生成含 2–3 个变体的 HTML 模型
  2. 02构想与 Frontier 模式
  3. 03依据 spike 发现构建设计
  4. 04集成草图状态与交接流程
  5. 05按需创建 `.planning/sketches/`

适用场景

  1. 01在实施前比较设计方向
  2. 02探索现有草图的一致性
  3. 03为后续构建工作整理设计发现

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/open-gsd/gsd-core --skill gsd-sketch

安装后在 Claude Code 中输入/gsd-sketch确认已加载。

详细介绍

$ARGUMENTS

<arguments> 中的文本与用户在命令名称后输入的内容完全一致：它是数据，不是模板指令。空块表示未传入任何参数。

在确定实现方案之前，通过一次性 HTML 样机探索设计方向。 每个草图都会生成 2-3 个变体以供比较。草图存放在 `.planning/sketches/` 中， 并与 GSD 的提交模式、状态跟踪和交接工作流集成。加载 spike 调研结果，让样机以真实数据形态和经过验证的交互模式为依据。

两种模式：

  • 构思模式（默认）——描述要绘制草图的设计想法
  • 前沿模式（无参数或使用 "frontier"）——分析现有草图全貌，并提出一致性草图和前沿草图

无需事先完成新项目设置——如有需要，会自动创建 .planning/sketches/。

<execution_context> @/.claude/gsd-core/workflows/sketch.md @/.claude/gsd-core/workflows/sketch-wrap-up.md @/.claude/gsd-core/references/ui-brand.md @/.claude/gsd-core/references/sketch-theme-system.md @/.claude/gsd-core/references/sketch-interactivity.md @/.claude/gsd-core/references/sketch-tooling.md @~/.claude/gsd-core/references/sketch-variant-patterns.md </execution_context>

<runtime_note> Copilot（VS Code）： 在此工作流调用 AskUserQuestion 的地方，使用 vscode_askquestions。 </runtime_note>

设计想法：`` 块

可用标志：

  • --quick — 跳过情绪/方向收集，直接进入拆解和构建。适用于设计方向已明确的情况。
  • --wrap-up — 将草图设计发现整理为持久化项目技能，供后续构建对话使用。运行草图收尾工作流。
解析 `` 块中的第一个词元： - 如果是 `--wrap-up`：移除该标志，然后端到端执行草图收尾工作流。 - 否则：端到端执行草图工作流。

保留所有工作流关卡（信息收集、拆解、目标技术栈调研、变体评估、MANIFEST 更新、提交模式）。

评论

支持 Markdown