Skip to content
Back to skills

Sketch

ASecurity

Sketch UI/design ideas with throwaway HTML mockups, or propose what to sketch next (frontier mode)

  • 3,543 stars
  • 0 votes
  • 0 copies
  • 0 views
  • Added May 27, 2026
data-aibash

Works with

  • vscode
  • mcp

Security analysis

A100/100

Scanned May 27, 2026

npx -y skills add davepoon/buildwithclaude --skill sketch --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Sketch?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Sketch
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/davepoon-sketch/badge)](https://www.skillsdirectory.com/skills/davepoon-sketch)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro
SKILL.md
---
name: gsd:sketch
description: Sketch UI/design ideas with throwaway HTML mockups, or propose what to sketch next (frontier mode)
argument-hint: "[design idea to explore] [--quick] [--text] or [frontier]"
allowed-tools:
  - Read
  - Write
  - Edit
  - Bash
  - Grep
  - Glob
  - AskUserQuestion
  - WebSearch
  - WebFetch
  - mcp__context7__resolve-library-id
  - mcp__context7__query-docs
---
<objective>
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.
</objective>

<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>

<context>
Design idea: $ARGUMENTS

**Available flags:**
- `--quick` — Skip mood/direction intake, jump straight to decomposition and building. Use when the design direction is already clear.
</context>

<process>
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).
</process>

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…