claudegoodies
Skill

sketch

From NousResearch

Throwaway HTML mockups: 2-3 design variants to compare.

Generates 2-3 standalone HTML mockup variants of a UI screen for visual comparison before building.

Use it when

  • User wants to see a design direction before committing to it
  • Comparing layout or aesthetic options (e.g. compact vs airy)
  • Need quick disposable mockups, not production components
  • Exploring a screen with different design stances (density, emphasis, layout)

Skip it if

  • Need a production-ready component, not throwaway HTML
  • Design is already locked, just build it
  • Want a polished one-off artifact or a diagram instead
  • If gsd-sketch is installed, this is the lighter version without state tracking

Facts

Repository
NousResearch/hermes-agent
Status
Actively maintained
Last commit
Source file
skills/creative/sketch/SKILL.md

Source preview

The instructions Claude Code reads when this skill runs.

# Sketch

Use this skill when the user wants to **see a design direction before committing** to one — exploring a UI/UX idea as disposable HTML mockups. The point is to generate 2-3 interactive variants so the user can compare visual directions side-by-side, not to produce shippable code.

Load this when the user says things like "sketch this screen", "show me what X could look like", "compare layout A vs B", "give me 2-3 takes on this UI", "let me see some variants", "mockup this before I build".

## When NOT to use this

- User wants a production component — use `claude-design` or build it properly
- User wants a polished one-off HTML artifact (landing page, deck) — `claude-design`
- User wants a diagram — `excalidraw`, `architecture-diagram`
- The design is already locked — just build it

## If the user has the full GSD system installed

If `gsd-sketch` shows up as a sibling skill (installed via `npx get-shit-done-cc --hermes`), prefer **`gsd-sketch`** for the full workflow: persistent `.planning/sketches/` with MANIFEST, frontier mode analysis, consistency audits across past sketches, and integration with the rest of GSD. This skill is the lightweight standalone version — one-off sketching without the state machinery.

## Core method

```
intake  →  variants  →  head-to-head  →  pick winner (or iterate)
```

### 1. Intake (skip if the user already gave you enough)

Before g
View full source on GitHub →

Other skills