Files
sar/.claude/skills/wds-4-ux-design/workflow-sketch.md
julian 17c08e6392 chore: initial monorepo scaffold + WDS Phase 1+2 artifacts
- Nx 22.7 monorepo (pnpm 11.1, TypeScript 5.9, Node 24)
- apps/api: NestJS 11 (CJS conforme CODING-RULES.md PGD-DB-004)
- apps/web: React 19 + Vite 8 (ESM)
- libs/shared/api-interface: Zod contract base
- Docker Compose dev: Postgres 18, Valkey 8, MinIO, Mailpit
- WDS artifacts:
  - design-artifacts/A-Product-Brief/ (5 docs canônicos + 16 dialogs)
  - design-artifacts/B-Trigger-Map/ (hub + 4 personas + feature impact)
- Stack canon: STACK.md v2.2 + CODING-RULES.md v2.0 + brand.md
- AGENTS.md + README.md como entrada para devs/agentes

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-27 14:34:20 +00:00

1.3 KiB

name, description
name description
workflow-sketch Analyze user-provided sketches (photos, screenshots, wireframes) and translate them into structured page specifications.

[K] Share Sketches — Interpret User Sketches

Goal: Analyze user-provided sketches (photos, screenshots, wireframes) and translate them into structured page specifications.

When to use: When the user has sketched something on paper, in a tool, or wants to share visual references for the agent to interpret.


INITIALIZATION

Read design log at {output_folder}/_progress/00-design-log.md before starting.

Entry

User provides sketch (image file, photo, or description of sketch).

Steps

Execute steps in ./steps-k/:

Step File Purpose
01 step-01-sketch-analysis.md Analyze and interpret the sketch

Reference data:

  • ./data/guides/SKETCH-TEXT-ANALYSIS-GUIDE.md — sketch analysis methodology
  • ./data/guides/SKETCH-TEXT-QUICK-REFERENCE.md — quick reference
  • ./data/object-types/ — component identification

AFTER COMPLETION

After sketch analysis, the page returns to step-01-exploration.md's flow. The sketch analysis feeds into the wireframe/spec sync step — the calling step handles design log updates and transition options.