gsd:sketch

Agent Skills › davepoon/buildwithclaude › gsd:sketch

gsd:sketch

GitHub

通过生成一次性HTML原型探索UI设计方向，支持idea和frontier两种模式，自动创建目录并产出2-3个变体供比较，集成到规划工作流中。

plugins/gsd/skills/sketch/SKILL.md davepoon/buildwithclaude

Trigger Scenarios

需要探索UI设计方向快速生成HTML原型进行对比

Install

npx skills add davepoon/buildwithclaude --skill gsd:sketch -g -y

More Options

Non-standard path

npx skills add https://github.com/davepoon/buildwithclaude/tree/main/plugins/gsd/skills/sketch -g -y

Use without installing

npx skills use davepoon/buildwithclaude@gsd:sketch

指定 Agent (Claude Code)

npx skills add davepoon/buildwithclaude --skill gsd:sketch -a claude-code -g -y

安装 repo 全部 skill

npx skills add davepoon/buildwithclaude --all -g -y

预览 repo 内 skill

npx skills add davepoon/buildwithclaude --list

SKILL.md

Frontmatter

{
    "name": "gsd:sketch",
    "description": "Sketch UI\/design ideas with throwaway HTML mockups, or propose what to sketch next (frontier mode)",
    "allowed-tools": [
        "Read",
        "Write",
        "Edit",
        "Bash",
        "Grep",
        "Glob",
        "AskUserQuestion",
        "WebSearch",
        "WebFetch",
        "mcp__context7__resolve-library-id",
        "mcp__context7__query-docs"
    ],
    "argument-hint": "[design idea to explore] [--quick] [--text] or [frontier]"
}

Explore design directions through throwaway HTML mockups before committing to implementation. Each sketch produces 2-3 variants for comparison. Sketches live in `.planning/sketches/` and integrate with GSD commit patterns, state tracking, and handoff workflows. Loads spike findings to ground mockups in real data shapes and validated interaction patterns.

Two modes:

Idea mode (default) — describe a design idea to sketch
Frontier mode (no argument or "frontier") — analyzes existing sketch landscape and proposes consistency and frontier sketches

Does not require /gsd:new-project — auto-creates .planning/sketches/ if needed.

<execution_context> @${CLAUDE_PLUGIN_ROOT}/workflows/sketch.md @${CLAUDE_PLUGIN_ROOT}/references/ui-brand.md @${CLAUDE_PLUGIN_ROOT}/references/sketch-theme-system.md @${CLAUDE_PLUGIN_ROOT}/references/sketch-interactivity.md @${CLAUDE_PLUGIN_ROOT}/references/sketch-tooling.md @${CLAUDE_PLUGIN_ROOT}/references/sketch-variant-patterns.md </execution_context>

<runtime_note> Copilot (VS Code): Use vscode_askquestions wherever this workflow calls AskUserQuestion. </runtime_note>

Design idea: $ARGUMENTS

Available flags:

--quick — Skip mood/direction intake, jump straight to decomposition and building. Use when the design direction is already clear.

Execute the sketch workflow from @${CLAUDE_PLUGIN_ROOT}/workflows/sketch.md end-to-end. Preserve all workflow gates (intake, decomposition, target stack research, variant evaluation, MANIFEST updates, commit patterns).

Version History

502fc01 Current 2026-07-05 15:14

Metadata

Files: 0
Version: 50c89fc
Hash: 00a5eba7
Indexed: 2026-07-05 15:14

gsd:sketch

gsd:sketch

Trigger Scenarios

Install

SKILL.md

Version History

Same Skill Collection

Metadata

文库