From booskills
Critiques frontend UI/UX implementation and design quality: visual hierarchy, spacing, typography, interaction states, accessibility, component structure. Use for "review my UI," "does this look right," screenshot critiques, component quality checks. Do NOT use for backend code review; use boo-reviewing-code. Do NOT use for building new UI; use boo-building-ui.
How this skill is triggered — by the user, by Claude, or both
Slash command
/booskills:boo-critiquing-frontendThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Classify small/medium/large from the number of components, screens, or flows to critique. Default: small (single component or screen). At medium+, dispatch `user-experience-designer`. Accept `$size` override.
Classify small/medium/large from the number of components, screens, or flows to critique. Default: small (single component or screen). At medium+, dispatch user-experience-designer. Accept $size override.
references/design-guidance.md for the canonical design rules (color, typography, layout, motion, interaction, absolute bans, AI slop test).ls frontend/src/components/ui/ and only reference primitives that exist. If the directory does not exist or is empty, stop and report.user-experience-designer for a full UX audit.ls frontend/src/components/ui/ and only reference primitives that exist. If missing, stop and report.mcp__paseo__*) are available, spawn each agent persona as an attached Paseo subagent with create_agent (detached: false, notifyOnFinish: true; for an opencode provider also pass settings.modeId: "build" and settings.features.auto_accept: true) so every persona appears in the operator's Paseo agent track. Resolve each persona's provider/model from the active preset's agents map in ~/.paseo/orchestration-preferences.json; supervise on the finish notification (never poll) and read each result with get_agent_activity.agents/<name>.md persona and apply its lens in sequential passes.concurrency value in ~/.paseo/orchestration-preferences.json. When it is 1 (local heavy-weight presets, around 27b/35b or larger on a single llama-swap server), dispatch subagents STRICTLY ONE AT A TIME: launch one, wait for its finish notification and read its result, then launch the next. This overrides any parallel fan-out. Absent or higher concurrency means parallel fan-out is fine.git add -A. Prove any edits with git diff --stat.# Frontend Critique: <target>
## Severity Summary
| Severity | Count |
|--------------|-------|
| Broken | N |
| Inconsistent | N |
| Polish | N |
## Findings
### Broken
**B1: <title>**
- **Location:** `component/file.tsx:line`
- **Principle violated:** <UX principle, WCAG criterion, or design rule>
- **Issue:** <description>
- **Suggested fix:** <concrete change>
### Inconsistent
**I1: <title>**
- **Location:** `component/file.tsx:line`
- **Issue:** <description>
- **Suggested fix:** <concrete change>
### Polish
**P1: <title>**
- **Location:** `component/file.tsx:line`
- **Issue:** <description>
- **Suggested fix:** <concrete change>
## Claims I did not verify
- <anything assumed or not checked>
ls frontend/src/components/ui/ fails. Report the actual path and stop.Creates, edits, and optimizes skills for Claude Code, including drafting, evaluating with test prompts, iterating on performance, and improving skill descriptions for better triggering accuracy.
npx claudepluginhub indifferentketchup/booskills --plugin booskills