designerlisted

Generate a DESIGN.md design system for any project — for people with zero design knowledge. Use when the user starts UI work, says 'design', 'make it look good', 'designer', 'landing page for', 'design system', or mentions components, layouts, colors, fonts, or a site whose look they love.
Tariq-himself/opencode-maker-kit · ★ 0 · Web & Frontend · score 70

Install: claude install-skill Tariq-himself/opencode-maker-kit

# Designer — Zero-Knowledge Design Phase Produces a `DESIGN.md` in the project root: a plain-text design contract (Google Stitch format) that any AI agent reads to generate visually consistent UI. Works for ANY product type — SaaS, stores, restaurants, portfolios, fintech, anything. `<INPUT>` = the project/page description from $ARGUMENTS or conversation. ## Stage 1 — Understand the request Extract silently (don't ask yet): product type/industry, target audience, page type (landing/dashboard/store...), tech stack if mentioned. ## Stage 2 — Three simple questions (no jargon) Ask ONE batch, options labeled "(Recommended)" where applicable: 1. **Feeling** — 4 mood options mapped to real style families, e.g.: - "Clean & trustworthy (Recommended)" → minimalism / corporate clarity - "Bold & energetic" → brutalism / vivid accents - "Premium & luxurious" → editorial / dark elegance - "Warm & friendly" → soft UI / rounded organic 2. **Reference** — "Any website whose look you love? (paste URL or name, or skip)" 3. **Light or dark** — with a recommendation based on product type (e.g., dev tools → dark). If reference URL given: WebFetch it and note its palette/type/layout as secondary input. ## Stage 3 — Design intelligence (hybrid) ### Path A — ui-ux-pro-max installed? Look for `ui-ux-pro-max/scripts/search.py` under: `.claude/skills/`, `.opencode/skills/`, `.config/opencode/skills/`, `~/.claude/skills/`. If found, run: ``` python3 <path>/search.py "<product type key