design-improvement

Solid

WHAT - Browser-grounded iterative design improvement. Consumes design-assessment findings, defines direction, prioritizes safe vs ambiguous changes, implements within existing design system, runs app, captures rendered evidence via browser, reviews and iterates. Reuses evidence model — no new scoring framework.

AI & Automation 14 stars 4 forks Updated today MIT

Install

View on GitHub

Quality Score: 82/100

Stars 20%
39
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Design Improvement (WHAT) Close the loop from **assessment → implementation → rendered verification**. Use this skill when the user wants to act on `design-assessment` (or `frontend-design-review`) findings, improve an existing interface, or run a browser-grounded iteration loop. **Composition, not duplication:** Orchestrates `design-assessment`, `frontend-design`, `frontend-design-review`, `web-design-guidelines`, `playwright-cli` / `chrome-devtools`, `figma` and accessibility — delegates work, does not copy their instructions. ## Default guardrails 1. **Consume assessment findings** — start from a `design-assessment` scorecard / `frontend-design-review` output (Blocking/Major/Minor + evidence links). If no assessment exists, offer to run `design-assessment` first; do not invent findings. 2. Reuse the single evidence model: `observation / impact / severity / effort / confidence / evidence / screens / recommended fix` plus 1–5 scale, `3 = Defined`, `Not assessed`, confidence `High/Medium/Low`, and `output-handshake` before final artifacts. Do not introduce `72/100` or other synthetic scores. 3. Do not assume code is good without **rendered evidence** (screenshot/recording via browser). Implement → run → capture → inspect → compare → iterate. Where browser/vision unavailable, use text-only heuristic and mark **Low confidence — browser/vision unavailable**. 4. Do not auto-push to default branch or create tickets/docs without explicit approval. L2 controlled mutations for ...

Details

Author
ulises-jeremias
Repository
ulises-jeremias/agent-toolkit
Created
3 weeks ago
Last Updated
today
Language
V
License
MIT

Integrates with

Bundled in these plugins

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Solid

design-assessment

WHAT - Evidence-based design-unit assessment orchestrated by project-assessment. Evaluates visual hierarchy, UX friction, interaction, a11y, responsiveness, design-system compliance, and distinctiveness with severity/confidence evidence citations. Reuses project-assessment-evidence semantics — no second framework.

14 Updated today
ulises-jeremias
Web & Frontend Listed

design

Audit and fix the design of interfaces that already exist in files, across 17 modes (checkup, smell, review, deslop, typeset, recolor, motion, interaction, relayout, responsive, redesign, tokenize, setup, finish, refine, voice, surface). Use this whenever the user types "/design" or "design" followed by a mode name or a target file. Also use it, without waiting for the word "design", whenever someone says a screen looks generic, AI-generated, templated, sloppy, boring, flat, weak, unfinished, or "like every other landing page", or asks to audit, critique, review, de-slop, restyle, recolor, retype, relayout, tighten, polish, or ship-check an existing page or component. Trigger on complaints about a hero, feature cards, spacing, type hierarchy, color palette, motion, hover or focus states, empty and error states, dark mode, or responsive behavior in code that is already written. For inventing a brand new interface from nothing, prefer the frontend-design skill; this skill is for UI that is already in files.

0 Updated 3 weeks ago
adnanalpolink
Web & Frontend Featured

critique

Evaluate design from a UX perspective, assessing visual hierarchy, information architecture, emotional resonance, cognitive load, and overall quality with quantitative scoring, persona-based testing, automated anti-pattern detection, and actionable feedback. Use when the user asks to review, critique, evaluate, or give feedback on a design or component.

45 Updated today
YuDefine